Berkay/evyos-frontend-development
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated living space added

Browse Source
This commit is contained in:
Berkay
2025-12-04 15:46:24 +03:00
parent 56b42bb906
commit 53e1f1e4fc
70 changed files with 1128 additions and 824 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/pages/users/add/form.tsx
View File

@@ -20,8 +20,8 @@ const UserForm = ({ refetchTable }: { refetchTable: () => void }) => {
expiryEnds: "",
isConfirmed: false,
isNotificationSend: false,
password: "",
rePassword: "",
// password: "",
// rePassword: "",
tag: "",
email: "",
phone: ""
@@ -31,6 +31,7 @@ const UserForm = ({ refetchTable }: { refetchTable: () => void }) => {
const [defaultSelection, setDefaultSelection] = useState<string>("")
const [selectedBuildIDS, setSelectedBuildIDS] = useState<string[]>([])
const [selectedCompanyIDS, setSelectedCompanyIDS] = useState<string[]>([])
const [personID, setPersonID] = useState<string>("")
const appendBuildID = (id: string) => setSelectedBuildIDS((prev) => (id && !selectedBuildIDS.includes(id) ? [...prev, id] : prev))
const appendCompanyID = (id: string) => setSelectedCompanyIDS((prev) => (id && !selectedCompanyIDS.includes(id) ? [...prev, id] : prev))
@@ -40,12 +41,12 @@ const UserForm = ({ refetchTable }: { refetchTable: () => void }) => {
const { handleSubmit } = form
const mutation = useAddUserMutation();
function onSubmit(values: UserAdd) { mutation.mutate({ data: values as any, selectedBuildIDS, selectedCompanyIDS, defaultSelection, refetchTable }); }
function onSubmit(values: UserAdd) { console.dir({ values, selectedBuildIDS, selectedCompanyIDS, defaultSelection, personID }); mutation.mutate({ data: values, selectedBuildIDS, selectedCompanyIDS, defaultSelection, personID, refetchTable }); }
return (
<div>
<PageAddUserSelections
selectedCompanyIDS={selectedCompanyIDS} selectedBuildingIDS={selectedBuildIDS} appendCompanyID={appendCompanyID} appendBuildingID={appendBuildID}
selectedCompanyIDS={selectedCompanyIDS} selectedBuildingIDS={selectedBuildIDS} appendCompanyID={appendCompanyID} appendBuildingID={appendBuildID} personID={personID} setPersonID={setPersonID}
removeCompanyID={removeCompanyID} removeBuildingID={removeBuildID} defaultSelection={defaultSelection} setDefaultSelection={setDefaultSelection}
/>
<Form {...form}>
@@ -82,7 +83,7 @@ const UserForm = ({ refetchTable }: { refetchTable: () => void }) => {
{/* PASSWORD / TAG */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
{/* <FormField
control={form.control}
name="password"
render={({ field }) => (
@@ -107,7 +108,7 @@ const UserForm = ({ refetchTable }: { refetchTable: () => void }) => {
<FormMessage />
</FormItem>
)}
/>
/> */}
<FormField
control={form.control}

6
frontend/pages/users/add/page.tsx
View File

@@ -9,15 +9,11 @@ const PageAddUser = () => {
const [limit, setLimit] = useState(10);
const [sort, setSort] = useState({ createdAt: 'desc' });
const [filters, setFilters] = useState({});
const { data, isLoading, error, refetch } = useGraphQlUsersList({ limit, skip: (page - 1) * limit, sort, filters });
return (
<>
<UserDataTableAdd
data={data?.data || []} totalCount={data?.totalCount || 0} currentPage={page} pageSize={limit}
onPageChange={setPage} onPageSizeChange={setLimit} refetchTable={refetch}
/>
<UserDataTableAdd data={data?.data || []} totalCount={data?.totalCount || 0} currentPage={page} pageSize={limit} onPageChange={setPage} onPageSizeChange={setLimit} refetchTable={refetch} />
<UserForm refetchTable={refetch} />
</>
)

21
frontend/pages/users/add/queries.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import { useMutation } from '@tanstack/react-query'
import { UserAdd } from './types'
import { UserAdd } from './schema'
import { toISOIfNotZ } from '@/lib/utils'
const fetchGraphQlUsersAdd = async (
@@ -8,15 +8,16 @@ const fetchGraphQlUsersAdd = async (
selectedBuildIDS: string[],
selectedCompanyIDS: string[],
defaultSelection: string,
personID: string,
refetchTable: () => void
): Promise<{ data: UserAdd | null; status: number }> => {
record.expiryStarts = toISOIfNotZ(record.expiryStarts);
record.expiryEnds = toISOIfNotZ(record.expiryEnds);
record.expiryStarts = record?.expiryStarts ? toISOIfNotZ(record.expiryStarts) : undefined;
record.expiryEnds = record?.expiryEnds ? toISOIfNotZ(record.expiryEnds) : undefined;
const payload = { ...record, person: personID, collectionTokens: { defaultSelection, selectedBuildIDS, selectedCompanyIDS } }
try {
const res = await fetch('/api/users/add', { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify({ ...record, selectedBuildIDS, selectedCompanyIDS, defaultSelection }) });
const res = await fetch('/api/users/add', { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify(payload) });
if (!res.ok) { const errorText = await res.text(); console.error('Test data API error:', errorText); throw new Error(`API error: ${res.status} ${res.statusText}`) }
const data = await res.json();
refetchTable();
const data = await res.json(); refetchTable();
return { data: data.data, status: res.status }
} catch (error) { console.error('Error fetching test data:', error); throw error }
};
@@ -24,8 +25,12 @@ const fetchGraphQlUsersAdd = async (
export function useAddUserMutation() {
return useMutation({
mutationFn: (
{ data, selectedBuildIDS, selectedCompanyIDS, defaultSelection, refetchTable }: { data: UserAdd, selectedBuildIDS: string[], selectedCompanyIDS: string[], defaultSelection: string, refetchTable: () => void }
) => fetchGraphQlUsersAdd(data, selectedBuildIDS, selectedCompanyIDS, defaultSelection, refetchTable),
{
data, selectedBuildIDS, selectedCompanyIDS, defaultSelection, personID, refetchTable
}: {
data: UserAdd, selectedBuildIDS: string[], selectedCompanyIDS: string[], defaultSelection: string, personID: string, refetchTable: () => void
}
) => fetchGraphQlUsersAdd(data, selectedBuildIDS, selectedCompanyIDS, defaultSelection, personID, refetchTable),
onSuccess: () => { console.log("User created successfully") },
onError: (error) => { console.error("Create user failed:", error) },
})

8
frontend/pages/users/add/schema.ts
View File

@@ -1,15 +1,15 @@
import { z } from "zod"
import { z } from "zod";
export const userAddSchema = z.object({
expiryStarts: z.string().optional(),
expiryEnds: z.string().optional(),
isConfirmed: z.boolean(),
isNotificationSend: z.boolean(),
password: z.string().min(6),
rePassword: z.string().min(6),
// password: z.string().min(6),
// rePassword: z.string().min(6),
tag: z.string().optional(),
email: z.string().email(),
phone: z.string().min(5),

181
frontend/pages/users/add/table/columns.tsx
View File

@@ -16,117 +16,6 @@ import { schema, schemaType } from "./schema"
import { dateToLocaleString } from "@/lib/utils"
import { Pencil, Trash } from "lucide-react"
function TableCellViewer({ item }: { item: schemaType }) {
const isMobile = useIsMobile();
return (
<Drawer direction={isMobile ? "bottom" : "right"}>
<DrawerTrigger asChild>
<Button variant="link" className="text-foreground w-fit px-0 text-left">
{item.email ?? "Unknown Email"}
</Button>
</DrawerTrigger>
<DrawerContent>
<DrawerHeader className="gap-1">
<h2 className="text-lg font-semibold">{item.email}</h2>
<p className="text-sm text-muted-foreground">
User details
</p>
</DrawerHeader>
<div className="flex flex-col gap-4 overflow-y-auto px-4 text-sm">
{/* BASIC INFO */}
<div className="grid grid-cols-2 gap-4">
<div>
<Label>Email</Label>
<Input value={item.email ?? ""} readOnly />
</div>
<div>
<Label>Phone</Label>
<Input value={item.phone ?? ""} readOnly />
</div>
<div>
<Label>Tag</Label>
<Input value={item.tag ?? ""} readOnly />
</div>
<div>
<Label>Active</Label>
<Input value={item.active ? "Active" : "Inactive"} readOnly />
</div>
</div>
<Separator />
{/* DATES */}
<div className="grid grid-cols-2 gap-4">
<div>
<Label>Created At</Label>
<Input
value={item.createdAt ? new Date(item.createdAt).toLocaleString() : ""}
readOnly
/>
</div>
<div>
<Label>Updated At</Label>
<Input
value={item.updatedAt ? new Date(item.updatedAt).toLocaleString() : ""}
readOnly
/>
</div>
</div>
<Separator />
{/* TOKENS */}
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="w-full">
Collection Tokens ({item.collectionTokens?.tokens?.length ?? 0})
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="w-72">
<DropdownMenuLabel>Tokens</DropdownMenuLabel>
<DropdownMenuSeparator />
{(item.collectionTokens?.tokens ?? []).length === 0 && (<DropdownMenuItem disabled>No tokens found</DropdownMenuItem>)}
{(item.collectionTokens?.tokens ?? []).map((t, i) => (
<DropdownMenuItem key={i} className="flex flex-col gap-2">
<div className="grid grid-cols-2 gap-2 w-full">
<Input value={t.prefix} readOnly />
<Input value={t.token} readOnly />
</div>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div>
<DrawerFooter>
<DrawerClose asChild>
<Button variant="outline">Close</Button>
</DrawerClose>
</DrawerFooter>
</DrawerContent>
</Drawer>
);
}
function DragHandle({ id }: { id: number }) {
const { attributes, listeners } = useSortable({ id })
return (
<Button {...attributes} {...listeners} variant="ghost" size="icon" className="text-muted-foreground size-7 hover:bg-transparent">
<IconGripVertical className="text-muted-foreground size-3" />
<span className="sr-only">Drag to reorder</span>
</Button>
)
}
export function DraggableRow({ row }: { row: Row<z.infer<typeof schema>> }) {
const { transform, transition, setNodeRef, isDragging } = useSortable({ id: row.original._id })
@@ -161,6 +50,16 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
accessorKey: "tag",
header: "Tag",
},
{
accessorKey: "isNotificationSend",
header: "Notificated?",
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "isEmailSend",
header: "Email Send?",
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "active",
header: "Active",
@@ -171,6 +70,11 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
header: "Confirmed",
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "deleted",
header: "Deleted",
cell: ({ getValue }) => getValue() ? (<div className="text-red-600 font-medium">Yes</div>) : (<div className="text-green-600 font-medium">No</div>),
},
{
accessorKey: "createdAt",
header: "Created",
@@ -191,57 +95,16 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
header: "Expiry Ends",
cell: ({ getValue }) => getValue() ? dateToLocaleString(getValue() as string) : "-",
},
{
accessorKey: "crypUuId",
header: "Encrypted UUID",
},
{
accessorKey: "history",
header: "History",
cell: ({ getValue }) => (<div className="truncate max-w-[150px] text-xs text-muted-foreground">{String(getValue() ?? "")}</div>),
},
{
accessorKey: "collectionTokens.tokens",
header: "Tokens",
header: "Default Token",
cell: ({ row }) => {
const tokens = row.original.collectionTokens?.tokens ?? [];
const defaultToken = row.original.collectionTokens?.default;
if (!tokens.length) return "-";
const defaultToken = row.original.collectionTokens?.defaultSelection;
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="h-8 px-2 text-xs">
Tokens ({tokens.length})
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="w-72">
<DropdownMenuLabel>Collection Tokens</DropdownMenuLabel>
<DropdownMenuSeparator />
{defaultToken && (
<>
<DropdownMenuItem>
<div className="flex flex-col w-full">
<span className="font-semibold">Default</span>
<span className="font-mono text-xs text-muted-foreground break-all">
{defaultToken}
</span>
</div>
</DropdownMenuItem>
<DropdownMenuSeparator />
</>
)}
{tokens.map((t, i) => (
<DropdownMenuItem key={i} className="flex flex-col items-start">
<div className="w-full flex justify-between">
<span className="font-medium">{t.prefix}</span>
<span className="font-mono text-muted-foreground break-all">
{t.token}
</span>
</div>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
defaultToken ? <div><div className="flex flex-col w-full">
<span className="font-semibold">Default</span>
<span className="font-mono text-xs text-muted-foreground break-all">{defaultToken}</span>
</div></div> : <div>No Default Token is registered.</div>
);
},
},
@@ -251,7 +114,7 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
cell: ({ row }) => {
return (
<div>
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/users/update/${row.original.uuid}`) }}>
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/users/update?uuid=${row.original.uuid}`) }}>
<Pencil />
</Button>
<Button className="bg-red-700 text-white border-red-700 mx-4" variant="outline" size="sm" onClick={() => { deleteHandler(row.original.uuid || "") }}>

2
frontend/pages/users/add/table/data-table.tsx
View File

@@ -100,7 +100,7 @@ export function UserDataTableAdd({
const dataIds = React.useMemo<UniqueIdentifier[]>(() => data?.map(({ _id }) => _id) || [], [data])
const deleteMutation = useDeleteUserMutation()
const deleteHandler = (id: string) => { deleteMutation.mutate({ uuid: id }); setTimeout(() => { refetchTable() }, 400) }
const deleteHandler = (id: string) => { deleteMutation.mutate({ uuid: id, refetchTable }) }
const columns = getColumns(router, deleteHandler);
const pagination = React.useMemo(() => ({ pageIndex: currentPage - 1, pageSize: pageSize, }), [currentPage, pageSize])
const totalPages = Math.ceil(totalCount / pageSize)

57
frontend/pages/users/add/table/schema.tsx
View File

@@ -2,46 +2,23 @@ import { z } from "zod";
export const schema = z.object({
_id: z.string(),
uuid: z.string().nullable().optional(),
expiryStarts: z.string().nullable().optional(),
expiryEnds: z.string().nullable().optional(),
isConfirmed: z.boolean().nullable().optional(),
deleted: z.boolean().nullable().optional(),
active: z.boolean().nullable().optional(),
crypUuId: z.string().nullable().optional(),
createdCredentialsToken: z.string().nullable().optional(),
updatedCredentialsToken: z.string().nullable().optional(),
confirmedCredentialsToken: z.string().nullable().optional(),
isNotificationSend: z.boolean().nullable().optional(),
isEmailSend: z.boolean().nullable().optional(),
refInt: z.number().nullable().optional(),
refId: z.string().nullable().optional(),
replicationId: z.number().nullable().optional(),
expiresAt: z.string().nullable().optional(),
resetToken: z.string().nullable().optional(),
password: z.string().nullable().optional(),
history: z.array(z.string()).optional(),
tag: z.string().nullable().optional(),
email: z.string().nullable().optional(),
phone: z.string().nullable().optional(),
collectionTokens: z
.object({
default: z.string().nullable().optional(),
tokens: z
.array(
z.object({
prefix: z.string(),
token: z.string(),
})
)
.optional(),
})
.nullable()
.optional(),
createdAt: z.string().nullable().optional(),
updatedAt: z.string().nullable().optional(),
uuid: z.string(),
expiryStarts: z.string(),
expiryEnds: z.string(),
isConfirmed: z.boolean(),
deleted: z.boolean(),
active: z.boolean(),
isNotificationSend: z.boolean(),
isEmailSend: z.boolean(),
expiresAt: z.string(),
tag: z.string(),
email: z.string(),
phone: z.string().optional(),
collectionTokens: z.object({
defaultSelection: z.string().nullable().optional(), selectedBuildIDS: z.array(z.string()).optional(), selectedCompanyIDS: z.array(z.string()).optional()
}).nullable().optional(),
createdAt: z.string(),
updatedAt: z.string(),
});
export type schemaType = z.infer<typeof schema>;

4
frontend/pages/users/add/types.ts
View File

@@ -9,8 +9,8 @@ interface CollectionTokens {
}
interface UserAdd {
expiryStarts: string;
expiryEnds: string;
expiryStarts?: string;
expiryEnds?: string;
isConfirmed: boolean;
isNotificationSend: boolean;
password: string;