mehedi
/
skilld-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: add breadcrumbs

This commit is contained in:
mehedi-hasan 2024-05-03 18:15:24 +06:00
parent b9ea061a2e
commit 5c76a8b444
16 changed files with 114 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/(dashboard)/dashboard/accounts/add/page.tsx
View File

@ -1,12 +1,21 @@
import AddAccountForm from "@/components/add-account-form"; import AddAccountForm from "@/components/add-account-form";
import Breadcrumb from "@/components/breadcrumb";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Accounts", link: "/dashboard/accounts" },
{ title: "Add" },
];
export default function SettingsDisplayPage() { export default function SettingsDisplayPage() {
return ( return (
<ScrollArea className="h-[calc(100vh-53px)]"> <ScrollArea className="h-[calc(100vh-53px)]">
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6">
<Breadcrumb items={breadcrumbItems} />
<div className="w-full h-full flex justify-center items-center">
<Card className="max-w-[700px] w-full"> <Card className="max-w-[700px] w-full">
<CardHeader> <CardHeader>
<CardTitle className="mb-4 font-bold text-xl"> <CardTitle className="mb-4 font-bold text-xl">
@ -20,6 +29,7 @@ export default function SettingsDisplayPage() {
</CardContent> </CardContent>
</Card> </Card>
</div> </div>
</div>
<ScrollBar /> <ScrollBar />
</ScrollArea> </ScrollArea>
); );

34
src/app/(dashboard)/dashboard/api-communications/add/page.tsx
View File

@ -1,24 +1,34 @@
import AddAPICommunicationForm from "@/components/add-api-communication-form"; import AddAPICommunicationForm from "@/components/add-api-communication-form";
import Breadcrumb from "@/components/breadcrumb";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Api Communications", link: "/dashboard/api-communications" },
{ title: "Add" },
];
export default function SettingsDisplayPage() { export default function SettingsDisplayPage() {
return ( return (
<ScrollArea className="h-[calc(100vh-53px)]"> <ScrollArea className="h-[calc(100vh-53px)]">
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6">
<Card className="max-w-[700px] w-full"> <Breadcrumb items={breadcrumbItems} />
<CardHeader> <div className="w-full h-full flex justify-center items-center">
<CardTitle className="mb-4 font-bold text-xl"> <Card className="max-w-[700px] w-full mb-8">
Create API Communication <CardHeader>
</CardTitle> <CardTitle className="mb-4 font-bold text-xl">
<Separator /> Create API Communication
</CardHeader> </CardTitle>
<Separator />
</CardHeader>
<CardContent> <CardContent>
<AddAPICommunicationForm /> <AddAPICommunicationForm />
</CardContent> </CardContent>
</Card> </Card>
</div>
</div> </div>
<ScrollBar /> <ScrollBar />
</ScrollArea> </ScrollArea>

19
src/app/(dashboard)/dashboard/change-password/page.tsx
View File

@ -1,17 +1,18 @@
import Breadcrumb from "@/components/breadcrumb";
import ChangePasswordForm from "@/components/change-password-form"; import ChangePasswordForm from "@/components/change-password-form";
import { Separator } from "@/components/ui/separator";
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Change Password" },
];
export default function SettingsProfilePage() { export default function SettingsProfilePage() {
return ( return (
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 h-full w-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full">
{/* <div> <Breadcrumb items={breadcrumbItems} />
<h3 className="text-lg font-medium">Change Password</h3> <div className="w-full flex justify-center">
<p className="text-sm text-muted-foreground"> <ChangePasswordForm />
Change your password carefully.
</p>
</div> </div>
<Separator /> */}
<ChangePasswordForm />
</div> </div>
); );
} }

12
src/app/(dashboard)/dashboard/configurations/add/page.tsx
View File

@ -2,11 +2,20 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
import AddConfigurationForm from "@/components/add-configuration-form"; import AddConfigurationForm from "@/components/add-configuration-form";
import Breadcrumb from "@/components/breadcrumb";
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Configurations", link: "/dashboard/configurations" },
{ title: "Add" },
];
export default function SettingsDisplayPage() { export default function SettingsDisplayPage() {
return ( return (
<ScrollArea className="h-[calc(100vh-53px)]"> <ScrollArea className="h-[calc(100vh-53px)]">
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6">
<Breadcrumb items={breadcrumbItems} />
<div className="w-full h-full flex justify-center items-center">
<Card className="max-w-[700px] w-full"> <Card className="max-w-[700px] w-full">
<CardHeader> <CardHeader>
<CardTitle className="mb-4 font-bold text-xl"> <CardTitle className="mb-4 font-bold text-xl">
@ -20,6 +29,7 @@ export default function SettingsDisplayPage() {
</CardContent> </CardContent>
</Card> </Card>
</div> </div>
</div>
<ScrollBar /> <ScrollBar />
</ScrollArea> </ScrollArea>
); );

34
src/app/(dashboard)/dashboard/organizations/add/page.tsx
View File

@ -2,23 +2,33 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
import AddOrganizationForm from "@/components/add-organization-form"; import AddOrganizationForm from "@/components/add-organization-form";
import Breadcrumb from "@/components/breadcrumb";
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Organizations", link: "/dashboard/organizations" },
{ title: "Add" },
];
export default function SettingsDisplayPage() { export default function SettingsDisplayPage() {
return ( return (
<ScrollArea className="h-[calc(100vh-53px)]"> <ScrollArea className="h-[calc(100vh-53px)]">
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6">
<Card className="max-w-[700px] w-full"> <Breadcrumb items={breadcrumbItems} />
<CardHeader> <div className="w-full h-full flex justify-center items-center">
<CardTitle className="mb-4 font-bold text-xl"> <Card className="max-w-[700px] w-full">
Create Organization <CardHeader>
</CardTitle> <CardTitle className="mb-4 font-bold text-xl">
<Separator /> Create Organization
</CardHeader> </CardTitle>
<Separator />
</CardHeader>
<CardContent> <CardContent>
<AddOrganizationForm /> <AddOrganizationForm />
</CardContent> </CardContent>
</Card> </Card>
</div>
</div> </div>
<ScrollBar /> <ScrollBar />
</ScrollArea> </ScrollArea>

15
src/app/(dashboard)/dashboard/preferences/page.tsx
View File

@ -1,5 +1,6 @@
"use client"; "use client";
import Breadcrumb from "@/components/breadcrumb";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { import {
Card, Card,
@ -76,6 +77,11 @@ const dummyPreferences = [
}, },
]; ];
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Preferences" },
];
const Page = () => { const Page = () => {
const [preference, setPreference] = useState({ const [preference, setPreference] = useState({
readability: [50], readability: [50],
@ -91,8 +97,10 @@ const Page = () => {
}); });
return ( return (
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full">
<Card className="max-w-[600px] w-full"> <Breadcrumb items={breadcrumbItems} />
<div className="w-full h-full flex justify-center">
<Card className="max-w-[600px] w-full h-fit">
<CardHeader> <CardHeader>
<CardTitle className="mb-4 font-bold text-xl"> <CardTitle className="mb-4 font-bold text-xl">
Code Evaluation Criteria Code Evaluation Criteria
@ -106,7 +114,7 @@ const Page = () => {
(item: { id: number; name: string; description: string }) => ( (item: { id: number; name: string; description: string }) => (
<div key={item.id} className="space-y-6"> <div key={item.id} className="space-y-6">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<h4 className="capitalize font-semibold">{item.name}</h4> <h4 className="capitalize font-semibold text-sm sm:text-base">{item.name}</h4>
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<CircleHelp className="size-4" /> <CircleHelp className="size-4" />
@ -137,6 +145,7 @@ const Page = () => {
</CardFooter> </CardFooter>
</Card> </Card>
</div> </div>
</div>
); );
}; };

14
src/app/(dashboard)/dashboard/users/add/page.tsx
View File

@ -1,4 +1,5 @@
import AddUserForm from "@/components/add-user-form"; import AddUserForm from "@/components/add-user-form";
import Breadcrumb from "@/components/breadcrumb";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { import {
Card, Card,
@ -10,11 +11,19 @@ import {
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
const breadcrumbItems = [
{ title: "Dashboard", link: "/dashboard" },
{ title: "Users", link: "/dashboard/users" },
{ title: "Add" },
];
export default function SettingsDisplayPage() { export default function SettingsDisplayPage() {
return ( return (
<ScrollArea className="h-[calc(100vh-53px)]"> <ScrollArea className="h-[calc(100vh-53px)]">
<div className="flex-1 space-y-4 p-4 md:p-8 pt-6 w-full h-full flex justify-center items-center"> <div className="flex-1 space-y-4 p-4 md:p-8 pt-6">
<Card className="max-w-[700px] w-full"> <Breadcrumb items={breadcrumbItems} />
<div className="w-full h-full flex justify-center items-center">
<Card className="max-w-[700px] w-full mb-8">
<CardHeader> <CardHeader>
<CardTitle className="mb-4 font-bold text-xl"> <CardTitle className="mb-4 font-bold text-xl">
Create User Create User
@ -26,6 +35,7 @@ export default function SettingsDisplayPage() {
<AddUserForm /> <AddUserForm />
</CardContent> </CardContent>
</Card> </Card>
</div>
</div> </div>
<ScrollBar /> <ScrollBar />
</ScrollArea> </ScrollArea>

2
src/components/add-account-form.tsx
View File

@ -132,7 +132,7 @@ export default function AddAccountForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

2
src/components/add-api-communication-form.tsx
View File

@ -227,7 +227,7 @@ export default function AddAPICommunicationForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

2
src/components/add-configuration-form.tsx
View File

@ -76,7 +76,7 @@ export default function AddConfigurationForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

2
src/components/add-criteria-form.tsx
View File

@ -92,7 +92,7 @@ export default function AddCriteriaForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

2
src/components/add-organization-form.tsx
View File

@ -61,7 +61,7 @@ export default function AddOrganizationForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

2
src/components/add-skill-form.tsx
View File

@ -61,7 +61,7 @@ export default function AddSkillForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

2
src/components/add-user-form.tsx
View File

@ -209,7 +209,7 @@ export default function AddUserForm() {
</FormItem> </FormItem>
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>

7
src/components/change-password-form.tsx
View File

@ -87,6 +87,7 @@ export default function ChangePasswordForm() {
<FormLabel>Current Password</FormLabel> <FormLabel>Current Password</FormLabel>
<FormControl> <FormControl>
<Input <Input
type="password"
placeholder="Enter your current password..." placeholder="Enter your current password..."
{...field} {...field}
/> />
@ -103,6 +104,7 @@ export default function ChangePasswordForm() {
<FormLabel>New Password</FormLabel> <FormLabel>New Password</FormLabel>
<FormControl> <FormControl>
<Input <Input
type="password"
placeholder="Enter your new password..." placeholder="Enter your new password..."
{...field} {...field}
/> />
@ -119,6 +121,7 @@ export default function ChangePasswordForm() {
<FormLabel>Confirm New Password</FormLabel> <FormLabel>Confirm New Password</FormLabel>
<FormControl> <FormControl>
<Input <Input
type="password"
placeholder="Confirm the new password..." placeholder="Confirm the new password..."
{...field} {...field}
/> />
@ -127,7 +130,9 @@ export default function ChangePasswordForm() {
</FormItem> </FormItem>
)} )}
/> />
<Button type="submit" className="w-full" size="lg">Reset Password</Button> <Button type="submit" className="w-full" size="lg">
Reset Password
</Button>
</form> </form>
</Form> </Form>
</CardContent> </CardContent>

2
src/components/evaluation-form.tsx
View File

@ -310,7 +310,7 @@ export default function AddEvaluationForm() {
)} )}
/> />
<div className="flex items-center gap-4"> <div className="flex items-center gap-4 flex-col sm:flex-row">
<Button className="w-full" size="lg"> <Button className="w-full" size="lg">
Create Create
</Button> </Button>