humas
/
web-humas-fe
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:pull

This commit is contained in:
Anang Yusman 2024-11-18 14:01:35 +07:00
parent ea15b175c7
commit 84ac4fa2b9
28 changed files with 207 additions and 363 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
app/(admin)/admin/(basic-form)/form-costum/page.tsx
View File

@ -1,30 +0,0 @@
"use client"
import { Image } from "@nextui-org/react";
export default function CustumPage() {
return (
<div className="flex h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-4">
<div className="bg-blue-900 mx-[24px] h-[120px] my-5 rounded-md">
<div>
<div className="flex flex-row justify-between items-center">
<div>
<p className="text-2xl font-semibold ml-5 ">Custum Form</p>
<p className="text-gray-300 ml-5">custom designed elemnt</p>
</div>
<div className="pr-5">
<Image
width={110}
alt="NextUI hero Image"
src="https://modernize-nextjs-dark.vercel.app/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FChatBc.3d875e2e.png&w=256&q=75"
/>
</div>
</div>
</div>
</div >
{/* <CreateCustomForm /> */}
</div>
</div>
);
}

38
app/(admin)/admin/(basic-form)/form-horizontal/page.tsx
View File

@ -1,38 +0,0 @@
"use client"
import CreateCustomForm from "@/components/form/form-costum/custom-form";
import CreateHorizontalForm from "@/components/form/form-horizontal/custom-form";
import CreateWizardForm from "@/components/form/form-wizard/wizard-form";
import AuthtorsTable from "@/components/table/authors-table";
import CustomerTable from "@/components/table/customers-table";
import InvoiceTable from "@/components/table/invoice-table";
import UserTable from "@/components/table/article-table";
import UsersTable from "@/components/table/users-table";
import { Card, Divider, Image } from "@nextui-org/react";
export default function HorizontalPage() {
return (
<div className="flex h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-4">
<div className="bg-blue-900 h-[120px] my-5 rounded-md mx-[24px]">
<div>
<div className="flex flex-row justify-between items-center">
<div>
<p className="text-2xl font-semibold ml-5 ">Horizontal Form</p>
<p className="text-gray-500 ml-5">Home<span className="text-black">{" > "}</span> <span className=" text-white">Horizontal Form</span></p>
</div>
<div className="pr-5">
<Image
width={110}
alt="NextUI hero Image"
src="https://modernize-nextjs-dark.vercel.app/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FChatBc.3d875e2e.png&w=256&q=75"
/>
</div>
</div>
</div>
</div >
<CreateHorizontalForm />
</div>
</div>
);
}

40
app/(admin)/admin/(basic-form)/form-layout/page.tsx
View File

@ -1,40 +0,0 @@
"use client"
import CreateLayoutForm from "@/components/form/form-layout/layout-form";
import CreateValidationForm from "@/components/form/form-validation/validation-form";
import CreateWizardForm from "@/components/form/form-wizard/wizard-form";
import AuthtorsTable from "@/components/table/authors-table";
import CustomerTable from "@/components/table/customers-table";
import InvoiceTable from "@/components/table/invoice-table";
import UserTable from "@/components/table/article-table";
import UsersTable from "@/components/table/users-table";
import { Card, Divider, Image } from "@nextui-org/react";
import { useEffect, useState } from "react";
export default function FormLayoutPage() {
return (
<div className="flex h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-4">
<div className="bg-blue-900 mx-[24px] h-[120px] my-5 rounded-md">
<div>
<div className="flex flex-row justify-between items-center">
<div>
<p className="text-2xl font-semibold ml-5 text-white">Form Layout</p>
<p className="text-white ml-5">Home<span className="text-white">{" > "}</span> <span className=" text-white">Form Layout</span></p>
</div>
<div className="pr-5">
<Image
width={110}
alt="NextUI hero Image"
src="https://modernize-nextjs-dark.vercel.app/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FChatBc.3d875e2e.png&w=256&q=75"
/>
</div>
</div>
</div>
</div >
<CreateLayoutForm />
</div>
</div>
);
}

37
app/(admin)/admin/(basic-form)/form-validation/page.tsx
View File

@ -1,37 +0,0 @@
"use client"
import CreateValidationForm from "@/components/form/form-validation/validation-form";
import CreateWizardForm from "@/components/form/form-wizard/wizard-form";
import AuthtorsTable from "@/components/table/authors-table";
import CustomerTable from "@/components/table/customers-table";
import InvoiceTable from "@/components/table/invoice-table";
import UserTable from "@/components/table/article-table";
import UsersTable from "@/components/table/users-table";
import { Card, Divider, Image } from "@nextui-org/react";
export default function ValidationPage() {
return (
<div className="flex h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-4">
<div className="bg-blue-900 mx-[24px] h-[120px] my-5 rounded-md">
<div>
<div className="flex flex-row justify-between items-center">
<div>
<p className="text-2xl font-semibold ml-5 ">Form Validation</p>
<p className="text-gray-500 ml-5">Home<span className="text-black">{" > "}</span> <span className=" text-white">Form Validation</span></p>
</div>
<div className="pr-5">
<Image
width={110}
alt="NextUI hero Image"
src="https://modernize-nextjs-dark.vercel.app/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FChatBc.3d875e2e.png&w=256&q=75"
/>
</div>
</div>
</div>
</div >
<CreateValidationForm />
</div>
</div>
);
}

