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

updated living space

This commit is contained in:
Berkay 2025-11-26 16:10:15 +03:00
parent 2062aa7a1d
commit 3aebb79d36
38 changed files with 709 additions and 688 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
backend/src/models/base.model.ts
View File

@ -75,6 +75,23 @@ export class Base {
}
@ObjectType({ isAbstract: true })
export class CreatedBase {
@Field()
@Prop({ default: () => new Date(Date.now()), required: false })
createdAt?: Date;
@Field()
@Prop({ default: () => new Date(Date.now()), required: false })
updatedAt?: Date;
}
@ObjectType({ isAbstract: true })
export class ExpiryBase {

4
backend/src/models/build.model.ts
View File

@ -1,7 +1,7 @@
import { Prop, Schema, SchemaFactory } from '@nestjs/mongoose';
import { Document, Types } from 'mongoose';
import { ObjectType, Field, ID, Int } from '@nestjs/graphql';
import { Base } from '@/models/base.model';
import { Base, CreatedBase } from '@/models/base.model';
import { Person } from '@/models/person.model';
import { Company } from '@/models/company.model';
import { BuildTypes } from './build-types.model';
@ -119,7 +119,7 @@ export class BuildInfo {
@ObjectType()
@Schema({ timestamps: true })
export class Build {
export class Build extends CreatedBase {
@Field()
readonly _id: string;

6
backend/src/user-types/user-types.service.ts
View File

@ -24,11 +24,11 @@ export class UserTypesService {
return this.userTypesModel.findById(id, projection, { lean: false }).populate({ path: 'buildSites', select: projection?.buildSites }).exec();
}
async create(input: CreateUserTypesInput): Promise<UserTypeDocument> { const buildSite = new this.userTypesModel(input); return buildSite.save() }
async create(input: CreateUserTypesInput): Promise<UserTypeDocument> { const userType = new this.userTypesModel(input); return userType.save() }
async update(uuid: string, input: UpdateUserTypeInput): Promise<UserTypeDocument> { const buildSite = await this.userTypesModel.findOne({ uuid }); if (!buildSite) { throw new Error('BuildSite not found') }; buildSite.set(input); return buildSite.save() }
async update(uuid: string, input: UpdateUserTypeInput): Promise<UserTypeDocument> { const userType = await this.userTypesModel.findOne({ uuid }); if (!userType) { throw new Error('User Type not found') }; userType.set(input); return userType.save() }
async delete(uuid: string): Promise<boolean> { const buildSite = await this.userTypesModel.deleteMany({ uuid }); return buildSite.deletedCount > 0 }
async delete(uuid: string): Promise<boolean> { const userType = await this.userTypesModel.deleteMany({ uuid }); return userType.deletedCount > 0 }
buildProjection(fields: Record<string, any>): any {
const projection: any = {};

3
frontend/app/api/builds/list/route.ts
View File

@ -15,6 +15,8 @@ export async function POST(request: Request) {
data {
_id
collectionToken
createdAt
updatedAt
buildType {
token
typeToken
@ -38,6 +40,7 @@ export async function POST(request: Request) {
garageCount
managementRoomId
}
}
totalCount
}

4
frontend/app/api/user-types/add/route.ts
View File

@ -1,13 +1,13 @@
'use server';
import { NextResponse } from 'next/server';
import { GraphQLClient, gql } from 'graphql-request';
import { buildPartsAddSchema } from './schema';
import { userTypesAddSchema } from './schema';
const endpoint = "http://localhost:3001/graphql";
export async function POST(request: Request) {
const body = await request.json();
const validatedBody = buildPartsAddSchema.parse({ ...body.data, buildId: body.buildId });
const validatedBody = userTypesAddSchema.parse(body);
try {
const client = new GraphQLClient(endpoint);
const query = gql`mutation CreateUserType($input: CreateUserTypesInput!) { createUserType(input: $input) { _id }}`;

26
frontend/app/api/user-types/add/schema.ts
View File

@ -1,23 +1,15 @@
import { z } from "zod"
export const buildPartsAddSchema = z.object({
buildId: z.string(),
addressGovCode: z.string(),
no: z.number(),
level: z.number(),
code: z.string(),
grossSize: z.number(),
netSize: z.number(),
defaultAccessory: z.string(),
humanLivability: z.boolean(),
key: z.string(),
directionId: z.string().optional(),
typeId: z.string().optional(),
active: z.boolean().default(true),
isConfirmed: z.boolean().default(false),
export const userTypesAddSchema = z.object({
type: z.string(),
token: z.string(),
typeToken: z.string(),
description: z.string(),
isProperty: z.boolean(),
expiryStarts: z.string().optional(),
expiryEnds: z.string().optional()
expiryEnds: z.string().optional(),
});
export type BuildPartsAdd = z.infer<typeof buildPartsAddSchema>;
export type userTypesAdd = z.infer<typeof userTypesAddSchema>;

4
frontend/app/api/user-types/delete/route.ts
View File

@ -8,12 +8,12 @@ export async function GET(request: Request) {
const searchParams = new URL(request.url).searchParams;
const uuid = searchParams.get('uuid');
console.dir({ uuid }, { depth: null });
if (!uuid) { return NextResponse.json({ error: 'UUID not found in search params' }, { status: 400 }) }
try {
const client = new GraphQLClient(endpoint);
const query = gql`mutation DeleteUserType($uuid: String!) { deleteUserType(uuid: $uuid) }`;
const variables = { uuid: uuid };
const data = await client.request(query, variables);
const data = await client.request(query, { uuid });
return NextResponse.json({ data: data.deleteUserType, status: 200 });
} catch (err: any) {
console.error(err);

1
frontend/app/api/user-types/list/route.ts
View File

@ -16,6 +16,7 @@ export async function POST(request: Request) {
_id
uuid
createdAt
updatedAt
expiryStarts
expiryEnds
type

6
frontend/app/api/user-types/update/route.ts
View File

@ -1,16 +1,16 @@
'use server';
import { NextResponse } from 'next/server';
import { GraphQLClient, gql } from 'graphql-request';
import { UpdateBuildPartsSchema } from './schema';
import { UpdateUserTypesSchema } from './schema';
const endpoint = "http://localhost:3001/graphql";
export async function POST(request: Request) {
const searchUrl = new URL(request.url);
const uuid = searchUrl.searchParams.get("uuid") || "";
const body = await request.json();
const validatedBody = UpdateBuildPartsSchema.parse(body);
if (uuid === "") { return NextResponse.json({ error: "UUID is required" }, { status: 400 }) }
const body = await request.json();
const validatedBody = UpdateUserTypesSchema.parse(body);
try {
const client = new GraphQLClient(endpoint);
const query = gql`mutation UpdateUserType($uuid: String!, $input: UpdateUserTypeInput!) { updateUserType(uuid: $uuid, input: $input) { _id } }`;

25
frontend/app/api/user-types/update/schema.ts
View File

@ -1,24 +1,15 @@
import { z } from "zod"
export const UpdateBuildPartsSchema = z.object({
export const UpdateUserTypesSchema = z.object({
buildId: z.string().optional(),
addressGovCode: z.string(),
no: z.number(),
level: z.number(),
code: z.string(),
grossSize: z.number(),
netSize: z.number(),
defaultAccessory: z.string(),
humanLivability: z.boolean(),
key: z.string(),
directionId: z.string().optional(),
typeId: z.string().optional(),
active: z.boolean(),
isConfirmed: z.boolean(),
type: z.string(),
token: z.string(),
typeToken: z.string(),
description: z.string(),
isProperty: z.boolean(),
expiryStarts: z.string().optional(),
expiryEnds: z.string().optional()
expiryEnds: z.string().optional(),
});
export type UpdateBuildParts = z.infer<typeof UpdateBuildPartsSchema>;
export type UpdateUserTypes = z.infer<typeof UpdateUserTypesSchema>;

8
frontend/pages/builds/list/columns.tsx
View File

@ -86,22 +86,22 @@ function getColumns(router: any, activeRoute: string, deleteHandler: (id: string
{
accessorKey: "info.liftCount",
header: "Lift Count",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.heatingSystem",
header: "Heating System",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.coolingSystem",
header: "Cooling System",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.hotWaterSystem",
header: "Hot Water System",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.blockServiceManCount",

2
frontend/pages/builds/list/schema.tsx
View File

@ -7,6 +7,8 @@ export const schema = z.object({
typeToken: z.string(),
type: z.string(),
}),
createdAt: z.string(),
updatedAt: z.string(),
collectionToken: z.string(),
info: z.object({
govAddressCode: z.string(),

2
frontend/pages/builds/update/form.tsx
View File

@ -7,7 +7,7 @@ import { Button } from "@/components/ui/button"
import { Separator } from "@/components/ui/separator"
import { DateTimePicker } from "@/components/ui/date-time-picker"
import { BuildUpdate, buildUpdateSchema } from "@/pages/builds/update/schema"
import { useUpdateBuildMutation } from "@/pages/builds/update/queries"
import { useUpdateBuildMutation } from "./queries"
import { Checkbox } from "@/components/ui/checkbox"
const BuildupdateForm = ({ refetchTable, initData, selectedUuid }: { refetchTable: () => void, initData: BuildUpdate, selectedUuid: string }) => {

8
frontend/pages/living-space/tables/builds/columns.tsx
View File

@ -79,22 +79,22 @@ function getColumns(selectionHandler: (id: string, token: string) => void): Colu
{
accessorKey: "info.liftCount",
header: "Lift Count",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.heatingSystem",
header: "Heating System",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.coolingSystem",
header: "Cooling System",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.hotWaterSystem",
header: "Hot Water System",
cell: ({ getValue }) => getValue(),
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "info.blockServiceManCount",

2
frontend/pages/living-space/tables/builds/data-table.tsx
View File

@ -107,7 +107,7 @@ export function LivingSpaceBuildDataTable({
const sensors = useSensors(useSensor(MouseSensor, {}), useSensor(TouchSensor, {}), useSensor(KeyboardSensor, {}))
const dataIds = React.useMemo<UniqueIdentifier[]>(() => data?.map(({ _id }) => _id) || [], [data])
const setSelection = (id: string, token: string) => { setBuildId(id); setCollectionToken(token); setIsUserTypeEnabled(true) }
const setSelection = (id: string, token: string) => { setBuildId(id); setCollectionToken(token); setIsUserTypeEnabled(true); }
const columns = getColumns(setSelection);
const pagination = React.useMemo(() => ({ pageIndex: currentPage - 1, pageSize: pageSize }), [currentPage, pageSize])
const totalPages = Math.ceil(totalCount / pageSize)

3
frontend/pages/living-space/tables/builds/page.tsx
View File

@ -27,7 +27,8 @@ const PageLivingSpaceBuildsTableSection = (
return <>
<LivingSpaceBuildDataTable
data={data?.data || []} totalCount={data?.totalCount || 0} currentPage={page} pageSize={limit} onPageChange={handlePageChange} onPageSizeChange={handlePageSizeChange}
refetchTable={refetch} buildId={buildID || ""} setBuildId={setBuildID} collectionToken={collectionToken || ""} setCollectionToken={setCollectionToken} setIsUserTypeEnabled={setIsUserTypeEnabled} />
refetchTable={refetch} buildId={buildID || ""} setBuildId={setBuildID} collectionToken={collectionToken || ""} setCollectionToken={setCollectionToken}
setIsUserTypeEnabled={setIsUserTypeEnabled} />
</>;
}

50
frontend/pages/living-space/tables/page.tsx
View File

@ -1,7 +1,11 @@
'use client';
import { useState } from "react";
import { useState, useEffect, useRef } from "react";
import { Card, CardContent } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { XCircle } from "lucide-react";
import PageLivingSpaceBuildsTableSection from "./builds/page";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import PageLivingSpaceUserTypesTableSection from "./userType/page";
const PageLivingSpace = () => {
@ -18,10 +22,46 @@ const PageLivingSpace = () => {
const [isCompanyEnabled, setIsCompanyEnabled] = useState(false);
const [isPersonEnabled, setIsPersonEnabled] = useState(false);
const tabsClassName = "border border-gray-300 rounded-sm h-10"
const tabsClassName = "border border-gray-300 rounded-sm h-10"
const deleteAllSelections = () => {
setBuildID(null); setCollectionToken(null); setUserTypeID(null); setPartID(null); setCompanyID(null); setPersonID(null);
setIsUserTypeEnabled(false); setIsPartsEnabled(false); setIsCompanyEnabled(false); setIsPersonEnabled(false);
}
return <>
<div>{JSON.stringify({ buildID, collectionToken, userTypeID, partID, companyID, personID })}</div>
<Card className="mb-6">
<CardContent className="pt-6 flex justify-between items-start">
<div className="grid grid-cols-6 gap-x-12 gap-y-2">
<div className="flex gap-2">
<span className="font-medium text-gray-500">Build ID:</span>
<span>{buildID || '-'}</span>
</div>
<div className="flex gap-2">
<span className="font-medium text-gray-500">Collection Token:</span>
<span>{collectionToken || '-'}</span>
</div>
<div className="flex gap-2">
<span className="font-medium text-gray-500">User Type ID:</span>
<span>{userTypeID || '-'}</span>
</div>
<div className="flex gap-2">
<span className="font-medium text-gray-500">Part ID:</span>
<span>{partID || '-'}</span>
</div>
<div className="flex gap-2">
<span className="font-medium text-gray-500">Company ID:</span>
<span>{companyID || '-'}</span>
</div>
<div className="flex gap-2">
<span className="font-medium text-gray-500">Person ID:</span>
<span>{personID || '-'}</span>
</div>
</div>
<Button variant="outline" className="ml-4 text-destructive hover:text-destructive" onClick={deleteAllSelections}>
<XCircle className="h-4 w-4 mr-2" />Clear All
</Button>
</CardContent>
</Card>
<div className="flex flex-col m-7">
<Tabs defaultValue="builds" className="w-full">
<TabsList className="grid w-full grid-flow-col auto-cols-fr gap-1.5">
@ -35,7 +75,9 @@ const PageLivingSpace = () => {
<TabsContent value="builds">
<PageLivingSpaceBuildsTableSection buildID={buildID} setBuildID={setBuildID} collectionToken={collectionToken} setCollectionToken={setCollectionToken} setIsUserTypeEnabled={setIsUserTypeEnabled} />
</TabsContent>
{isUserTypeEnabled && <TabsContent value="usertype">{/* Add UserType section component here */}</TabsContent>}
{isUserTypeEnabled && <TabsContent value="usertype">
<PageLivingSpaceUserTypesTableSection userTypeID={userTypeID} setUserTypeID={setUserTypeID} setIsPartsEnabled={setIsPartsEnabled} setIsCompanyEnabled={setIsCompanyEnabled} setIsPersonEnabled={setIsPersonEnabled} />
</TabsContent>}
{isPartsEnabled && <TabsContent value="parts">{/* Add Parts section component here */}</TabsContent>}
{isCompanyEnabled && <TabsContent value="company">{/* Add Company section component here */}</TabsContent>}
{isPersonEnabled && <TabsContent value="person"> {/* Add Person section component here */}</TabsContent>}

98
frontend/pages/living-space/tables/userType/columns.tsx Normal file
View File

@ -0,0 +1,98 @@
"use client"
import { z } from "zod"
import { Button } from "@/components/ui/button"
import { Drawer, DrawerClose, DrawerContent, DrawerFooter, DrawerHeader, DrawerTrigger } from "@/components/ui/drawer"
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from "@/components/ui/dropdown-menu"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import { useSortable } from "@dnd-kit/sortable"
import { IconGripVertical, IconHandClick } from "@tabler/icons-react"
import { useIsMobile } from "@/hooks/use-mobile"
import { Separator } from "@/components/ui/separator"
import { ColumnDef, flexRender, Row } from "@tanstack/react-table"
import { TableCell, TableRow } from "@/components/ui/table"
import { CSS } from "@dnd-kit/utilities"
import { schema, schemaType } from "./schema"
import { dateToLocaleString } from "@/lib/utils"
import { Pencil, Trash, TextSelect } from "lucide-react"
export function DraggableRow({ row }: { row: Row<z.infer<typeof schema>> }) {
const { transform, transition, setNodeRef, isDragging } = useSortable({ id: row.original._id })
return (
<TableRow data-state={row.getIsSelected() && "selected"} data-dragging={isDragging} ref={setNodeRef}
className="relative z-0 data-[dragging=true]:z-10 data-[dragging=true]:opacity-80"
style={{ transform: CSS.Transform.toString(transform), transition: transition }}
>
{row.getVisibleCells().map((cell) => (
<TableCell key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</TableCell>
))}
</TableRow>
)
}
function getColumns(selectionHandler: (id: string, isProperty: boolean) => void): ColumnDef<schemaType>[] {
return [
{
accessorKey: "type",
header: "Type",
cell: ({ getValue }) => getValue(),
},
{
accessorKey: "token",
header: "Token",
cell: ({ getValue }) => getValue(),
},
{
accessorKey: "typeToken",
header: "Type Token",
cell: ({ getValue }) => getValue(),
},
{
accessorKey: "description",
header: "Description",
cell: ({ getValue }) => getValue(),
},
{
accessorKey: "isProperty",
header: "Is Property",
cell: ({ getValue }) => getValue() ? (<div className="text-green-600 font-medium">Yes</div>) : (<div className="text-red-600 font-medium">No</div>),
},
{
accessorKey: "expiryStarts",
header: "Expiry Starts",
cell: ({ getValue }) => dateToLocaleString(getValue() as string),
},
{
accessorKey: "expiryEnds",
header: "Expiry Ends",
cell: ({ getValue }) => dateToLocaleString(getValue() as string),
},
{
accessorKey: "createdAt",
header: "Created At",
cell: ({ getValue }) => dateToLocaleString(getValue() as string),
},
{
accessorKey: "updatedAt",
header: "Updated At",
cell: ({ getValue }) => dateToLocaleString(getValue() as string),
},
{
id: "actions",
header: "Actions",
cell: ({ row }) => {
return (
<div className="flex flex-row gap-2">
<Button className="bg-blue-600 border-blue-600 text-white" variant="outline" size="sm" onClick={() => { selectionHandler(row.original._id, row.original.isProperty) }}>
<IconHandClick />
</Button>
</div>
);
},
}
]
}
export { getColumns };

282
frontend/pages/living-space/tables/userType/data-table.tsx Normal file
View File

@ -0,0 +1,282 @@
"use client"
import * as React from "react"
import {
closestCenter,
DndContext,
KeyboardSensor,
MouseSensor,
TouchSensor,
useSensor,
useSensors,
type UniqueIdentifier,
} from "@dnd-kit/core"
import { restrictToVerticalAxis } from "@dnd-kit/modifiers"
import {
SortableContext,
verticalListSortingStrategy,
} from "@dnd-kit/sortable"
import {
IconBorderLeftPlus,
IconBuildingBank,
IconBuildingBridge,
IconBuildingChurch,
IconChevronDown,
IconChevronLeft,
IconChevronRight,
IconChevronsLeft,
IconChevronsRight,
IconLayoutColumns,
IconPlus,
} from "@tabler/icons-react"
import {
ColumnFiltersState,
flexRender,
getCoreRowModel,
getFacetedRowModel,
getFacetedUniqueValues,
getFilteredRowModel,
getSortedRowModel,
SortingState,
useReactTable,
VisibilityState,
} from "@tanstack/react-table"
import { Button } from "@/components/ui/button"
import {
DropdownMenu,
DropdownMenuCheckboxItem,
DropdownMenuContent,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import { Label } from "@/components/ui/label"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table"
import {
Tabs,
TabsContent,
TabsList,
TabsTrigger,
} from "@/components/ui/tabs"
import { schemaType } from "./schema"
import { getColumns, DraggableRow } from "./columns"
import { useRouter } from "next/navigation"
export function LivingSpaceUserTypesDataTable({
data,
totalCount,
currentPage = 1,
pageSize = 10,
onPageChange,
onPageSizeChange,
refetchTable,
userTypeID,
setUserTypeID,
setIsPartsEnabled,
setIsCompanyEnabled,
setIsPersonEnabled,
}: {
data: schemaType[],
totalCount: number,
currentPage?: number,
pageSize?: number,
onPageChange: (page: number) => void,
onPageSizeChange: (size: number) => void,
refetchTable: () => void,
userTypeID: string | null;
setUserTypeID: (id: string | null) => void;
setIsPartsEnabled: (enabled: boolean) => void;
setIsCompanyEnabled: (enabled: boolean) => void;
setIsPersonEnabled: (enabled: boolean) => void;
}) {
const router = useRouter();
const [rowSelection, setRowSelection] = React.useState({})
const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({})
const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([])
const [sorting, setSorting] = React.useState<SortingState>([])
const sortableId = React.useId()
const sensors = useSensors(useSensor(MouseSensor, {}), useSensor(TouchSensor, {}), useSensor(KeyboardSensor, {}))
const dataIds = React.useMemo<UniqueIdentifier[]>(() => data?.map(({ _id }) => _id) || [], [data])
const setSelection = (id: string, isProperty: boolean) => {
setUserTypeID(id); isProperty ? setIsPartsEnabled(true) : setIsPartsEnabled(false); setIsCompanyEnabled(true); setIsPersonEnabled(true)
}
const columns = getColumns(setSelection);
const pagination = React.useMemo(() => ({ pageIndex: currentPage - 1, pageSize: pageSize }), [currentPage, pageSize])
const totalPages = Math.ceil(totalCount / pageSize)
const table = useReactTable({
data,
columns,
pageCount: totalPages,
state: { sorting, columnVisibility, rowSelection, columnFilters, pagination },
manualPagination: true,
getRowId: (row) => row._id.toString(),
enableRowSelection: true,
onRowSelectionChange: setRowSelection,
onSortingChange: setSorting,
onColumnFiltersChange: setColumnFilters,
onColumnVisibilityChange: setColumnVisibility,
onPaginationChange: (updater) => { const nextPagination = typeof updater === "function" ? updater(pagination) : updater; onPageChange(nextPagination.pageIndex + 1); onPageSizeChange(nextPagination.pageSize) },
getCoreRowModel: getCoreRowModel(),
getFilteredRowModel: getFilteredRowModel(),
getSortedRowModel: getSortedRowModel(),
getFacetedRowModel: getFacetedRowModel(),
getFacetedUniqueValues: getFacetedUniqueValues(),
})
const handlePageSizeChange = (value: string) => { const newSize = Number(value); onPageSizeChange(newSize); onPageChange(1) }
return (
<Tabs defaultValue="outline" className="w-full flex-col justify-start gap-6">
<div className="flex items-center justify-between px-4 lg:px-6">
<Label htmlFor="view-selector" className="sr-only">View</Label>
<Select defaultValue="outline">
<SelectTrigger className="flex w-fit @4xl/main:hidden" size="sm" id="view-selector">
<SelectValue placeholder="Select a view" />
</SelectTrigger>
<SelectContent>
<SelectItem value="outline">Outline</SelectItem>
<SelectItem value="past-performance">Past Performance</SelectItem>
<SelectItem value="key-personnel">Key Personnel</SelectItem>
<SelectItem value="focus-documents">Focus Documents</SelectItem>
</SelectContent>
</Select>
<div className="flex items-center gap-2">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="sm">
<IconLayoutColumns />
<span className="hidden lg:inline">Customize Columns</span>
<span className="lg:hidden">Columns</span>
<IconChevronDown />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-56">
{table.getAllColumns().filter((column) => typeof column.accessorFn !== "undefined" && column.getCanHide()).map((column) => {
return (
<DropdownMenuCheckboxItem key={column.id} className="capitalize" checked={column.getIsVisible()} onCheckedChange={(value) => column.toggleVisibility(!!value)} >
{column.id}
</DropdownMenuCheckboxItem>
)
})}
</DropdownMenuContent>
</DropdownMenu>
</div>
</div>
<TabsContent value="outline" className="relative flex flex-col gap-4 overflow-auto px-4 lg:px-6">
<div className="overflow-hidden rounded-lg border">
<DndContext collisionDetection={closestCenter} modifiers={[restrictToVerticalAxis]} sensors={sensors} id={sortableId} >
<Table>
<TableHeader className="bg-muted sticky top-0 z-10">
{table.getHeaderGroups().map((headerGroup) => (
<TableRow key={headerGroup.id}>
{headerGroup.headers.map((header) => {
return (
<TableHead key={header.id} colSpan={header.colSpan}>
{header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}
</TableHead>
)
})}
</TableRow>
))}
</TableHeader>
<TableBody className="**:data-[slot=table-cell]:first:w-8">
{table.getRowModel().rows?.length ? (<SortableContext items={dataIds} strategy={verticalListSortingStrategy} >
{table.getRowModel().rows.map((row) => <DraggableRow key={row.id} row={row} />)}
</SortableContext>) : (
<TableRow><TableCell colSpan={columns.length} className="h-24 text-center">No results.</TableCell></TableRow>
)}
</TableBody>
</Table>
</DndContext>
</div>
<div className="flex items-center justify-between px-4">
<div className="text-muted-foreground hidden flex-1 text-sm lg:flex">
{table.getFilteredSelectedRowModel().rows.length} of{" "}
{table.getFilteredRowModel().rows.length} row(s) selected.
</div>
<div className="flex w-full items-center gap-8 lg:w-fit">
<div className="hidden items-center gap-2 lg:flex">
<Label htmlFor="rows-per-page" className="text-sm font-medium">Rows per page</Label>
<Select value={`${pageSize}`} onValueChange={handlePageSizeChange}>
<SelectTrigger size="sm" className="w-20" id="rows-per-page">
<SelectValue placeholder={pageSize} />
</SelectTrigger>
<SelectContent side="top">
{[10, 20, 30].map((size) => <SelectItem key={size} value={`${size}`}>{size}</SelectItem>)}
</SelectContent>
</Select>
</div>
<div className="flex w-fit items-center justify-center text-sm font-medium">
Page {currentPage} of {totalPages}
</div>
<div className="flex w-fit items-center justify-center text-sm font-medium">
Total Count: {totalCount}
</div>
<div className="ml-auto flex items-center gap-2 lg:ml-0">
<Button
variant="outline"
size="icon"
onClick={() => onPageChange(1)}
disabled={currentPage === 1}
>
<IconChevronsLeft />
</Button>
<Button
variant="outline"
size="icon"
onClick={() => onPageChange(currentPage - 1)}
disabled={currentPage === 1}
>
<IconChevronLeft />
</Button>
<Button
variant="outline"
size="icon"
onClick={() => onPageChange(currentPage + 1)}
disabled={currentPage >= totalPages}
>
<IconChevronRight />
</Button>
<Button
variant="outline"
size="icon"
onClick={() => onPageChange(totalPages)}
disabled={currentPage >= totalPages}
>
<IconChevronsRight />
</Button>
</div>
</div>
</div>
</TabsContent>
<TabsContent value="past-performance" className="flex flex-col px-4 lg:px-6">
<div className="aspect-video w-full flex-1 rounded-lg border border-dashed"></div>
</TabsContent>
<TabsContent value="key-personnel" className="flex flex-col px-4 lg:px-6">
<div className="aspect-video w-full flex-1 rounded-lg border border-dashed"></div>
</TabsContent>
<TabsContent value="focus-documents" className="flex flex-col px-4 lg:px-6">
<div className="aspect-video w-full flex-1 rounded-lg border border-dashed"></div>
</TabsContent>
</Tabs>
)
}

36
frontend/pages/living-space/tables/userType/page.tsx Normal file
View File

@ -0,0 +1,36 @@
'use client';
import { useState } from "react";
import { useGraphQlUserTypesList } from "./queries";
import { LivingSpaceUserTypesDataTable } from "./data-table";
const PageLivingSpaceUserTypesTableSection = (
{ userTypeID, setUserTypeID, setIsPartsEnabled, setIsCompanyEnabled, setIsPersonEnabled }: {
userTypeID: string | null;
setUserTypeID: (id: string | null) => void;
setIsPartsEnabled: (enabled: boolean) => void;
setIsCompanyEnabled: (enabled: boolean) => void;
setIsPersonEnabled: (enabled: boolean) => void;
}
) => {
const [page, setPage] = useState(1);
const [limit, setLimit] = useState(10);
const [sort, setSort] = useState({ createdAt: 'desc' });
const [filters, setFilters] = useState({});
const { data, isLoading, error, refetch } = useGraphQlUserTypesList({ limit, skip: (page - 1) * limit, sort, filters });
const handlePageChange = (newPage: number) => { setPage(newPage) };
const handlePageSizeChange = (newSize: number) => { setLimit(newSize); setPage(1) };
if (isLoading) { return <div className="flex items-center justify-center p-8">Loading...</div> }
if (error) { return <div className="flex items-center justify-center p-8 text-red-500">Error loading users</div> }
return <>
<LivingSpaceUserTypesDataTable
data={data?.data || []} totalCount={data?.totalCount || 0} currentPage={page} pageSize={limit} onPageChange={handlePageChange} onPageSizeChange={handlePageSizeChange}
refetchTable={refetch} userTypeID={userTypeID || ""} setUserTypeID={setUserTypeID} setIsPartsEnabled={setIsPartsEnabled} setIsCompanyEnabled={setIsCompanyEnabled}
setIsPersonEnabled={setIsPersonEnabled} />
</>;
}
export default PageLivingSpaceUserTypesTableSection;

18
frontend/pages/living-space/tables/userType/queries.tsx Normal file
View File

@ -0,0 +1,18 @@
'use client'
import { useQuery } from '@tanstack/react-query'
import { ListArguments } from '@/types/listRequest'
const fetchGraphQlUserTypesList = async (params: ListArguments): Promise<any> => {
console.log('Fetching test data from local API');
const { limit, skip, sort, filters } = params;
try {
const res = await fetch('/api/user-types/list', { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify({ limit, skip, sort, filters }) });
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();
return { data: data.data, totalCount: data.totalCount }
} catch (error) { console.error('Error fetching test data:', error); throw error }
};
export function useGraphQlUserTypesList(params: ListArguments) {
return useQuery({ queryKey: ['graphql-user-types-list', params], queryFn: () => fetchGraphQlUserTypesList(params) })
}

19
frontend/pages/living-space/tables/userType/schema.tsx Normal file
View File

@ -0,0 +1,19 @@
import { z } from "zod";
export const schema = z.object({
_id: z.string(),
uuid: z.string(),
type: z.string(),
token: z.string(),
typeToken: z.string(),
description: z.string(),
isProperty: z.boolean(),
expiryStarts: z.string(),
expiryEnds: z.string(),
createdAt: z.string(),
updatedAt: z.string(),
});
export type schemaType = z.infer<typeof schema>;

341
frontend/pages/user-types/add/form.tsx
View File

@ -6,53 +6,53 @@ import { Input } from "@/components/ui/input"
import { Button } from "@/components/ui/button"
import { Separator } from "@/components/ui/separator"
import { DateTimePicker } from "@/components/ui/date-time-picker"
import { BuildAdd, buildAddSchema } from "./schema"
import { useAddBuildMutation } from "./queries"
import { UserTypesAdd, UserTypesAddSchema } from "./schema"
import { useAddUserTypesMutation } from "./queries"
import { Checkbox } from "@/components/ui/checkbox"
const UserTypesForm = ({ refetchTable }: { refetchTable: () => void }) => {
const form = useForm<BuildAdd>({
resolver: zodResolver(buildAddSchema),
const form = useForm<UserTypesAdd>({
resolver: zodResolver(UserTypesAddSchema),
defaultValues: {
buildType: "",
collectionToken: "",
info: {
govAddressCode: "",
buildName: "",
buildNo: "",
maxFloor: 0,
undergroundFloor: 0,
buildDate: "",
decisionPeriodDate: "",
taxNo: "",
liftCount: 0,
heatingSystem: false,
coolingSystem: false,
hotWaterSystem: false,
blockServiceManCount: 0,
securityServiceManCount: 0,
garageCount: 0,
managementRoomId: "",
}
},
type: "",
token: "",
typeToken: "",
description: "",
isProperty: false,
expiryStarts: "",
expiryEnds: "",
}
});
const { handleSubmit } = form;
const mutation = useAddBuildMutation();
const mutation = useAddUserTypesMutation();
function onSubmit(values: BuildAdd) { mutation.mutate({ data: values }); setTimeout(() => refetchTable(), 400) };
function onSubmit(values: UserTypesAdd) { mutation.mutate({ data: values }); setTimeout(() => refetchTable(), 400) };
return (
<Form {...form}>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-6 p-4" >
{/* ROW 1 */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="buildType"
name="type"
render={({ field }) => (
<FormItem>
<FormLabel>Type</FormLabel>
<FormControl>
<Input placeholder="Type" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="token"
render={({ field }) => (
<FormItem>
<FormLabel>Token</FormLabel>
@ -63,31 +63,17 @@ const UserTypesForm = ({ refetchTable }: { refetchTable: () => void }) => {
</FormItem>
)}
/>
<FormField
control={form.control}
name="collectionToken"
render={({ field }) => (
<FormItem>
<FormLabel>Collection Token</FormLabel>
<FormControl>
<Input placeholder="Collection Token" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="info.govAddressCode"
name="description"
render={({ field }) => (
<FormItem>
<FormLabel>Gov Address Code</FormLabel>
<FormLabel>Description</FormLabel>
<FormControl>
<Input placeholder="Gov Address Code" {...field} />
<Input placeholder="Description" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@ -95,183 +81,26 @@ const UserTypesForm = ({ refetchTable }: { refetchTable: () => void }) => {
/>
<FormField
control={form.control}
name="info.buildName"
name="typeToken"
render={({ field }) => (
<FormItem>
<FormLabel>Build Name</FormLabel>
<FormLabel>Type Token</FormLabel>
<FormControl>
<Input placeholder="Build Name" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.buildNo"
render={({ field }) => (
<FormItem>
<FormLabel>Build No</FormLabel>
<FormControl>
<Input placeholder="Build No" {...field} />
<Input placeholder="Type Token" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="info.maxFloor"
render={({ field }) => (
<FormItem>
<FormLabel>Max Floor</FormLabel>
<FormControl>
<Input
type="number"
placeholder="Max Floor"
{...field}
onBlur={(e) => {
field.onBlur();
const numValue = parseFloat(e.target.value);
if (!isNaN(numValue)) {
field.onChange(numValue);
}
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.undergroundFloor"
render={({ field }) => (
<FormItem>
<FormLabel>Underground Floor</FormLabel>
<FormControl>
<Input
type="number"
placeholder="Underground Floor"
{...field}
onBlur={(e) => {
field.onBlur();
const numValue = parseFloat(e.target.value);
if (!isNaN(numValue)) {
field.onChange(numValue);
}
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="info.taxNo"
render={({ field }) => (
<FormItem>
<FormLabel>Tax No</FormLabel>
<FormControl>
<Input placeholder="Tax No" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.liftCount"
render={({ field }) => (
<FormItem>
<FormLabel>Lift Count</FormLabel>
<FormControl>
<Input
type="number"
placeholder="Lift Count"
{...field}
onBlur={(e) => {
field.onBlur();
const numValue = parseFloat(e.target.value);
if (!isNaN(numValue)) {
field.onChange(numValue);
}
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="flex flex-row justify-evenly">
<FormField
control={form.control}
name="info.heatingSystem"
render={({ field }) => (
<FormItem className="flex flex-row items-center space-x-3 space-y-0">
<FormControl>
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
</FormControl>
<div className="leading-none">
<FormLabel>
Heating System
</FormLabel>
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.coolingSystem"
render={({ field }) => (
<FormItem className="flex flex-row items-center space-x-3 space-y-0">
<FormControl>
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
</FormControl>
<div className="leading-none">
<FormLabel>
Cooling System
</FormLabel>
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.hotWaterSystem"
render={({ field }) => (
<FormItem className="flex flex-row items-center space-x-3 space-y-0">
<FormControl>
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
</FormControl>
<div className="leading-none">
<FormLabel>
Hot Water System
</FormLabel>
</div>
</FormItem>
)}
/>
</div>
<Separator />
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<FormField
control={form.control}
name="info.buildDate"
name="expiryStarts"
render={({ field }) => (
<FormItem>
<FormLabel>Build Date</FormLabel>
<FormLabel>Expiry Starts</FormLabel>
<FormControl>
<DateTimePicker {...field} />
</FormControl>
@ -281,10 +110,10 @@ const UserTypesForm = ({ refetchTable }: { refetchTable: () => void }) => {
/>
<FormField
control={form.control}
name="info.decisionPeriodDate"
name="expiryEnds"
render={({ field }) => (
<FormItem>
<FormLabel>Decision Period Date</FormLabel>
<FormLabel>Expiry Ends</FormLabel>
<FormControl>
<DateTimePicker {...field} />
</FormControl>
@ -292,97 +121,25 @@ const UserTypesForm = ({ refetchTable }: { refetchTable: () => void }) => {
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-4 gap-4">
<FormField
control={form.control}
name="info.blockServiceManCount"
name="isProperty"
render={({ field }) => (
<FormItem>
<FormLabel>Block Service Man Count</FormLabel>
<FormItem className="flex flex-row justify-center items-center space-x-3 space-y-0 mt-6">
<FormControl>
<Input
type="number"
placeholder="Block Service Man Count"
{...field}
onBlur={(e) => {
field.onBlur();
const numValue = parseFloat(e.target.value);
if (!isNaN(numValue)) {
field.onChange(numValue);
}
}}
/>
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.securityServiceManCount"
render={({ field }) => (
<FormItem>
<FormLabel>Security Service Man Count</FormLabel>
<FormControl>
<Input
type="number"
placeholder="Security Service Man Count"
{...field}
onBlur={(e) => {
field.onBlur();
const numValue = parseFloat(e.target.value);
if (!isNaN(numValue)) {
field.onChange(numValue);
}
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.garageCount"
render={({ field }) => (
<FormItem>
<FormLabel>Total Garage Count In Numbers</FormLabel>
<FormControl>
<Input
type="number"
placeholder="Total Garage Count"
{...field}
onBlur={(e) => {
field.onBlur();
const numValue = parseFloat(e.target.value);
if (!isNaN(numValue)) {
field.onChange(numValue);
}
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.managementRoomId"
render={({ field }) => (
<FormItem>
<FormLabel>Management Room ID Assign</FormLabel>
<FormControl>
<Input placeholder="Management Room ID" {...field} />
</FormControl>
<FormMessage />
<div className="leading-none">
<FormLabel>
Is Property?
</FormLabel>
</div>
</FormItem>
)}
/>
</div>
<Button type="submit" className="w-full">Add Build </Button>
<Button type="submit" className="w-full">Add User Types</Button>
</form>
</Form>
);

14
frontend/pages/user-types/add/queries.tsx
View File

@ -1,24 +1,24 @@
'use client'
import { useMutation } from '@tanstack/react-query'
import { toISOIfNotZ } from '@/lib/utils';
import { BuildAdd } from './schema';
import { UserTypesAdd } from './schema';
const fetchGraphQlBuildAdd = async (record: BuildAdd): Promise<{ data: BuildAdd | null; status: number }> => {
const fetchGraphQlUserTypesAdd = async (record: UserTypesAdd): Promise<{ data: UserTypesAdd | null; status: number }> => {
console.log('Fetching test data from local API');
record.info.buildDate = toISOIfNotZ(record.info.buildDate);
record.info.decisionPeriodDate = toISOIfNotZ(record.info.decisionPeriodDate);
record.expiryStarts = record.expiryStarts ? toISOIfNotZ(record.expiryStarts) : undefined;
record.expiryEnds = record.expiryEnds ? toISOIfNotZ(record.expiryEnds) : undefined;
console.dir({ record })
try {
const res = await fetch('/api/builds/add', { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify(record) });
const res = await fetch('/api/user-types/add', { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify(record) });
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();
return { data: data.data, status: res.status }
} catch (error) { console.error('Error fetching test data:', error); throw error }
};
export function useAddBuildMutation() {
export function useAddUserTypesMutation() {
return useMutation({
mutationFn: ({ data }: { data: BuildAdd }) => fetchGraphQlBuildAdd(data),
mutationFn: ({ data }: { data: UserTypesAdd }) => fetchGraphQlUserTypesAdd(data),
onSuccess: () => { console.log("Build created successfully") },
onError: (error) => { console.error("Add build failed:", error) },
})

31
frontend/pages/user-types/add/schema.ts
View File

@ -1,28 +1,15 @@
import { z } from "zod"
export const buildAddSchema = z.object({
export const UserTypesAddSchema = z.object({
buildType: z.string(),
collectionToken: z.string(),
info: z.object({
govAddressCode: z.string(),
buildName: z.string(),
buildNo: z.string(),
maxFloor: z.number(),
undergroundFloor: z.number(),
buildDate: z.string(),
decisionPeriodDate: z.string(),
taxNo: z.string(),
liftCount: z.number(),
heatingSystem: z.boolean(),
coolingSystem: z.boolean(),
hotWaterSystem: z.boolean(),
blockServiceManCount: z.number(),
securityServiceManCount: z.number(),
garageCount: z.number(),
managementRoomId: z.string(),
})
type: z.string(),
token: z.string(),
typeToken: z.string(),
description: z.string(),
isProperty: z.boolean(),
expiryStarts: z.string().optional(),
expiryEnds: z.string().optional(),
});
export type BuildAdd = z.infer<typeof buildAddSchema>;
export type UserTypesAdd = z.infer<typeof UserTypesAddSchema>;

4
frontend/pages/user-types/add/table/columns.tsx
View File

@ -93,10 +93,10 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
cell: ({ row }) => {
return (
<div className="flex flex-row gap-2">
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/builds/update?uuid=${row.original._id}`) }}>
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/user-types/update?uuid=${row.original.uuid}`) }}>
<Pencil />
</Button>
<Button className="bg-red-700 text-white border-red-700" variant="outline" size="sm" onClick={() => { deleteHandler(row.original._id || "") }}>
<Button className="bg-red-700 text-white border-red-700" variant="outline" size="sm" onClick={() => { deleteHandler(row.original.uuid || "") }}>
<Trash />
</Button>
</div>

4
frontend/pages/user-types/add/table/data-table.tsx
View File

@ -142,9 +142,9 @@ export function UserTypesDataTableAdd({
})}
</DropdownMenuContent>
</DropdownMenu>
<Button variant="outline" size="sm" onClick={() => { router.push("/builds") }}>
<Button variant="outline" size="sm" onClick={() => { router.push("/user-types") }}>
<Home />
<span className="hidden lg:inline">Back to Build</span>
<span className="hidden lg:inline">Back to Users Types</span>
</Button>
</div>
</div>

1
frontend/pages/user-types/add/table/schema.tsx
View File

@ -3,6 +3,7 @@ import { z } from "zod";
export const schema = z.object({
_id: z.string(),
uuid: z.string(),
type: z.string(),
token: z.string(),
typeToken: z.string(),

4
frontend/pages/user-types/list/columns.tsx
View File

@ -84,10 +84,10 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
cell: ({ row }) => {
return (
<div className="flex flex-row gap-2">
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/builds/update?uuid=${row.original._id}`) }}>
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/user-types/update?uuid=${row.original.uuid}`) }}>
<Pencil />
</Button>
<Button className="bg-red-700 text-white border-red-700" variant="outline" size="sm" onClick={() => { deleteHandler(row.original._id || "") }}>
<Button className="bg-red-700 text-white border-red-700" variant="outline" size="sm" onClick={() => { deleteHandler(row.original.uuid) }}>
<Trash />
</Button>
</div>

49
frontend/pages/user-types/list/data-table.tsx
View File

@ -74,7 +74,7 @@ import {
import { schemaType } from "./schema"
import { getColumns, DraggableRow } from "./columns"
import { useRouter } from "next/navigation"
import { useDeleteBuildMutation } from "@/pages/builds/queries"
import { useDeleteUserTypeMutation } from "../queries"
export function UserTypesDataTable({
data,
@ -95,25 +95,7 @@ export function UserTypesDataTable({
}) {
const router = useRouter();
const routeSelections = [
{
url: 'build-parts',
name: 'Build Parts',
icon: <IconBuildingBank />
},
{
url: 'build-areas',
name: 'Build Areas',
icon: <IconBuildingChurch />
},
{
url: 'build-sites',
name: 'Build Sites',
icon: <IconBuildingBridge />
},
]
const [activeRoute, setActiveRoute] = React.useState(routeSelections[0].url);
const [rowSelection, setRowSelection] = React.useState({})
const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({})
const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([])
@ -122,9 +104,9 @@ export function UserTypesDataTable({
const sensors = useSensors(useSensor(MouseSensor, {}), useSensor(TouchSensor, {}), useSensor(KeyboardSensor, {}))
const dataIds = React.useMemo<UniqueIdentifier[]>(() => data?.map(({ _id }) => _id) || [], [data])
const deleteMutation = useDeleteBuildMutation()
const deleteMutation = useDeleteUserTypeMutation()
const deleteHandler = (id: string) => { deleteMutation.mutate({ uuid: id }); setTimeout(() => { refetchTable() }, 400) }
const columns = getColumns(router, activeRoute, deleteHandler);
const columns = getColumns(router, deleteHandler);
const pagination = React.useMemo(() => ({ pageIndex: currentPage - 1, pageSize: pageSize }), [currentPage, pageSize])
const totalPages = Math.ceil(totalCount / pageSize)
@ -185,30 +167,9 @@ export function UserTypesDataTable({
})}
</DropdownMenuContent>
</DropdownMenu>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="sm">
<IconBorderLeftPlus />
<span className="hidden lg:inline">Selected To Add</span>
<span className="lg:hidden">Add</span>
<IconChevronDown />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-56">
{routeSelections.map((column) => {
return (
<DropdownMenuCheckboxItem key={column.url} className="capitalize" checked={activeRoute === column.url} onCheckedChange={(value) => setActiveRoute(column.url)} >
<div className="flex items-center gap-2">
{column.icon}{column.name}
</div>
</DropdownMenuCheckboxItem>
)
})}
</DropdownMenuContent>
</DropdownMenu>
<Button variant="outline" size="sm" onClick={() => { router.push("/builds/add") }}>
<Button variant="outline" size="sm" onClick={() => { router.push("/user-types/add") }}>
<IconPlus />
<span className="hidden lg:inline">Add Build</span>
<span className="hidden lg:inline">Add User Type</span>
</Button>
</div>
</div>

4
frontend/pages/user-types/list/schema.tsx
View File

@ -3,6 +3,7 @@ import { z } from "zod";
export const schema = z.object({
_id: z.string(),
uuid: z.string(),
type: z.string(),
token: z.string(),
typeToken: z.string(),
@ -10,7 +11,8 @@ export const schema = z.object({
isProperty: z.boolean(),
expiryStarts: z.string(),
expiryEnds: z.string(),
createdAt: z.string(),
updatedAt: z.string(),
});
export type schemaType = z.infer<typeof schema>;

254
frontend/pages/user-types/update/form.tsx
View File

@ -6,29 +6,41 @@ import { Input } from "@/components/ui/input"
import { Button } from "@/components/ui/button"
import { Separator } from "@/components/ui/separator"
import { DateTimePicker } from "@/components/ui/date-time-picker"
import { BuildUpdate, buildUpdateSchema } from "@/pages/builds/update/schema"
import { useUpdateBuildMutation } from "@/pages/builds/update/queries"
import { userTypeUpdate, userTypeUpdateSchema } from "./schema"
import { useUpdateUserTypesMutation } from "./queries"
import { Checkbox } from "@/components/ui/checkbox"
const UserTypesUpdateForm = ({ refetchTable, initData, selectedUuid }: { refetchTable: () => void, initData: BuildUpdate, selectedUuid: string }) => {
const UserTypesUpdateForm = ({ refetchTable, initData, selectedUuid }: { refetchTable: () => void, initData: userTypeUpdate, selectedUuid: string }) => {
const form = useForm<BuildUpdate>({ resolver: zodResolver(buildUpdateSchema), defaultValues: { ...initData } })
const form = useForm<userTypeUpdate>({ resolver: zodResolver(userTypeUpdateSchema), defaultValues: { ...initData } })
const { handleSubmit } = form
const mutation = useUpdateBuildMutation();
const mutation = useUpdateUserTypesMutation();
function onSubmit(values: BuildUpdate) { mutation.mutate({ data: values as any || initData, uuid: selectedUuid }); setTimeout(() => refetchTable(), 400) }
function onSubmit(values: userTypeUpdate) { mutation.mutate({ data: values as any || initData, uuid: selectedUuid }); setTimeout(() => refetchTable(), 400) }
return (
<Form {...form}>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-6 p-4" >
{/* ROW 1 */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="buildType.token"
name="type"
render={({ field }) => (
<FormItem>
<FormLabel>Type</FormLabel>
<FormControl>
<Input placeholder="Type" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="token"
render={({ field }) => (
<FormItem>
<FormLabel>Token</FormLabel>
@ -39,31 +51,17 @@ const UserTypesUpdateForm = ({ refetchTable, initData, selectedUuid }: { refetch
</FormItem>
)}
/>
<FormField
control={form.control}
name="collectionToken"
render={({ field }) => (
<FormItem>
<FormLabel>Collection Token</FormLabel>
<FormControl>
<Input placeholder="Collection Token" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="info.govAddressCode"
name="description"
render={({ field }) => (
<FormItem>
<FormLabel>Gov Address Code</FormLabel>
<FormLabel>Description</FormLabel>
<FormControl>
<Input placeholder="Gov Address Code" {...field} />
<Input placeholder="Description" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@ -71,159 +69,26 @@ const UserTypesUpdateForm = ({ refetchTable, initData, selectedUuid }: { refetch
/>
<FormField
control={form.control}
name="info.buildName"
name="typeToken"
render={({ field }) => (
<FormItem>
<FormLabel>Build Name</FormLabel>
<FormLabel>Type Token</FormLabel>
<FormControl>
<Input placeholder="Build Name" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.buildNo"
render={({ field }) => (
<FormItem>
<FormLabel>Build No</FormLabel>
<FormControl>
<Input placeholder="Build No" {...field} />
<Input placeholder="Type Token" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="info.maxFloor"
render={({ field }) => (
<FormItem>
<FormLabel>Max Floor</FormLabel>
<FormControl>
<Input placeholder="Max Floor" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.undergroundFloor"
render={({ field }) => (
<FormItem>
<FormLabel>Underground Floor</FormLabel>
<FormControl>
<Input placeholder="Underground Floor" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<FormField
control={form.control}
name="info.taxNo"
render={({ field }) => (
<FormItem>
<FormLabel>Tax No</FormLabel>
<FormControl>
<Input placeholder="Tax No" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.liftCount"
render={({ field }) => (
<FormItem>
<FormLabel>Lift Count</FormLabel>
<FormControl>
<Input placeholder="Lift Count" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="flex flex-row justify-evenly">
<FormField
control={form.control}
name="info.heatingSystem"
render={({ field }) => (
<FormItem className="flex flex-row items-center space-x-3 space-y-0">
<FormControl>
<Checkbox
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
<div className="leading-none">
<FormLabel>
Heating System
</FormLabel>
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.coolingSystem"
render={({ field }) => (
<FormItem className="flex flex-row items-center space-x-3 space-y-0">
<FormControl>
<Checkbox
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
<div className="leading-none">
<FormLabel>
Cooling System
</FormLabel>
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.hotWaterSystem"
render={({ field }) => (
<FormItem className="flex flex-row items-center space-x-3 space-y-0">
<FormControl>
<Checkbox
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
<div className="leading-none">
<FormLabel>
Hot Water System
</FormLabel>
</div>
</FormItem>
)}
/>
</div>
<Separator />
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<FormField
control={form.control}
name="info.buildDate"
name="expiryStarts"
render={({ field }) => (
<FormItem>
<FormLabel>Build Date</FormLabel>
<FormLabel>Expiry Starts</FormLabel>
<FormControl>
<DateTimePicker {...field} />
</FormControl>
@ -233,10 +98,10 @@ const UserTypesUpdateForm = ({ refetchTable, initData, selectedUuid }: { refetch
/>
<FormField
control={form.control}
name="info.decisionPeriodDate"
name="expiryEnds"
render={({ field }) => (
<FormItem>
<FormLabel>Decision Period Date</FormLabel>
<FormLabel>Expiry Ends</FormLabel>
<FormControl>
<DateTimePicker {...field} />
</FormControl>
@ -244,64 +109,25 @@ const UserTypesUpdateForm = ({ refetchTable, initData, selectedUuid }: { refetch
</FormItem>
)}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-4 gap-4">
<FormField
control={form.control}
name="info.blockServiceManCount"
name="isProperty"
render={({ field }) => (
<FormItem>
<FormLabel>Block Service Man Count</FormLabel>
<FormItem className="flex flex-row justify-center items-center space-x-3 space-y-0 mt-6">
<FormControl>
<Input placeholder="Block Service Man Count" {...field} />
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.securityServiceManCount"
render={({ field }) => (
<FormItem>
<FormLabel>Security Service Man Count</FormLabel>
<FormControl>
<Input placeholder="Security Service Man Count" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.garageCount"
render={({ field }) => (
<FormItem>
<FormLabel>Total Garage Count In Numbers</FormLabel>
<FormControl>
<Input placeholder="Total Garage Count" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="info.managementRoomId"
render={({ field }) => (
<FormItem>
<FormLabel>Management Room ID Assign</FormLabel>
<FormControl>
<Input placeholder="Management Room ID" {...field} />
</FormControl>
<FormMessage />
<div className="leading-none">
<FormLabel>
Is Property?
</FormLabel>
</div>
</FormItem>
)}
/>
</div>
<Button type="submit" className="w-full">Update Build</Button>
<Button type="submit" className="w-full">Update User Types</Button>
</form>
</Form>
);

2
frontend/pages/user-types/update/page.tsx
View File

@ -19,7 +19,7 @@ const PageUpdateUserTypes = () => {
const backToUserTypes = <><div>UUID not found in search params</div><Button onClick={() => router.push('/user-types')}>Back to Build</Button></>
if (!uuid) { return backToUserTypes }
const { data, isLoading, error, refetch } = useGraphQlUserTypesList({ limit, skip: (page - 1) * limit, sort, filters: { ...filters, _id: uuid } });
const { data, isLoading, error, refetch } = useGraphQlUserTypesList({ limit, skip: (page - 1) * limit, sort, filters: { ...filters, uuid } });
const initData = data?.data?.[0] || null;
if (!initData) { return backToUserTypes }

19
frontend/pages/user-types/update/queries.tsx
View File

@ -1,26 +1,25 @@
'use client'
import { useMutation } from '@tanstack/react-query'
import { UpdateBuildIbansUpdate } from './types';
import { userTypeUpdate } from './schema';
import { toISOIfNotZ } from '@/lib/utils';
const fetchGraphQlBuildUpdate = async (record: UpdateBuildIbansUpdate, uuid: string): Promise<{ data: UpdateBuildIbansUpdate | null; status: number }> => {
console.log('Fetching test data from local API');
const fetchGraphQlUserTypesUpdate = async (record: userTypeUpdate, uuid: string): Promise<{ data: userTypeUpdate | null; status: number }> => {
console.log('Update test data from local API');
console.dir({ record })
record.expiryStarts = record.expiryStarts ? toISOIfNotZ(record.expiryStarts) : undefined;
record.expiryEnds = record.expiryEnds ? toISOIfNotZ(record.expiryEnds) : undefined;
record.startDate = toISOIfNotZ(record.startDate);
record.stopDate = toISOIfNotZ(record.stopDate);
try {
const res = await fetch(`/api/build/update?uuid=${uuid || ''}`, { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify(record) });
const res = await fetch(`/api/user-types/update?uuid=${uuid || ''}`, { method: 'POST', cache: 'no-store', credentials: "include", body: JSON.stringify(record) });
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();
return { data: data.data, status: res.status }
} catch (error) { console.error('Error fetching test data:', error); throw error }
};
export function useUpdateBuildMutation() {
export function useUpdateUserTypesMutation() {
return useMutation({
mutationFn: ({ data, uuid }: { data: UpdateBuildIbansUpdate, uuid: string }) => fetchGraphQlBuildUpdate(data, uuid),
onSuccess: () => { console.log("Build updated successfully") },
onError: (error) => { console.error("Update Build failed:", error) },
mutationFn: ({ data, uuid }: { data: userTypeUpdate, uuid: string }) => fetchGraphQlUserTypesUpdate(data, uuid),
onSuccess: () => { console.log("User types updated successfully") },
onError: (error) => { console.error("Update user types failed:", error) },
})
}

37
frontend/pages/user-types/update/schema.ts
View File

@ -1,30 +1,15 @@
import { z } from "zod"
export const buildUpdateSchema = z.object({
buildType: z.object({
token: z.string(),
typeToken: z.string(),
type: z.string(),
}),
collectionToken: z.string(),
info: z.object({
govAddressCode: z.string(),
buildName: z.string(),
buildNo: z.string(),
maxFloor: z.number(),
undergroundFloor: z.number(),
buildDate: z.string(),
decisionPeriodDate: z.string(),
taxNo: z.string(),
liftCount: z.number(),
heatingSystem: z.boolean(),
coolingSystem: z.boolean(),
hotWaterSystem: z.boolean(),
blockServiceManCount: z.number(),
securityServiceManCount: z.number(),
garageCount: z.number(),
managementRoomId: z.number(),
}),
export const userTypeUpdateSchema = z.object({
type: z.string(),
token: z.string(),
typeToken: z.string(),
description: z.string(),
isProperty: z.boolean(),
expiryStarts: z.string().optional(),
expiryEnds: z.string().optional(),
});
export type BuildUpdate = z.infer<typeof buildUpdateSchema>;
export type userTypeUpdate = z.infer<typeof userTypeUpdateSchema>;

4
frontend/pages/user-types/update/table/columns.tsx
View File

@ -83,10 +83,10 @@ function getColumns(router: any, deleteHandler: (id: string) => void): ColumnDef
cell: ({ row }) => {
return (
<div className="flex flex-row gap-2">
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/builds/update?uuid=${row.original._id}`) }}>
<Button className="bg-amber-400 text-black border-amber-400" variant="outline" size="sm" onClick={() => { router.push(`/user-types/update?uuid=${row.original.uuid}`) }}>
<Pencil />
</Button>
<Button className="bg-red-700 text-white border-red-700" variant="outline" size="sm" onClick={() => { deleteHandler(row.original._id || "") }}>
<Button className="bg-red-700 text-white border-red-700" variant="outline" size="sm" onClick={() => { deleteHandler(row.original.uuid || "") }}>
<Trash />
</Button>
</div>

4
frontend/pages/user-types/update/table/data-table.tsx
View File

@ -167,9 +167,9 @@ export function UsersTypeDataTableUpdate({
})}
</DropdownMenuContent>
</DropdownMenu>
<Button variant="outline" size="sm" onClick={() => { router.push("/builds") }}>
<Button variant="outline" size="sm" onClick={() => { router.push("/user-types") }}>
<Home />
<span className="hidden lg:inline">Back to Build</span>
<span className="hidden lg:inline">Back to User Types</span>
</Button>
</div>
</div>

1
frontend/pages/user-types/update/table/schema.tsx
View File

@ -3,6 +3,7 @@ import { z } from "zod";
export const schema = z.object({
_id: z.string(),
uuid: z.string(),
type: z.string(),
token: z.string(),
typeToken: z.string(),