32
app/(admin)/admin/(basic-form)/form-vertical/page.tsx
View File

@ -1,32 +0,0 @@
"use client"
import CreateValidationForm from "@/components/form/form-validation/validation-form";
import CreateVerticalForm from "@/components/form/form-vertical/vertical-form";
import { Card, Divider, Image } from "@nextui-org/react";
export default function VerticalPage() {
return (
<div className="flex h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-4">
<div className="bg-blue-900 mx-[24px] h-[120px] my-5 rounded-md">
<div>
<div className="flex flex-row justify-between items-center">
<div>
<p className="text-2xl font-semibold ml-5 ">Vertical Form</p>
<p className="text-gray-500 ml-5">Home<span className="text-black">{" > "}</span> <span className=" text-white">Verical Form</span></p>
</div>
<div className="pr-5">
<Image
width={110}
alt="NextUI hero Image"
src="https://modernize-nextjs-dark.vercel.app/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FChatBc.3d875e2e.png&w=256&q=75"
/>
</div>
</div>
</div>
</div >
<CreateVerticalForm />
</div>
</div>
);
}

44
app/(admin)/admin/(basic-form)/form-wizard/page.tsx
View File

@ -1,44 +0,0 @@
"use client"
import CreateWizardForm from "@/components/form/form-wizard/wizard-form";
import AuthtorsTable from "@/components/table/authors-table";
import CustomerTable from "@/components/table/customers-table";
import InvoiceTable from "@/components/table/invoice-table";
import UserTable from "@/components/table/article-table";
import UsersTable from "@/components/table/users-table";
import { Card, Divider, Image } from "@nextui-org/react";
export default function WizardPage() {
return (
<div className="flex h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-4">
<div className="bg-blue-900 mx-[24px] h-[120px] my-5 rounded-md">
<div>
<div className="flex flex-row justify-between items-center">
<div>
<p className="text-2xl font-semibold ml-5 ">Form Wizard</p>
<p className="text-white ml-5">This is Form WizardPage</p>
</div>
<div className="pr-5">
<Image
width={110}
alt="NextUI hero Image"
src="https://modernize-nextjs-dark.vercel.app/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FChatBc.3d875e2e.png&w=256&q=75"
/>
</div>
</div>
</div>
</div >
<Card className="rounded-md mx-[24px]">
<p className="ml-5 mt-5 text-lg">Form Wizard</p>
<Divider className="w-full my-3" />
<div>
<CreateWizardForm />
</div>
</Card>
</div>
</div>
);
}

16
app/(admin)/admin/magazine/create/page.tsx Normal file
View File

@ -0,0 +1,16 @@
import CreateMagazineForm from '@/components/form/magazine/magazine-form'
import MagazineTable from '@/components/table/magazine/magazine-table'
import { Card } from '@nextui-org/react'
import React from 'react'
const AdminMagazineCreate = () => {
return (
<div className=" h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-3">
<CreateMagazineForm />
</div>
</div>
)
}
export default AdminMagazineCreate

0
app/admin/magazine/detail/page.tsx → app/(admin)/admin/magazine/detail/page.tsx
View File

14
app/(admin)/admin/magazine/page.tsx Normal file
View File

@ -0,0 +1,14 @@
import MagazineTable from '@/components/table/magazine/magazine-table'
import React from 'react'
const AdminMagazine = () => {
return (
<div className=" h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-3">
<MagazineTable />
</div>
</div>
)
}
export default AdminMagazine

5
app/admin/master/master-menu/menu-data/create/page.tsx → app/(admin)/admin/master/master-menu/menu-data/create/page.tsx
View File

@ -1,11 +1,14 @@
import CreateMagazineForm from '@/components/form/magazine/magazine-form' import CreateMagazineForm from '@/components/form/magazine/magazine-form'
import CreateMenuDataForm from '@/components/form/master/master-menu/menu-data/menu-data-form' import CreateMenuDataForm from '@/components/form/master/master-menu/menu-data/menu-data-form'
import MagazineTable from '@/components/table/magazine/magazine-table' import MagazineTable from '@/components/table/magazine/magazine-table'
import { Card } from '@nextui-org/react'
import React from 'react' import React from 'react'
const AdminMenuDataCreate = () => { const AdminMenuDataCreate = () => {
return ( return (
<div><CreateMenuDataForm /></div> <Card className="h-[96vh] rounded-md my- ml-3 border bg-transparent">
<CreateMenuDataForm />
</Card>
) )
} }

17
app/(admin)/admin/master/master-menu/menu-data/page.tsx Normal file
View File

@ -0,0 +1,17 @@
import MagazineTable from '@/components/table/magazine/magazine-table'
import MenuDataTable from '@/components/table/master/master-menu/menu-data/menu-data-table'
import { Image } from '@nextui-org/react'
import React from 'react'
const AdminMenuData = () => {
return (
<div className=" h-[96vh] overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-3">
<MenuDataTable />
</div>
</div>
)
}
export default AdminMenuData

5
app/admin/master/master-module/create/page.tsx → app/(admin)/admin/master/master-module/create/page.tsx
View File

@ -2,11 +2,14 @@ import CreateMagazineForm from '@/components/form/magazine/magazine-form'
import CreateMenuDataForm from '@/components/form/master/master-menu/menu-data/menu-data-form' import CreateMenuDataForm from '@/components/form/master/master-menu/menu-data/menu-data-form'
import CreateMasterModuleForm from '@/components/form/master/master-module/master-module-form' import CreateMasterModuleForm from '@/components/form/master/master-module/master-module-form'
import MagazineTable from '@/components/table/magazine/magazine-table' import MagazineTable from '@/components/table/magazine/magazine-table'
import { Card } from '@nextui-org/react'
import React from 'react' import React from 'react'
const AdminMasterModuleCreate = () => { const AdminMasterModuleCreate = () => {
return ( return (
<div><CreateMasterModuleForm /></div> <Card className="h-[96vh] rounded-md my- ml-3 border bg-transparent">
<CreateMasterModuleForm />
</Card>
) )
} }

6
app/admin/master/master-module/page.tsx → app/(admin)/admin/master/master-module/page.tsx
View File

@ -5,7 +5,11 @@ import React from 'react'
const AdminMasterModule = () => { const AdminMasterModule = () => {
return ( return (
<div><MasterModuleTable /></div> <div className=" h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-3">
<MasterModuleTable />
</div>
</div>
) )
} }

5
app/admin/master/master-user-level/create/page.tsx → app/(admin)/admin/master/master-user-level/create/page.tsx
View File

@ -3,11 +3,14 @@ import CreateMenuDataForm from '@/components/form/master/master-menu/menu-data/m
import CreateMasterModuleForm from '@/components/form/master/master-module/master-module-form' import CreateMasterModuleForm from '@/components/form/master/master-module/master-module-form'
import CreateMasterUserLevelForm from '@/components/form/master/master-user-level/master-user-level-form' import CreateMasterUserLevelForm from '@/components/form/master/master-user-level/master-user-level-form'
import MagazineTable from '@/components/table/magazine/magazine-table' import MagazineTable from '@/components/table/magazine/magazine-table'
import { Card } from '@nextui-org/react'
import React from 'react' import React from 'react'
const AdminMasterUserLevelCreate = () => { const AdminMasterUserLevelCreate = () => {
return ( return (
<div><CreateMasterUserLevelForm /></div> <Card className="h-[96vh] rounded-md my- ml-3 border bg-transparent">
<CreateMasterUserLevelForm />
</Card>
) )
} }

6
app/admin/master/master-user-level/page.tsx → app/(admin)/admin/master/master-user-level/page.tsx
View File

@ -6,7 +6,11 @@ import React from 'react'
const AdminMasterUserLevel = () => { const AdminMasterUserLevel = () => {
return ( return (
<div><MasterUserLevelTable /></div> <div className=" h-[96vh] overflow-x-hidden overflow-y-scroll gap-0 grid rounded-lg border-small ml-4">
<div className="px-3">
<MasterUserLevelTable />
</div>
</div>
) )
} }

11
app/admin/magazine/create/page.tsx
View File

@ -1,11 +0,0 @@
import CreateMagazineForm from '@/components/form/magazine/magazine-form'
import MagazineTable from '@/components/table/magazine/magazine-table'
import React from 'react'
const AdminMagazineCreate = () => {
return (
<div><CreateMagazineForm /></div>
)
}
export default AdminMagazineCreate

10
app/admin/magazine/page.tsx
View File

@ -1,10 +0,0 @@
import MagazineTable from '@/components/table/magazine/magazine-table'
import React from 'react'
const AdminMagazine = () => {
return (
<div><MagazineTable /></div>
)
}
export default AdminMagazine

11
app/admin/master/master-menu/menu-data/page.tsx
View File

@ -1,11 +0,0 @@
import MagazineTable from '@/components/table/magazine/magazine-table'
import MenuDataTable from '@/components/table/master/master-menu/menu-data/menu-data-table'
import React from 'react'
const AdminMenuData = () => {
return (
<div><MenuDataTable /></div>
)
}
export default AdminMenuData

41
components/form/magazine/magazine-form.tsx
View File

@ -2,7 +2,6 @@
import { Button } from "@nextui-org/button"; import { Button } from "@nextui-org/button";
import { Card, Checkbox, CheckboxGroup, Divider, Input, Radio, RadioGroup, Select, SelectItem, Slider, Switch, Tab, Table, Tabs, Textarea, User } from "@nextui-org/react"; import { Card, Checkbox, CheckboxGroup, Divider, Input, Radio, RadioGroup, Select, SelectItem, Slider, Switch, Tab, Table, Tabs, Textarea, User } from "@nextui-org/react";
import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"; import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { TimesIcon } from "@/components/icons";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { close, error, loading } from "@/config/swal"; import { close, error, loading } from "@/config/swal";
@ -13,6 +12,7 @@ import { useForm } from "react-hook-form";
import * as z from "zod"; import * as z from "zod";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import parse from 'html-react-parser'; import parse from 'html-react-parser';
import { TimesIcon } from "@/components/icons";
export default function CreateMagazineForm() { export default function CreateMagazineForm() {
const router = useRouter(); const router = useRouter();
@ -122,25 +122,24 @@ export default function CreateMagazineForm() {
return ( return (
<div className="mx-3 my-5"> <div className="mx-3 my-5">
<div className="flex flex-col gap-3 mb-4"> <div className="flex flex-col gap-3 mb-4">
<Card className="w-full bg-white"> <Card className="w-full ">
<div className="w-full mr-2 p-5 "> <div className="w-full mr-2 p-5 ">
<form method="POST" onSubmit={handleSubmit(onSubmit)}> <form method="POST" onSubmit={handleSubmit(onSubmit)}>
<> <>
<div className="flex flex-col gap-1"> <div className="flex flex-col gap-1">
<div className="flex flex-row justify-between items-center mt-[24px] gap-3"> <div className="flex flex-row justify-between items-center mt-[10px] gap-3">
<div className="flex flex-col w-6/12"> <div className="flex flex-col w-6/12">
<Input <Input
type="text" type="text"
label="Title" label="Name"
id="title"
{...register("title")} {...register("title")}
placeholder="...." placeholder="......"
labelPlacement="outside" labelPlacement="outside"
className="w-9/12 font-semibold" className="w-9/12 font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -164,9 +163,9 @@ export default function CreateMagazineForm() {
labelPlacement="outside" labelPlacement="outside"
className="w-9/12 font-semibold" className="w-9/12 font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -183,7 +182,7 @@ export default function CreateMagazineForm() {
</div> </div>
<div className="mt-1"> <div className="mt-1">
<p className="text-black text-sm font-semibold my-2">Description</p> <p className="text-black dark:text-white text-sm font-semibold my-2">Description</p>
<JoditEditor <JoditEditor
ref={editor} ref={editor}
value={content} value={content}
@ -191,12 +190,12 @@ export default function CreateMagazineForm() {
className="dark:text-black" className="dark:text-black"
/> />
</div> </div>
<p className="text-sm text-black mt-2 pb-1 pt-3">Upload File (Opsional)</p> <p className="text-sm text-black dark:text-white mt-2 pb-1 pt-3">Upload File (Opsional)</p>
<div className="w-full bg-transparent"> <div className="w-full bg-transparent">
<div className="flex items-center justify-center w-full "> <div className="flex items-center justify-center w-full ">
<label <label
htmlFor="dropzone-file" htmlFor="dropzone-file"
className="flex flex-col items-center justify-center w-full h-32 border-2 border-gray-100 border-dashed rounded-lg cursor-pointer bg-gray-50 dark:hover:bg-bray-800 hover:bg-gray-100 dark:border-gray-600 dark:hover:border-gray-500 dark:hover:bg-gray-600" className="flex flex-col items-center justify-center w-full h-32 border-2 border-black border-dashed rounded-lg cursor-pointer dark:bg-black dark:hover:bg-bray-800 hover:bg-gray-100 dark:border-gray-600 dark:hover:border-gray-500 dark:hover:bg-gray-600"
> >
<div className="flex flex-col items-center justify-center pt-5 pb-6 "> <div className="flex flex-col items-center justify-center pt-5 pb-6 ">
<svg <svg
@ -213,9 +212,6 @@ export default function CreateMagazineForm() {
d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"
></path> ></path>
</svg> </svg>
{/* <p className="mb-2 text-sm text-gray-500 dark:text-gray-400">
Drag and drop files here
</p> */}
<p className="mb-2 text-sm text-gray-500 dark:text-gray-400"> <p className="mb-2 text-sm text-gray-500 dark:text-gray-400">
{/* or{" "} */} {/* or{" "} */}
<span className="font-semibold underline text-amber-800"> <span className="font-semibold underline text-amber-800">
@ -223,11 +219,16 @@ export default function CreateMagazineForm() {
</span> </span>
</p> </p>
</div> </div>
<input id="dropzone-file" type="file" multiple accept=".doc,.docx,.pdf,.ppt,.pptx,.xlsx,.csv" className="hidden" onChange={handleFileChange} /> <input
id="dropzone-file"
type="file"
multiple accept=".doc,.docx,.pdf,.ppt,.pptx,.xlsx,.csv"
className="hidden"
onChange={handleFileChange} />
</label> </label>
</div> </div>
</div> </div>
<p className="text-tiny text-default ">Support file format in word, excel, ppt and pdf</p> <p className="text-tiny text-default dark:text-white ">Support file format in word, excel, ppt and pdf</p>
<div className="flex flex-wrap gap-3"> <div className="flex flex-wrap gap-3">
{files?.length > 0 && {files?.length > 0 &&
files?.map((list: File) => ( files?.map((list: File) => (

58
components/form/master/master-menu/menu-data/menu-data-form.tsx
View File

@ -138,7 +138,7 @@ export default function CreateMenuDataForm() {
return ( return (
<div className="mx-3 my-5"> <div className="mx-3 my-5">
<div className="flex flex-col gap-3 mb-4"> <div className="flex flex-col gap-3 mb-4">
<Card className="w-full bg-white"> <Card className="w-full ">
<div className="w-full mr-2 p-5 "> <div className="w-full mr-2 p-5 ">
<form method="POST" onSubmit={handleSubmit(onSubmit)}> <form method="POST" onSubmit={handleSubmit(onSubmit)}>
<> <>
@ -154,9 +154,9 @@ export default function CreateMenuDataForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -180,9 +180,9 @@ export default function CreateMenuDataForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -197,7 +197,7 @@ export default function CreateMenuDataForm() {
)} )}
</div> </div>
<div className="mt-3 "> <div className="mt-3 ">
<p className="text-black text-sm mb-1 font-semibold">Main Module</p> <p className="dark:text-white text-black text-sm mb-1 font-semibold">Main Module</p>
<Select <Select
variant="bordered" variant="bordered"
selectionMode="single" selectionMode="single"
@ -208,27 +208,27 @@ export default function CreateMenuDataForm() {
classNames={{ classNames={{
mainWrapper: "rounded", mainWrapper: "rounded",
listboxWrapper: listboxWrapper:
"bg-white w-full !text-indigo-500 text-center font-bold", "bg-black w-full !text-indigo-500 text-center font-bold",
popoverContent: "bg-white !text-indigo-500", popoverContent: "bg-black !text-indigo-500",
trigger: trigger:
"border-1 border-gray-200 hover:!bg-gray-100 !text-black", "border-1 border-gray-200 hover:!bg-white dark:hover:!bg-black !text-black dark:!text-white",
}} }}
listboxProps={{ listboxProps={{
itemClasses: { itemClasses: {
base: [ base: [
"!text-left", "!text-left",
"!bg-white", "!bg-black",
"text-indigo-500 ", "text-indigo-500 ",
"data-[selectable=true]:!text-indigo-500", "data-[selectable=true]:!text-indigo-500",
"data-[pressed=true]:text-indigo-500", "data-[pressed=true]:text-indigo-500",
"data-[hover=true]:!text-indigo-300", "data-[hover=true]:!text-indigo-300",
], ],
wrapper: ["!bg-white border-none"], wrapper: ["!bg-black border-none"],
}, },
}} }}
renderValue={(items) => { renderValue={(items) => {
return items.map((item) => ( return items.map((item) => (
<span key={item.props?.value} className="text-black text-xs"> <span key={item.props?.value} className="text-black dark:text-white text-xs">
{item.textValue} {item.textValue}
</span> </span>
)); ));
@ -244,7 +244,7 @@ export default function CreateMenuDataForm() {
</Select> </Select>
</div> </div>
<div className="text-black mt-3"> <div className="text-black mt-3">
<label className="text-black text-sm dark:text-black">Have sub module ?</label> <label className="dark:text-white text-black text-sm ">Have sub module ?</label>
<RadioGroup <RadioGroup
orientation="horizontal" orientation="horizontal"
id="radio-banned" id="radio-banned"
@ -252,7 +252,7 @@ export default function CreateMenuDataForm() {
onChange={handleHaveChildren} onChange={handleHaveChildren}
defaultValue={haveChildren} defaultValue={haveChildren}
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
description: "!text-black", description: "!text-black",
base: "!text-black", base: "!text-black",
wrapper: "!text-black", wrapper: "!text-black",
@ -260,7 +260,7 @@ export default function CreateMenuDataForm() {
> >
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="no" value="no"
> >
@ -268,7 +268,7 @@ export default function CreateMenuDataForm() {
</Radio> </Radio>
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="yes" value="yes"
> >
@ -278,7 +278,7 @@ export default function CreateMenuDataForm() {
</div> </div>
{haveChildren === "yes" && ( {haveChildren === "yes" && (
<div className="mt-3 "> <div className="mt-3 ">
<p className="text-black text-sm mb-1 font-semibold">Sub Module</p> <p className="text-black dark:text-white text-sm mb-1 font-semibold">Sub Module</p>
<Select <Select
variant="bordered" variant="bordered"
selectionMode="single" selectionMode="single"
@ -289,27 +289,27 @@ export default function CreateMenuDataForm() {
classNames={{ classNames={{
mainWrapper: "rounded", mainWrapper: "rounded",
listboxWrapper: listboxWrapper:
"bg-white w-full !text-indigo-500 text-center font-bold", "bg-black w-full !text-indigo-500 text-center font-bold",
popoverContent: "bg-white !text-indigo-500", popoverContent: "bg-black !text-indigo-500",
trigger: trigger:
"border-1 border-gray-200 hover:!bg-gray-100 !text-black", "border-1 border-gray-200 hover:!bg-white dark:hover:!bg-black !text-white",
}} }}
listboxProps={{ listboxProps={{
itemClasses: { itemClasses: {
base: [ base: [
"!text-left", "!text-left",
"!bg-white", "!bg-black",
"text-indigo-500 ", "text-indigo-500 ",
"data-[selectable=true]:!text-indigo-500", "data-[selectable=true]:!text-indigo-500",
"data-[pressed=true]:text-indigo-500", "data-[pressed=true]:text-indigo-500",
"data-[hover=true]:!text-indigo-300", "data-[hover=true]:!text-indigo-300",
], ],
wrapper: ["!bg-white border-none"], wrapper: ["!bg-black border-none"],
}, },
}} }}
renderValue={(items) => { renderValue={(items) => {
return items.map((item) => ( return items.map((item) => (
<span key={item.props?.value} className="text-black text-xs"> <span key={item.props?.value} className="text-black dark:text-white text-xs">
{item.textValue} {item.textValue}
</span> </span>
)); ));
@ -326,7 +326,7 @@ export default function CreateMenuDataForm() {
</div> </div>
)} )}
<div className="text-black mt-3"> <div className="text-black mt-3">
<label className="text-black text-sm dark:text-black">Status</label> <label className="text-black dark:text-white text-sm dark:text-black">Status</label>
<RadioGroup <RadioGroup
orientation="horizontal" orientation="horizontal"
id="radio-banned" id="radio-banned"
@ -334,7 +334,7 @@ export default function CreateMenuDataForm() {
onChange={handleActive} onChange={handleActive}
defaultValue={active} defaultValue={active}
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
description: "!text-black", description: "!text-black",
base: "!text-black", base: "!text-black",
wrapper: "!text-black", wrapper: "!text-black",
@ -342,7 +342,7 @@ export default function CreateMenuDataForm() {
> >
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="1" value="1"
> >
@ -350,7 +350,7 @@ export default function CreateMenuDataForm() {
</Radio> </Radio>
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="2" value="2"
> >

28
components/form/master/master-module/master-module-form.tsx
View File

@ -138,7 +138,7 @@ export default function CreateMasterModuleForm() {
return ( return (
<div className="mx-3 my-5"> <div className="mx-3 my-5">
<div className="flex flex-col gap-3 mb-4"> <div className="flex flex-col gap-3 mb-4">
<Card className="w-full bg-white"> <Card className="w-full ">
<div className="w-full mr-2 p-5 "> <div className="w-full mr-2 p-5 ">
<form method="POST" onSubmit={handleSubmit(onSubmit)}> <form method="POST" onSubmit={handleSubmit(onSubmit)}>
<> <>
@ -154,9 +154,9 @@ export default function CreateMasterModuleForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -180,9 +180,9 @@ export default function CreateMasterModuleForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -206,9 +206,9 @@ export default function CreateMasterModuleForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -223,7 +223,7 @@ export default function CreateMasterModuleForm() {
)} )}
</div> </div>
<div className="text-black mt-3"> <div className="text-black mt-3">
<label className="text-black text-sm dark:text-black">Status</label> <label className="text-black dark:text-white text-sm ">Status</label>
<RadioGroup <RadioGroup
orientation="horizontal" orientation="horizontal"
id="radio-banned" id="radio-banned"
@ -231,7 +231,7 @@ export default function CreateMasterModuleForm() {
onChange={handleActive} onChange={handleActive}
defaultValue={active} defaultValue={active}
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
description: "!text-black", description: "!text-black",
base: "!text-black", base: "!text-black",
wrapper: "!text-black", wrapper: "!text-black",
@ -239,7 +239,7 @@ export default function CreateMasterModuleForm() {
> >
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="1" value="1"
> >
@ -247,7 +247,7 @@ export default function CreateMasterModuleForm() {
</Radio> </Radio>
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="2" value="2"
> >

81
components/form/master/master-user-level/master-user-level-form.tsx
View File

@ -155,7 +155,7 @@ export default function CreateMasterUserLevelForm() {
return ( return (
<div className="mx-3 my-5"> <div className="mx-3 my-5">
<div className="flex flex-col gap-3 mb-4"> <div className="flex flex-col gap-3 mb-4">
<Card className="w-full bg-white"> <Card className="w-full ">
<div className="w-full mr-2 p-5 "> <div className="w-full mr-2 p-5 ">
<form method="POST" onSubmit={handleSubmit(onSubmit)}> <form method="POST" onSubmit={handleSubmit(onSubmit)}>
<> <>
@ -171,9 +171,9 @@ export default function CreateMasterUserLevelForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -197,9 +197,9 @@ export default function CreateMasterUserLevelForm() {
labelPlacement="outside" labelPlacement="outside"
className=" font-semibold" className=" font-semibold"
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
input: "!text-black hover:!text-white focus:!text-white", input: "!text-black dark:!text-white hover:!text-black focus:!text-black",
inputWrapper: "max-h-[40px] bg-transparant border text-white", inputWrapper: "max-h-[40px] bg-transparant border text-black",
}} }}
startContent={ startContent={
<div className="pointer-events-none flex items-center"> <div className="pointer-events-none flex items-center">
@ -213,8 +213,8 @@ export default function CreateMasterUserLevelForm() {
</p> </p>
)} )}
</div> </div>
<div className="mt-3 "> <div className="my-3 ">
<p className="text-black text-sm mb-1 font-semibold">Level Number</p> <p className="text-black dark:text-white text-sm mb-1 font-semibold">Level Number</p>
<Select <Select
variant="bordered" variant="bordered"
labelPlacement="outside" labelPlacement="outside"
@ -225,24 +225,31 @@ export default function CreateMasterUserLevelForm() {
classNames={{ classNames={{
mainWrapper: "rounded", mainWrapper: "rounded",
listboxWrapper: listboxWrapper:
"bg-white w-full !text-indigo-500 text-center font-bold", "bg-black w-full !text-indigo-500 text-center font-bold",
popoverContent: "bg-white !text-indigo-500", popoverContent: "bg-black !text-indigo-500",
trigger: trigger:
"border-1 border-gray-200 hover:!bg-gray-100 !text-black", "border-1 border-gray-200 hover:!bg-white dark:hover:!bg-black !text-black dark:!text-white",
}} }}
listboxProps={{ listboxProps={{
itemClasses: { itemClasses: {
base: [ base: [
"!text-left", "!text-left",
"!bg-white", "!bg-black",
"text-indigo-500 ", "text-indigo-500 ",
"data-[selectable=true]:!text-indigo-500", "data-[selectable=true]:!text-indigo-500",
"data-[pressed=true]:text-indigo-500", "data-[pressed=true]:text-indigo-500",
"data-[hover=true]:!text-indigo-300", "data-[hover=true]:!text-indigo-300",
], ],
wrapper: ["!bg-white border-none"], wrapper: ["!bg-black border-none"],
}, },
}} }}
renderValue={(items) => {
return items.map((item) => (
<span key={item.props?.value} className="text-black dark:text-white text-xs">
{item.textValue}
</span>
));
}}
> >
<SelectSection showDivider title="List Level"> <SelectSection showDivider title="List Level">
{LevelList.map((list: any) => ( {LevelList.map((list: any) => (
@ -253,8 +260,8 @@ export default function CreateMasterUserLevelForm() {
</SelectSection> </SelectSection>
</Select> </Select>
</div> </div>
{/* <div className="mt-3 "> <div className="mt-3 ">
<p className="text-black text-sm mb-1 font-semibold">Parent LevelId</p> <p className="text-black dark:text-white text-sm mb-1 font-semibold">Parent LevelId</p>
<Select <Select
variant="bordered" variant="bordered"
selectionMode="single" selectionMode="single"
@ -265,27 +272,27 @@ export default function CreateMasterUserLevelForm() {
classNames={{ classNames={{
mainWrapper: "rounded", mainWrapper: "rounded",
listboxWrapper: listboxWrapper:
"bg-white w-full !text-indigo-500 text-center font-bold", "bg-black w-full !text-indigo-500 text-center font-bold",
popoverContent: "bg-white !text-indigo-500", popoverContent: "bg-black !text-indigo-500",
trigger: trigger:
"border-1 border-gray-200 hover:!bg-gray-100 !text-black", "border-1 border-gray-200 hover:!bg-white dark:hover:!bg-black !text-black dark:!text-white",
}} }}
listboxProps={{ listboxProps={{
itemClasses: { itemClasses: {
base: [ base: [
"!text-left", "!text-left",
"!bg-white", "!bg-black",
"text-indigo-500 ", "text-indigo-500 ",
"data-[selectable=true]:!text-indigo-500", "data-[selectable=true]:!text-indigo-500",
"data-[pressed=true]:text-indigo-500", "data-[pressed=true]:text-indigo-500",
"data-[hover=true]:!text-indigo-300", "data-[hover=true]:!text-indigo-300",
], ],
wrapper: ["!bg-white border-none"], wrapper: ["!bg-black border-none"],
}, },
}} }}
renderValue={(items) => { renderValue={(items) => {
return items.map((item) => ( return items.map((item) => (
<span key={item.props?.value} className="text-black text-xs"> <span key={item.props?.value} className="text-black dark:text-white text-xs">
{item.textValue} {item.textValue}
</span> </span>
)); ));
@ -301,7 +308,7 @@ export default function CreateMasterUserLevelForm() {
</Select> </Select>
</div> </div>
<div className="mt-3 "> <div className="mt-3 ">
<p className="text-black text-sm mb-1 font-semibold">Provinsi</p> <p className="text-black dark:text-white text-sm mb-1 font-semibold">Provinsi</p>
<Select <Select
variant="bordered" variant="bordered"
selectionMode="single" selectionMode="single"
@ -312,27 +319,27 @@ export default function CreateMasterUserLevelForm() {
classNames={{ classNames={{
mainWrapper: "rounded", mainWrapper: "rounded",
listboxWrapper: listboxWrapper:
"bg-white w-full !text-indigo-500 text-center font-bold", "bg-black w-full !text-indigo-500 text-center font-bold",
popoverContent: "bg-white !text-indigo-500", popoverContent: "bg-black !text-indigo-500",
trigger: trigger:
"border-1 border-gray-200 hover:!bg-gray-100 !text-black", "border-1 border-gray-200 hover:!bg-white dark:hover:!bg-black !text-black dark:!text-white",
}} }}
listboxProps={{ listboxProps={{
itemClasses: { itemClasses: {
base: [ base: [
"!text-left", "!text-left",
"!bg-white", "!bg-black",
"text-indigo-500 ", "text-indigo-500 ",
"data-[selectable=true]:!text-indigo-500", "data-[selectable=true]:!text-indigo-500",
"data-[pressed=true]:text-indigo-500", "data-[pressed=true]:text-indigo-500",
"data-[hover=true]:!text-indigo-300", "data-[hover=true]:!text-indigo-300",
], ],
wrapper: ["!bg-white border-none"], wrapper: ["!bg-black border-none"],
}, },
}} }}
renderValue={(items) => { renderValue={(items) => {
return items.map((item) => ( return items.map((item) => (
<span key={item.props?.value} className="text-black text-xs"> <span key={item.props?.value} className="text-black dark:text-white text-xs">
{item.textValue} {item.textValue}
</span> </span>
)); ));
@ -347,18 +354,24 @@ export default function CreateMasterUserLevelForm() {
</SelectSection> </SelectSection>
</Select> </Select>
</div> </div>
<div className="text-black"> <div className="text-black mt-3">
<p className=" text-black ">Status</p> <p className=" text-black dark:text-white ">Status</p>
<RadioGroup <RadioGroup
orientation="horizontal" orientation="horizontal"
id="radio-banned" id="radio-banned"
className="text-gray-950 mb-2" className="text-gray-950 mb-2"
onChange={handleActive} onChange={handleActive}
defaultValue={active} defaultValue={active}
classNames={{
label: "!text-black dark:!text-white",
description: "!text-black",
base: "!text-black",
wrapper: "!text-black",
}}
> >
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="true" value="true"
> >
@ -366,14 +379,14 @@ export default function CreateMasterUserLevelForm() {
</Radio> </Radio>
<Radio <Radio
classNames={{ classNames={{
label: "!text-black", label: "!text-black dark:!text-white",
}} }}
value="false" value="false"
> >
Inactive Inactive
</Radio> </Radio>
</RadioGroup> </RadioGroup>
</div> */} </div>
<div className="flex flex-row gap-3 my-3"> <div className="flex flex-row gap-3 my-3">
<Link href="/admin/master/master-user-level"> <Link href="/admin/master/master-user-level">
<Button <Button

19
components/icons.tsx
View File

@ -1477,3 +1477,22 @@ export const GoogleIcon = ({
</path> </path>
</svg> </svg>
); );
export const TimesIcon = ({
size,
height = 24,
width = 24,
fill = "currentColor",
...props
}: IconSvgProps) => (
<svg
xmlns="http://www.w3.org/2000/svg"
height={size || height}
width={size || width}
viewBox="0 0 24 24"
fill={fill}
{...props}
>
<path fill="currentColor" d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z" />
</svg>
);

8
components/sidebar/sidebar.tsx
View File

@ -97,7 +97,7 @@ const sideBarDummyData = [
name: "E-Magazine", name: "E-Magazine",
moduleId: 652, moduleId: 652,
moduleName: "Dashboard", moduleName: "Dashboard",
modulePathUrl: "/admin/pagination-basic", modulePathUrl: "/admin/magazine",
parentId: -1, parentId: -1,
icon: <TableIcon />, icon: <TableIcon />,
position: 1, position: 1,
@ -126,7 +126,7 @@ const sideBarDummyData = [
name: "Master Menu", name: "Master Menu",
moduleId: 652, moduleId: 652,
moduleName: "Form Custom", moduleName: "Form Custom",
modulePathUrl: "/admin/form-costum", modulePathUrl: "/admin/master/master-menu/menu-data",
parentId: -1, parentId: -1,
icon: <FormCustomIcon />, icon: <FormCustomIcon />,
position: 1, position: 1,
@ -140,7 +140,7 @@ const sideBarDummyData = [
name: "Master Module", name: "Master Module",
moduleId: 653, moduleId: 653,
moduleName: "Form Horizontal", moduleName: "Form Horizontal",
modulePathUrl: "/admin/form-horizontal", modulePathUrl: "/admin/master/master-module",
parentId: -1, parentId: -1,
icon: <FormHorizontalIcon />, icon: <FormHorizontalIcon />,
position: 1, position: 1,
@ -168,7 +168,7 @@ const sideBarDummyData = [
name: "Master User Levels", name: "Master User Levels",
moduleId: 655, moduleId: 655,
moduleName: "Form Layout", moduleName: "Form Layout",
modulePathUrl: "/admin/form-layout", modulePathUrl: "/admin/master/master-user-level",
parentId: -1, parentId: -1,
icon: <FormLayoutIcon />, icon: <FormLayoutIcon />,
position: 1, position: 1,

2
components/table/magazine/magazine-table.tsx
View File

@ -184,7 +184,7 @@ export default function MagazineTable() {
return ( return (
<> <>
<div className="mx-3 my-5"> <div className="mx-3 mb-5 mt-3">
<Link href="/admin/magazine/create" > <Link href="/admin/magazine/create" >
<Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Create New Magazine</Button> <Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Create New Magazine</Button>
</Link> </Link>

2
components/table/master/master-menu/menu-data/menu-data-table.tsx
View File

@ -193,7 +193,7 @@ export default function MenuDataTable() {
return ( return (
<> <>
<div className="mx-3 my-5"> <div className="mx-3 mb-5 mt-3">
<Link href="/admin/master/master-menu/menu-data/create" > <Link href="/admin/master/master-menu/menu-data/create" >
<Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Add Master Menu</Button> <Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Add Master Menu</Button>
</Link> </Link>

2
components/table/master/master-module/master-module-table.tsx
View File

@ -186,7 +186,7 @@ export default function MasterModuleTable() {
return ( return (
<> <>
<div className="mx-3 my-5"> <div className="mx-3 mb-5 mt-3">
<Link href="/admin/master/master-module/create" > <Link href="/admin/master/master-module/create" >
<Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Add Master Module</Button> <Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Add Master Module</Button>
</Link> </Link>

2
components/table/master/master-user-level/master-user-level-table.tsx
View File

@ -188,7 +188,7 @@ export default function MasterUserLevelTable() {
return ( return (
<> <>
<div className="mx-3 my-5"> <div className="mx-3 mb-5 mt-3">
<Link href="/admin/master/master-user-level/create" > <Link href="/admin/master/master-user-level/create" >
<Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Create New User Level</Button> <Button className="my-3 bg-blue-600 text-white" ><CreateIconIon />Create New User Level</Button>
</Link> </Link>