test(dock schedule fail): failed attempt ad doing a dock schedule but leaving in here
This commit is contained in:
@@ -0,0 +1,11 @@
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
|
||||
export const Route = createFileRoute('/(logistics)/logistics/deliverySchedule')(
|
||||
{
|
||||
component: RouteComponent,
|
||||
},
|
||||
)
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/(logistics)/logistics/deliverySchedule"!</div>
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
|
||||
export const Route = createFileRoute('/(mobileStuff)/_mobileLayout/')({
|
||||
component: RouteComponent,
|
||||
})
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/(mobileStuff)/_mobileLayout/"!</div>
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
|
||||
export const Route = createFileRoute('/(mobileStuff)/_mobileLayout/m/')({
|
||||
component: RouteComponent,
|
||||
})
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/(mobileStuff)/_mobileLayout/m/"!</div>
|
||||
}
|
||||
407
frontend/package-lock.json
generated
407
frontend/package-lock.json
generated
@@ -8,11 +8,14 @@
|
||||
"name": "frontend",
|
||||
"version": "0.0.0",
|
||||
"dependencies": {
|
||||
"@dnd-kit/core": "^6.3.1",
|
||||
"@radix-ui/react-avatar": "^1.1.10",
|
||||
"@radix-ui/react-checkbox": "^1.3.3",
|
||||
"@radix-ui/react-dialog": "^1.1.15",
|
||||
"@radix-ui/react-dropdown-menu": "^2.1.16",
|
||||
"@radix-ui/react-label": "^2.1.7",
|
||||
"@radix-ui/react-popover": "^1.1.15",
|
||||
"@radix-ui/react-scroll-area": "^1.2.10",
|
||||
"@radix-ui/react-select": "^2.2.6",
|
||||
"@radix-ui/react-separator": "^1.1.7",
|
||||
"@radix-ui/react-slot": "^1.2.3",
|
||||
@@ -22,14 +25,22 @@
|
||||
"@tanstack/react-query": "^5.89.0",
|
||||
"@tanstack/react-router": "^1.131.36",
|
||||
"@tanstack/react-router-devtools": "^1.131.36",
|
||||
"@types/react-calendar-timeline": "^0.28.6",
|
||||
"axios": "^1.12.2",
|
||||
"better-auth": "^1.3.11",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"date-fns": "^4.1.0",
|
||||
"is-mobile": "^5.0.0",
|
||||
"js-cookie": "^3.0.5",
|
||||
"lucide-react": "^0.542.0",
|
||||
"moment": "^2.30.1",
|
||||
"r": "^0.0.5",
|
||||
"react": "^19.1.1",
|
||||
"react-calendar-timeline": "^0.30.0-beta.3",
|
||||
"react-day-picker": "^9.11.1",
|
||||
"react-dom": "^19.1.1",
|
||||
"socket.io-client": "^4.8.1",
|
||||
"sonner": "^2.0.7",
|
||||
"tailwind-merge": "^3.3.1",
|
||||
"tailwindcss": "^4.1.13",
|
||||
@@ -527,6 +538,51 @@
|
||||
"resolved": "https://registry.npmjs.org/@better-fetch/fetch/-/fetch-1.1.18.tgz",
|
||||
"integrity": "sha512-rEFOE1MYIsBmoMJtQbl32PGHHXuG2hDxvEd7rUHE0vCBoFQVSDqaVs9hkZEtHCxRoY+CljXKFCOuJ8uxqw1LcA=="
|
||||
},
|
||||
"node_modules/@date-fns/tz": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@date-fns/tz/-/tz-1.4.1.tgz",
|
||||
"integrity": "sha512-P5LUNhtbj6YfI3iJjw5EL9eUAG6OitD0W3fWQcpQjDRc/QIsL0tRNuO1PcDvPccWL1fSTXXdE1ds+l95DV/OFA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@dnd-kit/accessibility": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@dnd-kit/accessibility/-/accessibility-3.1.1.tgz",
|
||||
"integrity": "sha512-2P+YgaXF+gRsIihwwY1gCsQSYnu9Zyj2py8kY5fFvUM1qm2WA2u639R6YNVfU4GWr+ZM5mqEsfHZZLoRONbemw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"tslib": "^2.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@dnd-kit/core": {
|
||||
"version": "6.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@dnd-kit/core/-/core-6.3.1.tgz",
|
||||
"integrity": "sha512-xkGBRQQab4RLwgXxoqETICr6S5JlogafbhNsidmrkVv2YRs5MLwpjoF2qpiGjQt8S9AoxtIV603s0GIUpY5eYQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@dnd-kit/accessibility": "^3.1.1",
|
||||
"@dnd-kit/utilities": "^3.2.2",
|
||||
"tslib": "^2.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
"react-dom": ">=16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@dnd-kit/utilities": {
|
||||
"version": "3.2.2",
|
||||
"resolved": "https://registry.npmjs.org/@dnd-kit/utilities/-/utilities-3.2.2.tgz",
|
||||
"integrity": "sha512-+MKAJEOfaBe5SmV6t34p80MMKhjvUz0vRrvVJbPT0WElzaOJ/1xs+D+KDv+tD/NE5ujfrChEcshd4fLn0wpiqg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"tslib": "^2.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/aix-ppc64": {
|
||||
"version": "0.25.9",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.9.tgz",
|
||||
@@ -1207,6 +1263,13 @@
|
||||
"url": "https://github.com/sponsors/nzakas"
|
||||
}
|
||||
},
|
||||
"node_modules/@interactjs/types": {
|
||||
"version": "1.10.27",
|
||||
"resolved": "https://registry.npmjs.org/@interactjs/types/-/types-1.10.27.tgz",
|
||||
"integrity": "sha512-BUdv0cvs4H5ODuwft2Xp4eL8Vmi3LcihK42z0Ft/FbVJZoRioBsxH+LlsBdK4tAie7PqlKGy+1oyOncu1nQ6eA==",
|
||||
"license": "MIT",
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/@isaacs/fs-minipass": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@isaacs/fs-minipass/-/fs-minipass-4.0.1.tgz",
|
||||
@@ -1864,6 +1927,43 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@radix-ui/react-popover": {
|
||||
"version": "1.1.15",
|
||||
"resolved": "https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.1.15.tgz",
|
||||
"integrity": "sha512-kr0X2+6Yy/vJzLYJUPCZEc8SfQcf+1COFoAqauJm74umQhta9M7lNJHP7QQS3vkvcGLQUbWpMzwrXYwrYztHKA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@radix-ui/primitive": "1.1.3",
|
||||
"@radix-ui/react-compose-refs": "1.1.2",
|
||||
"@radix-ui/react-context": "1.1.2",
|
||||
"@radix-ui/react-dismissable-layer": "1.1.11",
|
||||
"@radix-ui/react-focus-guards": "1.1.3",
|
||||
"@radix-ui/react-focus-scope": "1.1.7",
|
||||
"@radix-ui/react-id": "1.1.1",
|
||||
"@radix-ui/react-popper": "1.2.8",
|
||||
"@radix-ui/react-portal": "1.1.9",
|
||||
"@radix-ui/react-presence": "1.1.5",
|
||||
"@radix-ui/react-primitive": "2.1.3",
|
||||
"@radix-ui/react-slot": "1.2.3",
|
||||
"@radix-ui/react-use-controllable-state": "1.2.2",
|
||||
"aria-hidden": "^1.2.4",
|
||||
"react-remove-scroll": "^2.6.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@types/react": "*",
|
||||
"@types/react-dom": "*",
|
||||
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
|
||||
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@types/react": {
|
||||
"optional": true
|
||||
},
|
||||
"@types/react-dom": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@radix-ui/react-popper": {
|
||||
"version": "1.2.8",
|
||||
"resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.8.tgz",
|
||||
@@ -1998,6 +2098,37 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@radix-ui/react-scroll-area": {
|
||||
"version": "1.2.10",
|
||||
"resolved": "https://registry.npmjs.org/@radix-ui/react-scroll-area/-/react-scroll-area-1.2.10.tgz",
|
||||
"integrity": "sha512-tAXIa1g3sM5CGpVT0uIbUx/U3Gs5N8T52IICuCtObaos1S8fzsrPXG5WObkQN3S6NVl6wKgPhAIiBGbWnvc97A==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@radix-ui/number": "1.1.1",
|
||||
"@radix-ui/primitive": "1.1.3",
|
||||
"@radix-ui/react-compose-refs": "1.1.2",
|
||||
"@radix-ui/react-context": "1.1.2",
|
||||
"@radix-ui/react-direction": "1.1.1",
|
||||
"@radix-ui/react-presence": "1.1.5",
|
||||
"@radix-ui/react-primitive": "2.1.3",
|
||||
"@radix-ui/react-use-callback-ref": "1.1.1",
|
||||
"@radix-ui/react-use-layout-effect": "1.1.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@types/react": "*",
|
||||
"@types/react-dom": "*",
|
||||
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
|
||||
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@types/react": {
|
||||
"optional": true
|
||||
},
|
||||
"@types/react-dom": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@radix-ui/react-select": {
|
||||
"version": "2.2.6",
|
||||
"resolved": "https://registry.npmjs.org/@radix-ui/react-select/-/react-select-2.2.6.tgz",
|
||||
@@ -2591,6 +2722,12 @@
|
||||
"node": ">=20.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@socket.io/component-emitter": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz",
|
||||
"integrity": "sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@swc/core": {
|
||||
"version": "1.13.5",
|
||||
"resolved": "https://registry.npmjs.org/@swc/core/-/core-1.13.5.tgz",
|
||||
@@ -3444,12 +3581,21 @@
|
||||
"version": "19.1.11",
|
||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.1.11.tgz",
|
||||
"integrity": "sha512-lr3jdBw/BGj49Eps7EvqlUaoeA0xpj3pc0RoJkHpYaCHkVK7i28dKyImLQb3JVlqs3aYSXf7qYuWOW/fgZnTXQ==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"csstype": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-calendar-timeline": {
|
||||
"version": "0.28.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-calendar-timeline/-/react-calendar-timeline-0.28.6.tgz",
|
||||
"integrity": "sha512-43ttmxoxfi9IdMBjU+My8Aa5ArX0fq2DCOJSol6Bt/fbRKHS/fEmIP/GGeXYavpt+vmCjeToHHLPTw/EXqqAFQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/react": "*",
|
||||
"moment": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-dom": {
|
||||
"version": "19.1.8",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.1.8.tgz",
|
||||
@@ -3898,6 +4044,12 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/batch-processor": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/batch-processor/-/batch-processor-1.0.0.tgz",
|
||||
"integrity": "sha512-xoLQD8gmmR32MeuBHgH0Tzd5PuSZx71ZsbhVxOCRbgktZEPe4SQy7s9Z50uPp0F/f7iw2XmkHN2xkgbMfckMDA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/better-auth": {
|
||||
"version": "1.3.11",
|
||||
"resolved": "https://registry.npmjs.org/better-auth/-/better-auth-1.3.11.tgz",
|
||||
@@ -4165,6 +4317,12 @@
|
||||
"url": "https://polar.sh/cva"
|
||||
}
|
||||
},
|
||||
"node_modules/classnames": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz",
|
||||
"integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/clsx": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
|
||||
@@ -4247,6 +4405,29 @@
|
||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/date-fns": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
|
||||
"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
|
||||
"license": "MIT",
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/kossnocorp"
|
||||
}
|
||||
},
|
||||
"node_modules/date-fns-jalali": {
|
||||
"version": "4.1.0-0",
|
||||
"resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-4.1.0-0.tgz",
|
||||
"integrity": "sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/dayjs": {
|
||||
"version": "1.11.18",
|
||||
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.18.tgz",
|
||||
"integrity": "sha512-zFBQ7WFRvVRhKcWoUh+ZA1g2HVgUbsZm9sbddh8EC5iv93sui8DVVz1Npvz+r6meo9VKfa8NyLWBsQK1VvIKPA==",
|
||||
"license": "MIT",
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/debug": {
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
|
||||
@@ -4345,6 +4526,54 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/element-resize-detector": {
|
||||
"version": "1.2.4",
|
||||
"resolved": "https://registry.npmjs.org/element-resize-detector/-/element-resize-detector-1.2.4.tgz",
|
||||
"integrity": "sha512-Fl5Ftk6WwXE0wqCgNoseKWndjzZlDCwuPTcoVZfCP9R3EHQF8qUtr3YUPNETegRBOKqQKPW3n4kiIWngGi8tKg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"batch-processor": "1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-client": {
|
||||
"version": "6.6.3",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.6.3.tgz",
|
||||
"integrity": "sha512-T0iLjnyNWahNyv/lcjS2y4oE358tVS/SYQNxYXGAJ9/GLgH4VCvOQ/mhTjqU88mLZCQgiG8RIegFHYCdVC+j5w==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.1",
|
||||
"engine.io-parser": "~5.2.1",
|
||||
"ws": "~8.17.1",
|
||||
"xmlhttprequest-ssl": "~2.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-client/node_modules/debug": {
|
||||
"version": "4.3.7",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
|
||||
"integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ms": "^2.1.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"supports-color": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-parser": {
|
||||
"version": "5.2.3",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.3.tgz",
|
||||
"integrity": "sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/enhanced-resolve": {
|
||||
"version": "5.18.3",
|
||||
"resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.18.3.tgz",
|
||||
@@ -5058,6 +5287,16 @@
|
||||
"node": ">=0.8.19"
|
||||
}
|
||||
},
|
||||
"node_modules/interactjs": {
|
||||
"version": "1.10.27",
|
||||
"resolved": "https://registry.npmjs.org/interactjs/-/interactjs-1.10.27.tgz",
|
||||
"integrity": "sha512-y/8RcCftGAF24gSp76X2JS3XpHiUvDQyhF8i7ujemBz77hwiHDuJzftHx7thY8cxGogwGiPJ+o97kWB6eAXnsA==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@interactjs/types": "1.10.27"
|
||||
}
|
||||
},
|
||||
"node_modules/is-binary-path": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
||||
@@ -5094,6 +5333,12 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-mobile": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-mobile/-/is-mobile-5.0.0.tgz",
|
||||
"integrity": "sha512-Tz/yndySvLAEXh+Uk8liFCxOwVH6YutuR74utvOcu7I9Di+DwM0mtdPVZNaVvvBUM2OXxne/NhOs1zAO7riusQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/is-number": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
@@ -5491,6 +5736,12 @@
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/lodash.merge": {
|
||||
"version": "4.6.2",
|
||||
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
|
||||
@@ -5535,6 +5786,12 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/memoize-one": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz",
|
||||
"integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/merge2": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
|
||||
@@ -5629,11 +5886,19 @@
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/moment": {
|
||||
"version": "2.30.1",
|
||||
"resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
|
||||
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.3",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
|
||||
"integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/nanoid": {
|
||||
@@ -5904,6 +6169,14 @@
|
||||
],
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/r": {
|
||||
"version": "0.0.5",
|
||||
"resolved": "https://registry.npmjs.org/r/-/r-0.0.5.tgz",
|
||||
"integrity": "sha512-rO+FXCKIUiLEVCP4HjIEkq8V5gRHc1N15/2K97GSOE/P5evYj6uOOgvHlINCwMHnEmHouBdeR6PBDzZDqmEH2A==",
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react": {
|
||||
"version": "19.1.1",
|
||||
"resolved": "https://registry.npmjs.org/react/-/react-19.1.1.tgz",
|
||||
@@ -5913,6 +6186,45 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-calendar-timeline": {
|
||||
"version": "0.30.0-beta.3",
|
||||
"resolved": "https://registry.npmjs.org/react-calendar-timeline/-/react-calendar-timeline-0.30.0-beta.3.tgz",
|
||||
"integrity": "sha512-TckfoAzJvK5FEQo83vejbVtSDX1XNxcFmfCq92lMZKQiEuzbk7adcQi+ySlL9uSZ1ulFZS6YMAS6rzEGsVtZ2A==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"classnames": "^2.5.1",
|
||||
"element-resize-detector": "^1.2.4",
|
||||
"lodash": "^4.17.21",
|
||||
"memoize-one": "^6.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"dayjs": ">=1.10.0",
|
||||
"interactjs": "1.10.27",
|
||||
"react": "^18 || ^19.0.0-rc-66855b96-20241106",
|
||||
"react-dom": "^18 || ^19.0.0-rc-66855b96-20241106"
|
||||
}
|
||||
},
|
||||
"node_modules/react-day-picker": {
|
||||
"version": "9.11.1",
|
||||
"resolved": "https://registry.npmjs.org/react-day-picker/-/react-day-picker-9.11.1.tgz",
|
||||
"integrity": "sha512-l3ub6o8NlchqIjPKrRFUCkTUEq6KwemQlfv3XZzzwpUeGwmDJ+0u0Upmt38hJyd7D/vn2dQoOoLV/qAp0o3uUw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@date-fns/tz": "^1.4.1",
|
||||
"date-fns": "^4.1.0",
|
||||
"date-fns-jalali": "^4.1.0-0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://github.com/sponsors/gpbl"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-dom": {
|
||||
"version": "19.1.1",
|
||||
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.1.tgz",
|
||||
@@ -6209,6 +6521,68 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-client": {
|
||||
"version": "4.8.1",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.8.1.tgz",
|
||||
"integrity": "sha512-hJVXfu3E28NmzGk8o1sHhN3om52tRvwYeidbj7xKy2eIIse5IoKX3USlS6Tqt3BHAtflLIkCQBkzVrEEfWUyYQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.2",
|
||||
"engine.io-client": "~6.6.1",
|
||||
"socket.io-parser": "~4.2.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-client/node_modules/debug": {
|
||||
"version": "4.3.7",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
|
||||
"integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ms": "^2.1.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"supports-color": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-parser": {
|
||||
"version": "4.2.4",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz",
|
||||
"integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-parser/node_modules/debug": {
|
||||
"version": "4.3.7",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
|
||||
"integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ms": "^2.1.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"supports-color": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/solid-js": {
|
||||
"version": "1.9.9",
|
||||
"resolved": "https://registry.npmjs.org/solid-js/-/solid-js-1.9.9.tgz",
|
||||
@@ -6802,6 +7176,35 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/ws": {
|
||||
"version": "8.17.1",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.17.1.tgz",
|
||||
"integrity": "sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"bufferutil": "^4.0.1",
|
||||
"utf-8-validate": ">=5.0.2"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"bufferutil": {
|
||||
"optional": true
|
||||
},
|
||||
"utf-8-validate": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/xmlhttprequest-ssl": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.1.2.tgz",
|
||||
"integrity": "sha512-TEU+nJVUUnA4CYJFLvK5X9AOeH4KvDvhIfm0vV1GaQRtchnG0hgK5p8hw/xjv8cunWYCsiPCSDzObPyhEwq3KQ==",
|
||||
"engines": {
|
||||
"node": ">=0.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/yallist": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
|
||||
|
||||
@@ -10,11 +10,14 @@
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dnd-kit/core": "^6.3.1",
|
||||
"@radix-ui/react-avatar": "^1.1.10",
|
||||
"@radix-ui/react-checkbox": "^1.3.3",
|
||||
"@radix-ui/react-dialog": "^1.1.15",
|
||||
"@radix-ui/react-dropdown-menu": "^2.1.16",
|
||||
"@radix-ui/react-label": "^2.1.7",
|
||||
"@radix-ui/react-popover": "^1.1.15",
|
||||
"@radix-ui/react-scroll-area": "^1.2.10",
|
||||
"@radix-ui/react-select": "^2.2.6",
|
||||
"@radix-ui/react-separator": "^1.1.7",
|
||||
"@radix-ui/react-slot": "^1.2.3",
|
||||
@@ -24,14 +27,22 @@
|
||||
"@tanstack/react-query": "^5.89.0",
|
||||
"@tanstack/react-router": "^1.131.36",
|
||||
"@tanstack/react-router-devtools": "^1.131.36",
|
||||
"@types/react-calendar-timeline": "^0.28.6",
|
||||
"axios": "^1.12.2",
|
||||
"better-auth": "^1.3.11",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"date-fns": "^4.1.0",
|
||||
"is-mobile": "^5.0.0",
|
||||
"js-cookie": "^3.0.5",
|
||||
"lucide-react": "^0.542.0",
|
||||
"moment": "^2.30.1",
|
||||
"r": "^0.0.5",
|
||||
"react": "^19.1.1",
|
||||
"react-calendar-timeline": "^0.30.0-beta.3",
|
||||
"react-day-picker": "^9.11.1",
|
||||
"react-dom": "^19.1.1",
|
||||
"socket.io-client": "^4.8.1",
|
||||
"sonner": "^2.0.7",
|
||||
"tailwind-merge": "^3.3.1",
|
||||
"tailwindcss": "^4.1.13",
|
||||
|
||||
225
frontend/src/components/ui/calendar.tsx
Normal file
225
frontend/src/components/ui/calendar.tsx
Normal file
@@ -0,0 +1,225 @@
|
||||
import * as React from "react";
|
||||
import {
|
||||
ChevronDownIcon,
|
||||
ChevronLeftIcon,
|
||||
ChevronRightIcon,
|
||||
} from "lucide-react";
|
||||
import { DayButton, DayPicker, getDefaultClassNames } from "react-day-picker";
|
||||
import { buttonVariants, Button } from "./button";
|
||||
import { cn } from "../../lib/utils";
|
||||
|
||||
function Calendar({
|
||||
className,
|
||||
classNames,
|
||||
showOutsideDays = true,
|
||||
captionLayout = "label",
|
||||
buttonVariant = "ghost",
|
||||
formatters,
|
||||
components,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DayPicker> & {
|
||||
buttonVariant?: React.ComponentProps<typeof Button>["variant"];
|
||||
}) {
|
||||
const defaultClassNames = getDefaultClassNames();
|
||||
|
||||
return (
|
||||
<DayPicker
|
||||
showOutsideDays={showOutsideDays}
|
||||
className={cn(
|
||||
"bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
|
||||
String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
|
||||
String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
|
||||
className
|
||||
)}
|
||||
captionLayout={captionLayout}
|
||||
formatters={{
|
||||
formatMonthDropdown: (date) =>
|
||||
date.toLocaleString("default", { month: "short" }),
|
||||
...formatters,
|
||||
}}
|
||||
classNames={{
|
||||
root: cn("w-fit", defaultClassNames.root),
|
||||
months: cn(
|
||||
"flex gap-4 flex-col md:flex-row relative",
|
||||
defaultClassNames.months
|
||||
),
|
||||
month: cn(
|
||||
"flex flex-col w-full gap-4",
|
||||
defaultClassNames.month
|
||||
),
|
||||
nav: cn(
|
||||
"flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between",
|
||||
defaultClassNames.nav
|
||||
),
|
||||
button_previous: cn(
|
||||
buttonVariants({ variant: buttonVariant }),
|
||||
"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
|
||||
defaultClassNames.button_previous
|
||||
),
|
||||
button_next: cn(
|
||||
buttonVariants({ variant: buttonVariant }),
|
||||
"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
|
||||
defaultClassNames.button_next
|
||||
),
|
||||
month_caption: cn(
|
||||
"flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)",
|
||||
defaultClassNames.month_caption
|
||||
),
|
||||
dropdowns: cn(
|
||||
"w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5",
|
||||
defaultClassNames.dropdowns
|
||||
),
|
||||
dropdown_root: cn(
|
||||
"relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] rounded-md",
|
||||
defaultClassNames.dropdown_root
|
||||
),
|
||||
dropdown: cn(
|
||||
"absolute bg-popover inset-0 opacity-0",
|
||||
defaultClassNames.dropdown
|
||||
),
|
||||
caption_label: cn(
|
||||
"select-none font-medium",
|
||||
captionLayout === "label"
|
||||
? "text-sm"
|
||||
: "rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5",
|
||||
defaultClassNames.caption_label
|
||||
),
|
||||
table: "w-full border-collapse",
|
||||
weekdays: cn("flex", defaultClassNames.weekdays),
|
||||
weekday: cn(
|
||||
"text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none",
|
||||
defaultClassNames.weekday
|
||||
),
|
||||
week: cn("flex w-full mt-2", defaultClassNames.week),
|
||||
week_number_header: cn(
|
||||
"select-none w-(--cell-size)",
|
||||
defaultClassNames.week_number_header
|
||||
),
|
||||
week_number: cn(
|
||||
"text-[0.8rem] select-none text-muted-foreground",
|
||||
defaultClassNames.week_number
|
||||
),
|
||||
day: cn(
|
||||
"relative w-full h-full p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none",
|
||||
defaultClassNames.day
|
||||
),
|
||||
range_start: cn(
|
||||
"rounded-l-md bg-accent",
|
||||
defaultClassNames.range_start
|
||||
),
|
||||
range_middle: cn(
|
||||
"rounded-none",
|
||||
defaultClassNames.range_middle
|
||||
),
|
||||
range_end: cn(
|
||||
"rounded-r-md bg-accent",
|
||||
defaultClassNames.range_end
|
||||
),
|
||||
today: cn(
|
||||
"bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none",
|
||||
defaultClassNames.today
|
||||
),
|
||||
outside: cn(
|
||||
"text-muted-foreground aria-selected:text-muted-foreground",
|
||||
defaultClassNames.outside
|
||||
),
|
||||
disabled: cn(
|
||||
"text-muted-foreground opacity-50",
|
||||
defaultClassNames.disabled
|
||||
),
|
||||
hidden: cn("invisible", defaultClassNames.hidden),
|
||||
...classNames,
|
||||
}}
|
||||
components={{
|
||||
Root: ({ className, rootRef, ...props }) => {
|
||||
return (
|
||||
<div
|
||||
data-slot="calendar"
|
||||
ref={rootRef}
|
||||
className={cn(className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Chevron: ({ className, orientation, ...props }) => {
|
||||
if (orientation === "left") {
|
||||
return (
|
||||
<ChevronLeftIcon
|
||||
className={cn("size-4", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (orientation === "right") {
|
||||
return (
|
||||
<ChevronRightIcon
|
||||
className={cn("size-4", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<ChevronDownIcon
|
||||
className={cn("size-4", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
},
|
||||
DayButton: CalendarDayButton,
|
||||
WeekNumber: ({ children, ...props }) => {
|
||||
return (
|
||||
<td {...props}>
|
||||
<div className="flex size-(--cell-size) items-center justify-center text-center">
|
||||
{children}
|
||||
</div>
|
||||
</td>
|
||||
);
|
||||
},
|
||||
...components,
|
||||
}}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function CalendarDayButton({
|
||||
className,
|
||||
day,
|
||||
modifiers,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DayButton>) {
|
||||
const defaultClassNames = getDefaultClassNames();
|
||||
|
||||
const ref = React.useRef<HTMLButtonElement>(null);
|
||||
React.useEffect(() => {
|
||||
if (modifiers.focused) ref.current?.focus();
|
||||
}, [modifiers.focused]);
|
||||
|
||||
return (
|
||||
<Button
|
||||
ref={ref}
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
data-day={day.date.toLocaleDateString()}
|
||||
data-selected-single={
|
||||
modifiers.selected &&
|
||||
!modifiers.range_start &&
|
||||
!modifiers.range_end &&
|
||||
!modifiers.range_middle
|
||||
}
|
||||
data-range-start={modifiers.range_start}
|
||||
data-range-end={modifiers.range_end}
|
||||
data-range-middle={modifiers.range_middle}
|
||||
className={cn(
|
||||
"data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70",
|
||||
defaultClassNames.day,
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export { Calendar, CalendarDayButton };
|
||||
31
frontend/src/components/ui/datePicker.tsx
Normal file
31
frontend/src/components/ui/datePicker.tsx
Normal file
@@ -0,0 +1,31 @@
|
||||
import { format } from "date-fns";
|
||||
import { Calendar as CalendarIcon } from "lucide-react";
|
||||
import { Popover, PopoverContent, PopoverTrigger } from "./popover";
|
||||
import { Button } from "./button";
|
||||
import { Calendar } from "./calendar";
|
||||
|
||||
export function DatePicker({
|
||||
date,
|
||||
onChange,
|
||||
}: {
|
||||
date?: Date;
|
||||
onChange?: (d: Date | undefined) => void;
|
||||
}) {
|
||||
return (
|
||||
<Popover>
|
||||
<PopoverTrigger asChild>
|
||||
<Button
|
||||
variant="outline"
|
||||
data-empty={!date}
|
||||
className="data-[empty=true]:text-muted-foreground w-[200px] justify-start text-left font-normal"
|
||||
>
|
||||
<CalendarIcon className="mr-2 h-4 w-4" />
|
||||
{date ? format(date, "PPP") : <span>Pick a date</span>}
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="w-auto p-0">
|
||||
<Calendar mode="single" selected={date} onSelect={onChange} />
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
);
|
||||
}
|
||||
45
frontend/src/components/ui/popover.tsx
Normal file
45
frontend/src/components/ui/popover.tsx
Normal file
@@ -0,0 +1,45 @@
|
||||
import * as React from "react";
|
||||
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
||||
import { cn } from "../../lib/utils";
|
||||
|
||||
function Popover({
|
||||
...props
|
||||
}: React.ComponentProps<typeof PopoverPrimitive.Root>) {
|
||||
return <PopoverPrimitive.Root data-slot="popover" {...props} />;
|
||||
}
|
||||
|
||||
function PopoverTrigger({
|
||||
...props
|
||||
}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {
|
||||
return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props} />;
|
||||
}
|
||||
|
||||
function PopoverContent({
|
||||
className,
|
||||
align = "center",
|
||||
sideOffset = 4,
|
||||
...props
|
||||
}: React.ComponentProps<typeof PopoverPrimitive.Content>) {
|
||||
return (
|
||||
<PopoverPrimitive.Portal>
|
||||
<PopoverPrimitive.Content
|
||||
data-slot="popover-content"
|
||||
align={align}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
</PopoverPrimitive.Portal>
|
||||
);
|
||||
}
|
||||
|
||||
function PopoverAnchor({
|
||||
...props
|
||||
}: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {
|
||||
return <PopoverPrimitive.Anchor data-slot="popover-anchor" {...props} />;
|
||||
}
|
||||
|
||||
export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };
|
||||
56
frontend/src/components/ui/scroll-area.tsx
Normal file
56
frontend/src/components/ui/scroll-area.tsx
Normal file
@@ -0,0 +1,56 @@
|
||||
import * as React from "react"
|
||||
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
|
||||
|
||||
import { cn } from "@/lib/utils"
|
||||
|
||||
function ScrollArea({
|
||||
className,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {
|
||||
return (
|
||||
<ScrollAreaPrimitive.Root
|
||||
data-slot="scroll-area"
|
||||
className={cn("relative", className)}
|
||||
{...props}
|
||||
>
|
||||
<ScrollAreaPrimitive.Viewport
|
||||
data-slot="scroll-area-viewport"
|
||||
className="focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1"
|
||||
>
|
||||
{children}
|
||||
</ScrollAreaPrimitive.Viewport>
|
||||
<ScrollBar />
|
||||
<ScrollAreaPrimitive.Corner />
|
||||
</ScrollAreaPrimitive.Root>
|
||||
)
|
||||
}
|
||||
|
||||
function ScrollBar({
|
||||
className,
|
||||
orientation = "vertical",
|
||||
...props
|
||||
}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {
|
||||
return (
|
||||
<ScrollAreaPrimitive.ScrollAreaScrollbar
|
||||
data-slot="scroll-area-scrollbar"
|
||||
orientation={orientation}
|
||||
className={cn(
|
||||
"flex touch-none p-px transition-colors select-none",
|
||||
orientation === "vertical" &&
|
||||
"h-full w-2.5 border-l border-l-transparent",
|
||||
orientation === "horizontal" &&
|
||||
"h-2.5 flex-col border-t border-t-transparent",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<ScrollAreaPrimitive.ScrollAreaThumb
|
||||
data-slot="scroll-area-thumb"
|
||||
className="bg-border relative flex-1 rounded-full"
|
||||
/>
|
||||
</ScrollAreaPrimitive.ScrollAreaScrollbar>
|
||||
)
|
||||
}
|
||||
|
||||
export { ScrollArea, ScrollBar }
|
||||
@@ -4,117 +4,117 @@
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
@theme inline {
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
}
|
||||
|
||||
:root {
|
||||
--radius: 0.625rem;
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.145 0 0);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.145 0 0);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.145 0 0);
|
||||
--primary: oklch(0.205 0 0);
|
||||
--primary-foreground: oklch(0.985 0 0);
|
||||
--secondary: oklch(0.97 0 0);
|
||||
--secondary-foreground: oklch(0.205 0 0);
|
||||
--muted: oklch(0.97 0 0);
|
||||
--muted-foreground: oklch(0.556 0 0);
|
||||
--accent: oklch(0.97 0 0);
|
||||
--accent-foreground: oklch(0.205 0 0);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--border: oklch(0.922 0 0);
|
||||
--input: oklch(0.922 0 0);
|
||||
--ring: oklch(0.708 0 0);
|
||||
--chart-1: oklch(0.646 0.222 41.116);
|
||||
--chart-2: oklch(0.6 0.118 184.704);
|
||||
--chart-3: oklch(0.398 0.07 227.392);
|
||||
--chart-4: oklch(0.828 0.189 84.429);
|
||||
--chart-5: oklch(0.769 0.188 70.08);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.145 0 0);
|
||||
--sidebar-primary: oklch(0.205 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||
--sidebar-accent: oklch(0.97 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.205 0 0);
|
||||
--sidebar-border: oklch(0.922 0 0);
|
||||
--sidebar-ring: oklch(0.708 0 0);
|
||||
--radius: 0.625rem;
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.145 0 0);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.145 0 0);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.145 0 0);
|
||||
--primary: oklch(0.205 0 0);
|
||||
--primary-foreground: oklch(0.985 0 0);
|
||||
--secondary: oklch(0.97 0 0);
|
||||
--secondary-foreground: oklch(0.205 0 0);
|
||||
--muted: oklch(0.97 0 0);
|
||||
--muted-foreground: oklch(0.556 0 0);
|
||||
--accent: oklch(0.97 0 0);
|
||||
--accent-foreground: oklch(0.205 0 0);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--border: oklch(0.922 0 0);
|
||||
--input: oklch(0.922 0 0);
|
||||
--ring: oklch(0.708 0 0);
|
||||
--chart-1: oklch(0.646 0.222 41.116);
|
||||
--chart-2: oklch(0.6 0.118 184.704);
|
||||
--chart-3: oklch(0.398 0.07 227.392);
|
||||
--chart-4: oklch(0.828 0.189 84.429);
|
||||
--chart-5: oklch(0.769 0.188 70.08);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.145 0 0);
|
||||
--sidebar-primary: oklch(0.205 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||
--sidebar-accent: oklch(0.97 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.205 0 0);
|
||||
--sidebar-border: oklch(0.922 0 0);
|
||||
--sidebar-ring: oklch(0.708 0 0);
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.145 0 0);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.205 0 0);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.205 0 0);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.922 0 0);
|
||||
--primary-foreground: oklch(0.205 0 0);
|
||||
--secondary: oklch(0.269 0 0);
|
||||
--secondary-foreground: oklch(0.985 0 0);
|
||||
--muted: oklch(0.269 0 0);
|
||||
--muted-foreground: oklch(0.708 0 0);
|
||||
--accent: oklch(0.269 0 0);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.556 0 0);
|
||||
--chart-1: oklch(0.488 0.243 264.376);
|
||||
--chart-2: oklch(0.696 0.17 162.48);
|
||||
--chart-3: oklch(0.769 0.188 70.08);
|
||||
--chart-4: oklch(0.627 0.265 303.9);
|
||||
--chart-5: oklch(0.645 0.246 16.439);
|
||||
--sidebar: oklch(0.205 0 0);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||
--sidebar-accent: oklch(0.269 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.556 0 0);
|
||||
--background: oklch(0.145 0 0);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.205 0 0);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.205 0 0);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.922 0 0);
|
||||
--primary-foreground: oklch(0.205 0 0);
|
||||
--secondary: oklch(0.269 0 0);
|
||||
--secondary-foreground: oklch(0.985 0 0);
|
||||
--muted: oklch(0.269 0 0);
|
||||
--muted-foreground: oklch(0.708 0 0);
|
||||
--accent: oklch(0.269 0 0);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.556 0 0);
|
||||
--chart-1: oklch(0.488 0.243 264.376);
|
||||
--chart-2: oklch(0.696 0.17 162.48);
|
||||
--chart-3: oklch(0.769 0.188 70.08);
|
||||
--chart-4: oklch(0.627 0.265 303.9);
|
||||
--chart-5: oklch(0.645 0.246 16.439);
|
||||
--sidebar: oklch(0.205 0 0);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||
--sidebar-accent: oklch(0.269 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.556 0 0);
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border outline-ring/50;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
* {
|
||||
@apply border-border outline-ring/50;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
}
|
||||
|
||||
59
frontend/src/lib/socket.io/socket.tsx
Normal file
59
frontend/src/lib/socket.io/socket.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
import { io } from "socket.io-client";
|
||||
|
||||
export const coreSocket = io(
|
||||
window.location.origin || "http://localhost:3000",
|
||||
{
|
||||
path: "/lst/api/ws",
|
||||
autoConnect: true,
|
||||
// transports: ["websocket", "polling"],
|
||||
withCredentials: true,
|
||||
reconnectionAttempts: 5,
|
||||
timeout: 10_000,
|
||||
}
|
||||
);
|
||||
|
||||
// --- Core events ---
|
||||
coreSocket.on("connect", () => {
|
||||
console.log("✅ Core connected:", coreSocket.id);
|
||||
console.log("🔗 Transport:", coreSocket.io.engine.transport.name);
|
||||
});
|
||||
|
||||
coreSocket.on("disconnect", (reason) => {
|
||||
console.warn("🔴 Core disconnected:", reason);
|
||||
if (reason === "io server disconnect") coreSocket.connect();
|
||||
});
|
||||
|
||||
coreSocket.on("connect_error", (err) => {
|
||||
console.error("❌ Core connect error:", err.message);
|
||||
});
|
||||
|
||||
coreSocket.io.on("reconnect_attempt", (attempt) => {
|
||||
console.log("♻️ Core reconnect attempt:", attempt);
|
||||
});
|
||||
|
||||
coreSocket.io.on("reconnect_failed", () => {
|
||||
console.error("💀 Core reconnect failed after max attempts");
|
||||
});
|
||||
|
||||
coreSocket.io.engine.on("upgrade", (transport) => {
|
||||
console.log("🚀 Core upgraded to:", transport.name);
|
||||
});
|
||||
|
||||
coreSocket.io.engine.on("close", (reason) => {
|
||||
console.warn("🧨 Core engine closed:", reason);
|
||||
});
|
||||
|
||||
setInterval(() => {
|
||||
//console.log(window.location.origin);
|
||||
if (coreSocket.connected) {
|
||||
coreSocket.emit("keepalive");
|
||||
console.log("🏓 Ping sent to server");
|
||||
} else {
|
||||
//console.warn("⚠️ Socket not connected, skipping ping");
|
||||
}
|
||||
}, 30 * 1000);
|
||||
|
||||
// Optional: listen for server acknowledgment
|
||||
coreSocket.on("pongCheck", (data) => {
|
||||
console.log("🏓 Pong received from server:", data);
|
||||
});
|
||||
@@ -14,16 +14,27 @@ import { Route as rootRouteImport } from './routes/__root'
|
||||
import { Route as AdminLayoutRouteRouteImport } from './routes/_adminLayout/route'
|
||||
import { Route as IndexRouteImport } from './routes/index'
|
||||
import { Route as authLoginRouteImport } from './routes/(auth)/login'
|
||||
import { Route as mobileStuffMobileLayoutRouteRouteImport } from './routes/(mobileStuff)/_mobileLayout/route'
|
||||
import { Route as AdminLayoutAdminSettingsRouteImport } from './routes/_adminLayout/admin/settings'
|
||||
import { Route as AdminLayoutAdminServersRouteImport } from './routes/_adminLayout/admin/servers'
|
||||
import { Route as logisticsLogisticsDeliveryScheduleRouteImport } from './routes/(logistics)/logistics/deliverySchedule'
|
||||
import { Route as authUserSignupRouteImport } from './routes/(auth)/user/signup'
|
||||
import { Route as authUserResetpasswordRouteImport } from './routes/(auth)/user/resetpassword'
|
||||
import { Route as AdminLayoutAdminUsersRouteRouteImport } from './routes/_adminLayout/admin/_users/route'
|
||||
import { Route as mobileStuffMobileLayoutMIndexRouteImport } from './routes/(mobileStuff)/_mobileLayout/m/index'
|
||||
import { Route as AdminLayoutAdminUsersUsersRouteImport } from './routes/_adminLayout/admin/_users/users'
|
||||
import { Route as AdminLayoutAdminUsersProdUsersRouteImport } from './routes/_adminLayout/admin/_users/prodUsers'
|
||||
import { Route as mobileStuffMobileLayoutMRelocateRouteImport } from './routes/(mobileStuff)/_mobileLayout/m/relocate'
|
||||
import { Route as mobileStuffMobileLayoutMDeliveryRouteImport } from './routes/(mobileStuff)/_mobileLayout/m/delivery'
|
||||
import { Route as mobileStuffMobileLayoutMCyclecountsRouteImport } from './routes/(mobileStuff)/_mobileLayout/m/cyclecounts'
|
||||
|
||||
const mobileStuffRouteImport = createFileRoute('/(mobileStuff)')()
|
||||
const AdminLayoutAdminRouteImport = createFileRoute('/_adminLayout/admin')()
|
||||
|
||||
const mobileStuffRoute = mobileStuffRouteImport.update({
|
||||
id: '/(mobileStuff)',
|
||||
getParentRoute: () => rootRouteImport,
|
||||
} as any)
|
||||
const AdminLayoutRouteRoute = AdminLayoutRouteRouteImport.update({
|
||||
id: '/_adminLayout',
|
||||
getParentRoute: () => rootRouteImport,
|
||||
@@ -43,6 +54,11 @@ const authLoginRoute = authLoginRouteImport.update({
|
||||
path: '/login',
|
||||
getParentRoute: () => rootRouteImport,
|
||||
} as any)
|
||||
const mobileStuffMobileLayoutRouteRoute =
|
||||
mobileStuffMobileLayoutRouteRouteImport.update({
|
||||
id: '/_mobileLayout',
|
||||
getParentRoute: () => mobileStuffRoute,
|
||||
} as any)
|
||||
const AdminLayoutAdminSettingsRoute =
|
||||
AdminLayoutAdminSettingsRouteImport.update({
|
||||
id: '/settings',
|
||||
@@ -54,6 +70,12 @@ const AdminLayoutAdminServersRoute = AdminLayoutAdminServersRouteImport.update({
|
||||
path: '/servers',
|
||||
getParentRoute: () => AdminLayoutAdminRoute,
|
||||
} as any)
|
||||
const logisticsLogisticsDeliveryScheduleRoute =
|
||||
logisticsLogisticsDeliveryScheduleRouteImport.update({
|
||||
id: '/(logistics)/logistics/deliverySchedule',
|
||||
path: '/logistics/deliverySchedule',
|
||||
getParentRoute: () => rootRouteImport,
|
||||
} as any)
|
||||
const authUserSignupRoute = authUserSignupRouteImport.update({
|
||||
id: '/(auth)/user/signup',
|
||||
path: '/user/signup',
|
||||
@@ -69,6 +91,12 @@ const AdminLayoutAdminUsersRouteRoute =
|
||||
id: '/_users',
|
||||
getParentRoute: () => AdminLayoutAdminRoute,
|
||||
} as any)
|
||||
const mobileStuffMobileLayoutMIndexRoute =
|
||||
mobileStuffMobileLayoutMIndexRouteImport.update({
|
||||
id: '/m/',
|
||||
path: '/m/',
|
||||
getParentRoute: () => mobileStuffMobileLayoutRouteRoute,
|
||||
} as any)
|
||||
const AdminLayoutAdminUsersUsersRoute =
|
||||
AdminLayoutAdminUsersUsersRouteImport.update({
|
||||
id: '/users',
|
||||
@@ -81,42 +109,77 @@ const AdminLayoutAdminUsersProdUsersRoute =
|
||||
path: '/prodUsers',
|
||||
getParentRoute: () => AdminLayoutAdminUsersRouteRoute,
|
||||
} as any)
|
||||
const mobileStuffMobileLayoutMRelocateRoute =
|
||||
mobileStuffMobileLayoutMRelocateRouteImport.update({
|
||||
id: '/m/relocate',
|
||||
path: '/m/relocate',
|
||||
getParentRoute: () => mobileStuffMobileLayoutRouteRoute,
|
||||
} as any)
|
||||
const mobileStuffMobileLayoutMDeliveryRoute =
|
||||
mobileStuffMobileLayoutMDeliveryRouteImport.update({
|
||||
id: '/m/delivery',
|
||||
path: '/m/delivery',
|
||||
getParentRoute: () => mobileStuffMobileLayoutRouteRoute,
|
||||
} as any)
|
||||
const mobileStuffMobileLayoutMCyclecountsRoute =
|
||||
mobileStuffMobileLayoutMCyclecountsRouteImport.update({
|
||||
id: '/m/cyclecounts',
|
||||
path: '/m/cyclecounts',
|
||||
getParentRoute: () => mobileStuffMobileLayoutRouteRoute,
|
||||
} as any)
|
||||
|
||||
export interface FileRoutesByFullPath {
|
||||
'/': typeof IndexRoute
|
||||
'/': typeof mobileStuffMobileLayoutRouteRouteWithChildren
|
||||
'/login': typeof authLoginRoute
|
||||
'/admin': typeof AdminLayoutAdminUsersRouteRouteWithChildren
|
||||
'/user/resetpassword': typeof authUserResetpasswordRoute
|
||||
'/user/signup': typeof authUserSignupRoute
|
||||
'/logistics/deliverySchedule': typeof logisticsLogisticsDeliveryScheduleRoute
|
||||
'/admin/servers': typeof AdminLayoutAdminServersRoute
|
||||
'/admin/settings': typeof AdminLayoutAdminSettingsRoute
|
||||
'/m/cyclecounts': typeof mobileStuffMobileLayoutMCyclecountsRoute
|
||||
'/m/delivery': typeof mobileStuffMobileLayoutMDeliveryRoute
|
||||
'/m/relocate': typeof mobileStuffMobileLayoutMRelocateRoute
|
||||
'/admin/prodUsers': typeof AdminLayoutAdminUsersProdUsersRoute
|
||||
'/admin/users': typeof AdminLayoutAdminUsersUsersRoute
|
||||
'/m': typeof mobileStuffMobileLayoutMIndexRoute
|
||||
}
|
||||
export interface FileRoutesByTo {
|
||||
'/': typeof IndexRoute
|
||||
'/': typeof mobileStuffMobileLayoutRouteRouteWithChildren
|
||||
'/login': typeof authLoginRoute
|
||||
'/admin': typeof AdminLayoutAdminUsersRouteRouteWithChildren
|
||||
'/user/resetpassword': typeof authUserResetpasswordRoute
|
||||
'/user/signup': typeof authUserSignupRoute
|
||||
'/logistics/deliverySchedule': typeof logisticsLogisticsDeliveryScheduleRoute
|
||||
'/admin/servers': typeof AdminLayoutAdminServersRoute
|
||||
'/admin/settings': typeof AdminLayoutAdminSettingsRoute
|
||||
'/m/cyclecounts': typeof mobileStuffMobileLayoutMCyclecountsRoute
|
||||
'/m/delivery': typeof mobileStuffMobileLayoutMDeliveryRoute
|
||||
'/m/relocate': typeof mobileStuffMobileLayoutMRelocateRoute
|
||||
'/admin/prodUsers': typeof AdminLayoutAdminUsersProdUsersRoute
|
||||
'/admin/users': typeof AdminLayoutAdminUsersUsersRoute
|
||||
'/m': typeof mobileStuffMobileLayoutMIndexRoute
|
||||
}
|
||||
export interface FileRoutesById {
|
||||
__root__: typeof rootRouteImport
|
||||
'/': typeof IndexRoute
|
||||
'/_adminLayout': typeof AdminLayoutRouteRouteWithChildren
|
||||
'/(mobileStuff)': typeof mobileStuffRouteWithChildren
|
||||
'/(mobileStuff)/_mobileLayout': typeof mobileStuffMobileLayoutRouteRouteWithChildren
|
||||
'/(auth)/login': typeof authLoginRoute
|
||||
'/_adminLayout/admin': typeof AdminLayoutAdminRouteWithChildren
|
||||
'/_adminLayout/admin/_users': typeof AdminLayoutAdminUsersRouteRouteWithChildren
|
||||
'/(auth)/user/resetpassword': typeof authUserResetpasswordRoute
|
||||
'/(auth)/user/signup': typeof authUserSignupRoute
|
||||
'/(logistics)/logistics/deliverySchedule': typeof logisticsLogisticsDeliveryScheduleRoute
|
||||
'/_adminLayout/admin/servers': typeof AdminLayoutAdminServersRoute
|
||||
'/_adminLayout/admin/settings': typeof AdminLayoutAdminSettingsRoute
|
||||
'/(mobileStuff)/_mobileLayout/m/cyclecounts': typeof mobileStuffMobileLayoutMCyclecountsRoute
|
||||
'/(mobileStuff)/_mobileLayout/m/delivery': typeof mobileStuffMobileLayoutMDeliveryRoute
|
||||
'/(mobileStuff)/_mobileLayout/m/relocate': typeof mobileStuffMobileLayoutMRelocateRoute
|
||||
'/_adminLayout/admin/_users/prodUsers': typeof AdminLayoutAdminUsersProdUsersRoute
|
||||
'/_adminLayout/admin/_users/users': typeof AdminLayoutAdminUsersUsersRoute
|
||||
'/(mobileStuff)/_mobileLayout/m/': typeof mobileStuffMobileLayoutMIndexRoute
|
||||
}
|
||||
export interface FileRouteTypes {
|
||||
fileRoutesByFullPath: FileRoutesByFullPath
|
||||
@@ -126,10 +189,15 @@ export interface FileRouteTypes {
|
||||
| '/admin'
|
||||
| '/user/resetpassword'
|
||||
| '/user/signup'
|
||||
| '/logistics/deliverySchedule'
|
||||
| '/admin/servers'
|
||||
| '/admin/settings'
|
||||
| '/m/cyclecounts'
|
||||
| '/m/delivery'
|
||||
| '/m/relocate'
|
||||
| '/admin/prodUsers'
|
||||
| '/admin/users'
|
||||
| '/m'
|
||||
fileRoutesByTo: FileRoutesByTo
|
||||
to:
|
||||
| '/'
|
||||
@@ -137,35 +205,56 @@ export interface FileRouteTypes {
|
||||
| '/admin'
|
||||
| '/user/resetpassword'
|
||||
| '/user/signup'
|
||||
| '/logistics/deliverySchedule'
|
||||
| '/admin/servers'
|
||||
| '/admin/settings'
|
||||
| '/m/cyclecounts'
|
||||
| '/m/delivery'
|
||||
| '/m/relocate'
|
||||
| '/admin/prodUsers'
|
||||
| '/admin/users'
|
||||
| '/m'
|
||||
id:
|
||||
| '__root__'
|
||||
| '/'
|
||||
| '/_adminLayout'
|
||||
| '/(mobileStuff)'
|
||||
| '/(mobileStuff)/_mobileLayout'
|
||||
| '/(auth)/login'
|
||||
| '/_adminLayout/admin'
|
||||
| '/_adminLayout/admin/_users'
|
||||
| '/(auth)/user/resetpassword'
|
||||
| '/(auth)/user/signup'
|
||||
| '/(logistics)/logistics/deliverySchedule'
|
||||
| '/_adminLayout/admin/servers'
|
||||
| '/_adminLayout/admin/settings'
|
||||
| '/(mobileStuff)/_mobileLayout/m/cyclecounts'
|
||||
| '/(mobileStuff)/_mobileLayout/m/delivery'
|
||||
| '/(mobileStuff)/_mobileLayout/m/relocate'
|
||||
| '/_adminLayout/admin/_users/prodUsers'
|
||||
| '/_adminLayout/admin/_users/users'
|
||||
| '/(mobileStuff)/_mobileLayout/m/'
|
||||
fileRoutesById: FileRoutesById
|
||||
}
|
||||
export interface RootRouteChildren {
|
||||
IndexRoute: typeof IndexRoute
|
||||
AdminLayoutRouteRoute: typeof AdminLayoutRouteRouteWithChildren
|
||||
mobileStuffRoute: typeof mobileStuffRouteWithChildren
|
||||
authLoginRoute: typeof authLoginRoute
|
||||
authUserResetpasswordRoute: typeof authUserResetpasswordRoute
|
||||
authUserSignupRoute: typeof authUserSignupRoute
|
||||
logisticsLogisticsDeliveryScheduleRoute: typeof logisticsLogisticsDeliveryScheduleRoute
|
||||
}
|
||||
|
||||
declare module '@tanstack/react-router' {
|
||||
interface FileRoutesByPath {
|
||||
'/(mobileStuff)': {
|
||||
id: '/(mobileStuff)'
|
||||
path: '/'
|
||||
fullPath: '/'
|
||||
preLoaderRoute: typeof mobileStuffRouteImport
|
||||
parentRoute: typeof rootRouteImport
|
||||
}
|
||||
'/_adminLayout': {
|
||||
id: '/_adminLayout'
|
||||
path: ''
|
||||
@@ -194,6 +283,13 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof authLoginRouteImport
|
||||
parentRoute: typeof rootRouteImport
|
||||
}
|
||||
'/(mobileStuff)/_mobileLayout': {
|
||||
id: '/(mobileStuff)/_mobileLayout'
|
||||
path: '/'
|
||||
fullPath: '/'
|
||||
preLoaderRoute: typeof mobileStuffMobileLayoutRouteRouteImport
|
||||
parentRoute: typeof mobileStuffRoute
|
||||
}
|
||||
'/_adminLayout/admin/settings': {
|
||||
id: '/_adminLayout/admin/settings'
|
||||
path: '/settings'
|
||||
@@ -208,6 +304,13 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof AdminLayoutAdminServersRouteImport
|
||||
parentRoute: typeof AdminLayoutAdminRoute
|
||||
}
|
||||
'/(logistics)/logistics/deliverySchedule': {
|
||||
id: '/(logistics)/logistics/deliverySchedule'
|
||||
path: '/logistics/deliverySchedule'
|
||||
fullPath: '/logistics/deliverySchedule'
|
||||
preLoaderRoute: typeof logisticsLogisticsDeliveryScheduleRouteImport
|
||||
parentRoute: typeof rootRouteImport
|
||||
}
|
||||
'/(auth)/user/signup': {
|
||||
id: '/(auth)/user/signup'
|
||||
path: '/user/signup'
|
||||
@@ -229,6 +332,13 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof AdminLayoutAdminUsersRouteRouteImport
|
||||
parentRoute: typeof AdminLayoutAdminRoute
|
||||
}
|
||||
'/(mobileStuff)/_mobileLayout/m/': {
|
||||
id: '/(mobileStuff)/_mobileLayout/m/'
|
||||
path: '/m'
|
||||
fullPath: '/m'
|
||||
preLoaderRoute: typeof mobileStuffMobileLayoutMIndexRouteImport
|
||||
parentRoute: typeof mobileStuffMobileLayoutRouteRoute
|
||||
}
|
||||
'/_adminLayout/admin/_users/users': {
|
||||
id: '/_adminLayout/admin/_users/users'
|
||||
path: '/users'
|
||||
@@ -243,6 +353,27 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof AdminLayoutAdminUsersProdUsersRouteImport
|
||||
parentRoute: typeof AdminLayoutAdminUsersRouteRoute
|
||||
}
|
||||
'/(mobileStuff)/_mobileLayout/m/relocate': {
|
||||
id: '/(mobileStuff)/_mobileLayout/m/relocate'
|
||||
path: '/m/relocate'
|
||||
fullPath: '/m/relocate'
|
||||
preLoaderRoute: typeof mobileStuffMobileLayoutMRelocateRouteImport
|
||||
parentRoute: typeof mobileStuffMobileLayoutRouteRoute
|
||||
}
|
||||
'/(mobileStuff)/_mobileLayout/m/delivery': {
|
||||
id: '/(mobileStuff)/_mobileLayout/m/delivery'
|
||||
path: '/m/delivery'
|
||||
fullPath: '/m/delivery'
|
||||
preLoaderRoute: typeof mobileStuffMobileLayoutMDeliveryRouteImport
|
||||
parentRoute: typeof mobileStuffMobileLayoutRouteRoute
|
||||
}
|
||||
'/(mobileStuff)/_mobileLayout/m/cyclecounts': {
|
||||
id: '/(mobileStuff)/_mobileLayout/m/cyclecounts'
|
||||
path: '/m/cyclecounts'
|
||||
fullPath: '/m/cyclecounts'
|
||||
preLoaderRoute: typeof mobileStuffMobileLayoutMCyclecountsRouteImport
|
||||
parentRoute: typeof mobileStuffMobileLayoutRouteRoute
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -288,12 +419,51 @@ const AdminLayoutRouteRouteChildren: AdminLayoutRouteRouteChildren = {
|
||||
const AdminLayoutRouteRouteWithChildren =
|
||||
AdminLayoutRouteRoute._addFileChildren(AdminLayoutRouteRouteChildren)
|
||||
|
||||
interface mobileStuffMobileLayoutRouteRouteChildren {
|
||||
mobileStuffMobileLayoutMCyclecountsRoute: typeof mobileStuffMobileLayoutMCyclecountsRoute
|
||||
mobileStuffMobileLayoutMDeliveryRoute: typeof mobileStuffMobileLayoutMDeliveryRoute
|
||||
mobileStuffMobileLayoutMRelocateRoute: typeof mobileStuffMobileLayoutMRelocateRoute
|
||||
mobileStuffMobileLayoutMIndexRoute: typeof mobileStuffMobileLayoutMIndexRoute
|
||||
}
|
||||
|
||||
const mobileStuffMobileLayoutRouteRouteChildren: mobileStuffMobileLayoutRouteRouteChildren =
|
||||
{
|
||||
mobileStuffMobileLayoutMCyclecountsRoute:
|
||||
mobileStuffMobileLayoutMCyclecountsRoute,
|
||||
mobileStuffMobileLayoutMDeliveryRoute:
|
||||
mobileStuffMobileLayoutMDeliveryRoute,
|
||||
mobileStuffMobileLayoutMRelocateRoute:
|
||||
mobileStuffMobileLayoutMRelocateRoute,
|
||||
mobileStuffMobileLayoutMIndexRoute: mobileStuffMobileLayoutMIndexRoute,
|
||||
}
|
||||
|
||||
const mobileStuffMobileLayoutRouteRouteWithChildren =
|
||||
mobileStuffMobileLayoutRouteRoute._addFileChildren(
|
||||
mobileStuffMobileLayoutRouteRouteChildren,
|
||||
)
|
||||
|
||||
interface mobileStuffRouteChildren {
|
||||
mobileStuffMobileLayoutRouteRoute: typeof mobileStuffMobileLayoutRouteRouteWithChildren
|
||||
}
|
||||
|
||||
const mobileStuffRouteChildren: mobileStuffRouteChildren = {
|
||||
mobileStuffMobileLayoutRouteRoute:
|
||||
mobileStuffMobileLayoutRouteRouteWithChildren,
|
||||
}
|
||||
|
||||
const mobileStuffRouteWithChildren = mobileStuffRoute._addFileChildren(
|
||||
mobileStuffRouteChildren,
|
||||
)
|
||||
|
||||
const rootRouteChildren: RootRouteChildren = {
|
||||
IndexRoute: IndexRoute,
|
||||
AdminLayoutRouteRoute: AdminLayoutRouteRouteWithChildren,
|
||||
mobileStuffRoute: mobileStuffRouteWithChildren,
|
||||
authLoginRoute: authLoginRoute,
|
||||
authUserResetpasswordRoute: authUserResetpasswordRoute,
|
||||
authUserSignupRoute: authUserSignupRoute,
|
||||
logisticsLogisticsDeliveryScheduleRoute:
|
||||
logisticsLogisticsDeliveryScheduleRoute,
|
||||
}
|
||||
export const routeTree = rootRouteImport
|
||||
._addFileChildren(rootRouteChildren)
|
||||
|
||||
24
frontend/src/routes/(logistics)/-components/DragCell.tsx
Normal file
24
frontend/src/routes/(logistics)/-components/DragCell.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
// src/routes/traffic/DropCell.tsx
|
||||
import { useDroppable } from "@dnd-kit/core";
|
||||
|
||||
export function DropCell({ day, hour, children }: any) {
|
||||
const { setNodeRef, isOver } = useDroppable({
|
||||
id: `${day.toDateString()}-${hour}`,
|
||||
data: { day, hour },
|
||||
});
|
||||
|
||||
return (
|
||||
<div
|
||||
ref={setNodeRef}
|
||||
className={`relative border h-20 p-1 ${
|
||||
isOver ? "bg-blue-400" : ""
|
||||
} overflow-visible`}
|
||||
style={{
|
||||
maxWidth: 340, // your allotted width
|
||||
alignContent: "flex-start",
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
69
frontend/src/routes/(logistics)/-components/Grid.tsx
Normal file
69
frontend/src/routes/(logistics)/-components/Grid.tsx
Normal file
@@ -0,0 +1,69 @@
|
||||
// src/routes/traffic/Grid.tsx
|
||||
import { format } from "date-fns";
|
||||
import React from "react";
|
||||
import { ScrollArea, ScrollBar } from "../../../components/ui/scroll-area";
|
||||
|
||||
export const days = Array.from(
|
||||
{ length: 5 },
|
||||
(_, i) => new Date(Date.now() + i * 24 * 60 * 60 * 1000),
|
||||
);
|
||||
|
||||
// the layout of the hours
|
||||
const hoursBefore = 3;
|
||||
const totalHours = 24;
|
||||
|
||||
// get the current hour
|
||||
const currentHour = new Date().getHours();
|
||||
const startHour = (currentHour - hoursBefore + 24) % 24;
|
||||
|
||||
// generate the hours array
|
||||
const hours = Array.from(
|
||||
{ length: totalHours },
|
||||
(_, i) => (startHour + i) % 24,
|
||||
);
|
||||
|
||||
export function Grid({
|
||||
days,
|
||||
children,
|
||||
}: {
|
||||
days: any;
|
||||
children?: (day: Date, hour: number) => React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<ScrollArea className={`h-[80vh]`}>
|
||||
<div
|
||||
className="grid"
|
||||
style={{
|
||||
display: "grid",
|
||||
gridTemplateColumns: `100px repeat(${days.length}, 350px)`, // each day = 180 px wide
|
||||
//minWidth: `${100 + days.length * 350}px`,
|
||||
}}
|
||||
>
|
||||
{/* Empty top-left corner */}
|
||||
<div className="sticky top-0 left-0 bg-background z-30"></div>
|
||||
|
||||
{/* Date headers */}
|
||||
{days.map((d: any) => (
|
||||
<div
|
||||
key={d.toDateString()}
|
||||
className="sticky top-0 bg-background z-20 p-2 font-semibold text-center"
|
||||
>
|
||||
{format(d, "EEEE M/d/yyyy")}
|
||||
</div>
|
||||
))}
|
||||
|
||||
{hours.map((hour) => (
|
||||
<React.Fragment key={hour}>
|
||||
<div className="border p-1 text-right text-sm">{hour}:00</div>
|
||||
{days.map((d: any) => (
|
||||
<div key={`${d}-${hour}`} className="relative border h-20">
|
||||
{children && children(d, hour)}
|
||||
</div>
|
||||
))}
|
||||
</React.Fragment>
|
||||
))}
|
||||
</div>
|
||||
<ScrollBar orientation="horizontal" />
|
||||
</ScrollArea>
|
||||
);
|
||||
}
|
||||
34
frontend/src/routes/(logistics)/-components/GridBody.tsx
Normal file
34
frontend/src/routes/(logistics)/-components/GridBody.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
import React from "react";
|
||||
|
||||
// GridBody.tsx
|
||||
export function GridBody({ days, children }: { days: Date[]; children: any }) {
|
||||
const hours = Array.from({ length: 24 }, (_, i) => i);
|
||||
|
||||
return (
|
||||
<div
|
||||
className="grid overflow-x-auto"
|
||||
style={{
|
||||
display: "grid",
|
||||
gridTemplateColumns: `100px repeat(${days.length},340px)`,
|
||||
}}
|
||||
>
|
||||
{hours.map((hour) => (
|
||||
<React.Fragment key={hour}>
|
||||
{/* time label, sticky left */}
|
||||
<div className="sticky left-0 bg-background border p-1 text-right text-sm z-10">
|
||||
{hour}:00
|
||||
</div>
|
||||
|
||||
{days.map((day) => (
|
||||
<div
|
||||
key={`${day}-${hour}`}
|
||||
className="border h-20 relative"
|
||||
>
|
||||
{children && children(day, hour)}
|
||||
</div>
|
||||
))}
|
||||
</React.Fragment>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
24
frontend/src/routes/(logistics)/-components/GridHeader.tsx
Normal file
24
frontend/src/routes/(logistics)/-components/GridHeader.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
// GridHeader.tsx
|
||||
import { format } from "date-fns";
|
||||
|
||||
export function GridHeader({ days }: { days: Date[] }) {
|
||||
return (
|
||||
<div
|
||||
className="grid sticky top-0 z-30 bg-background"
|
||||
style={{
|
||||
display: "grid",
|
||||
gridTemplateColumns: `100px repeat(${days.length},340px)`,
|
||||
}}
|
||||
>
|
||||
<div /> {/* Empty corner for time labels */}
|
||||
{days.map((d) => (
|
||||
<div
|
||||
key={d.toDateString()}
|
||||
className="p-2 font-semibold text-center border-b"
|
||||
>
|
||||
{format(d, "EEE M/d/yyyy")}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
44
frontend/src/routes/(logistics)/-components/Shipments.tsx
Normal file
44
frontend/src/routes/(logistics)/-components/Shipments.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
// ShipmentItem.tsx
|
||||
import { useDraggable } from "@dnd-kit/core";
|
||||
|
||||
interface ShipmentItemProps {
|
||||
shipment: any;
|
||||
index?: number;
|
||||
perm?: boolean;
|
||||
}
|
||||
|
||||
export function ShipmentItem({
|
||||
shipment,
|
||||
index = 0,
|
||||
perm = true,
|
||||
}: ShipmentItemProps) {
|
||||
const { setNodeRef, listeners, attributes, transform } = useDraggable({
|
||||
id: shipment.orderNumber,
|
||||
data: shipment,
|
||||
});
|
||||
|
||||
const offsetX = index * 10;
|
||||
|
||||
const style: React.CSSProperties = {
|
||||
transform: transform
|
||||
? `translate(${transform.x}px, ${transform.y}px)`
|
||||
: `translateX(${offsetX}px)`,
|
||||
transition: transform ? "none" : "transform 0.2s ease",
|
||||
zIndex: 10 + index,
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
left: 0,
|
||||
cursor: "grab",
|
||||
};
|
||||
return (
|
||||
<div
|
||||
ref={setNodeRef}
|
||||
{...listeners}
|
||||
{...attributes}
|
||||
style={style}
|
||||
className="w-[160px] p-2 text-xs rounded shadow select-none "
|
||||
>
|
||||
{shipment.orderNumber}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
125
frontend/src/routes/(logistics)/-components/style.css
Normal file
125
frontend/src/routes/(logistics)/-components/style.css
Normal file
@@ -0,0 +1,125 @@
|
||||
.react-calendar-timeline * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.react-calendar-timeline .rct-outer {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.react-calendar-timeline .rct-scroll {
|
||||
display: inline-block;
|
||||
white-space: normal;
|
||||
vertical-align: top;
|
||||
overflow-x: scroll;
|
||||
overflow-y: hidden;
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
}
|
||||
.react-calendar-timeline .rct-item:hover {
|
||||
z-index: 88;
|
||||
}
|
||||
|
||||
.react-calendar-timeline .rct-item .rct-item-content {
|
||||
position: sticky;
|
||||
position: -webkit-sticky; /* still fine — helps with drag display */
|
||||
left: 0;
|
||||
|
||||
/* Let multiple lines render */
|
||||
display: block;
|
||||
white-space: normal; /* ⬅ allow wrapping */
|
||||
overflow: visible; /* ⬅ don't clip longer content */
|
||||
height: auto; /* ⬅ expand with content */
|
||||
padding: 4px 6px; /* ⬅ spacing inside item */
|
||||
line-height: 1.3; /* ⬅ readable multi-line spacing */
|
||||
border-radius: 2px;
|
||||
box-sizing: border-box; /* consistent height/padding */
|
||||
}
|
||||
|
||||
.react-calendar-timeline .rct-sidebar {
|
||||
overflow: hidden;
|
||||
white-space: normal;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
border-right: 1px solid #bbb;
|
||||
}
|
||||
.react-calendar-timeline .rct-sidebar.rct-sidebar-right {
|
||||
border-right: 0;
|
||||
border-left: 1px solid #bbb;
|
||||
}
|
||||
.react-calendar-timeline .rct-sidebar .rct-sidebar-row {
|
||||
padding: 0 4px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
border-bottom: 1px solid #bbb;
|
||||
}
|
||||
.react-calendar-timeline .rct-sidebar .rct-sidebar-row.rct-sidebar-row-odd {
|
||||
background: #0000000d;
|
||||
}
|
||||
.react-calendar-timeline .rct-sidebar .rct-sidebar-row.rct-sidebar-row-even {
|
||||
background: transparent;
|
||||
}
|
||||
.react-calendar-timeline .rct-vertical-lines .rct-vl {
|
||||
position: absolute;
|
||||
border-left: 1px solid #bbb;
|
||||
z-index: 30;
|
||||
}
|
||||
.react-calendar-timeline .rct-vertical-lines .rct-vl.rct-vl-first {
|
||||
border-left-width: 2px;
|
||||
}
|
||||
.react-calendar-timeline .rct-vertical-lines .rct-vl.rct-day-6,
|
||||
.react-calendar-timeline .rct-vertical-lines .rct-vl.rct-day-0 {
|
||||
background: #faf6e180;
|
||||
}
|
||||
.react-calendar-timeline .rct-horizontal-lines {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: -moz-none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.react-calendar-timeline .rct-horizontal-lines .rct-hl-even,
|
||||
.react-calendar-timeline .rct-horizontal-lines .rct-hl-odd {
|
||||
border-bottom: 1px solid #bbb;
|
||||
box-sizing: border-box;
|
||||
z-index: 40;
|
||||
}
|
||||
.react-calendar-timeline .rct-horizontal-lines .rct-hl-odd {
|
||||
background: #0000000d;
|
||||
}
|
||||
.react-calendar-timeline .rct-horizontal-lines .rct-hl-even {
|
||||
background: transparent;
|
||||
}
|
||||
.react-calendar-timeline .rct-cursor-line {
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
background: #2196f3;
|
||||
z-index: 51;
|
||||
}
|
||||
.react-calendar-timeline .rct-dateHeader {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
border-bottom: 1px solid #bbb;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
background-color: #f0f0f0;
|
||||
border-left: 2px solid #bbb;
|
||||
}
|
||||
.react-calendar-timeline .rct-dateHeader-primary {
|
||||
background-color: initial;
|
||||
border-left: 1px solid #bbb;
|
||||
border-right: 1px solid #bbb;
|
||||
color: #fff;
|
||||
}
|
||||
.react-calendar-timeline .rct-header-root {
|
||||
background: #c52020;
|
||||
border-bottom: 1px solid #bbb;
|
||||
}
|
||||
.react-calendar-timeline .rct-calendar-header {
|
||||
border: 1px solid #bbb;
|
||||
}
|
||||
35
frontend/src/routes/(logistics)/-hooks/useDateWindow.tsx
Normal file
35
frontend/src/routes/(logistics)/-hooks/useDateWindow.tsx
Normal file
@@ -0,0 +1,35 @@
|
||||
import { useMemo, useState } from "react";
|
||||
|
||||
export function useDateWindow(initialStart = new Date()) {
|
||||
const [startDate, setStartDate] = useState(initialStart);
|
||||
const [endDayCount, setEndDayCount] = useState<string>(
|
||||
localStorage.getItem("endDayCount") || "5",
|
||||
);
|
||||
const [startDayCount, startEndDayCount] = useState<string>(
|
||||
localStorage.getItem("startDayCount") || "0",
|
||||
);
|
||||
|
||||
const days = useMemo(() => {
|
||||
const startOffset = parseInt(startDayCount, 10);
|
||||
const endOffset = parseInt(endDayCount, 10);
|
||||
|
||||
const start = new Date(startDate);
|
||||
start.setDate(start.getDate() - startOffset);
|
||||
|
||||
return Array.from({ length: endOffset + startOffset + 1 }, (_, i) => {
|
||||
const d = new Date(start);
|
||||
d.setDate(start.getDate() + i);
|
||||
return d;
|
||||
});
|
||||
}, [startDate, startDayCount, endDayCount]);
|
||||
|
||||
return {
|
||||
days,
|
||||
startDate,
|
||||
setStartDate,
|
||||
endDayCount,
|
||||
setEndDayCount,
|
||||
startDayCount,
|
||||
startEndDayCount,
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
import { createFileRoute } from "@tanstack/react-router";
|
||||
import { useEffect, useState } from "react";
|
||||
import { coreSocket } from "../../../lib/socket.io/socket";
|
||||
import "../-components/style.css";
|
||||
import moment from "moment";
|
||||
import Timeline from "react-calendar-timeline";
|
||||
|
||||
export const Route = createFileRoute("/(logistics)/logistics/deliverySchedule")(
|
||||
{
|
||||
beforeLoad: async () => {
|
||||
coreSocket.emit("joinScheduler", "scheduler");
|
||||
// coreSocket.on("scheduler", (p) => {
|
||||
// console.log(`[scheduler] received:`, p);
|
||||
// });
|
||||
},
|
||||
component: RouteComponent,
|
||||
},
|
||||
);
|
||||
|
||||
function RouteComponent() {
|
||||
// connect to the channel
|
||||
const [shipments, setShipments] = useState([]) as any;
|
||||
//const [perm] = useState(true); // will check this for sure with a user permissions
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
|
||||
// useEffect(() => {
|
||||
// const handleConnect = () => {
|
||||
// console.log("✅ Socket connected, joining scheduler");
|
||||
// coreSocket.emit("joinScheduler");
|
||||
// };
|
||||
|
||||
// coreSocket.on("connect", handleConnect);
|
||||
|
||||
// //const handler = (msg: any) => console.log("💓", msg);
|
||||
// const onUpdate = (msg: any) => {
|
||||
// console.log(msg.data);
|
||||
// setShipments(() => {
|
||||
// return msg.data.map((i: any) => ({
|
||||
// id: i.schedule_id,
|
||||
// title: i.orderNumber,
|
||||
// group: i.dock === "" ? 1 : 1, // this will just toss everything here for now will go to the actual dock id later
|
||||
// start_time: moment(parseISO(i.lstDateCheck)),
|
||||
// end_time: moment(addHours(parseISO(i.lstDateCheck), 1)),
|
||||
// data: i,
|
||||
// }));
|
||||
// });
|
||||
// if (!loaded) setLoaded(true);
|
||||
// };
|
||||
|
||||
// //coreSocket.on("data", onData);
|
||||
// coreSocket.on("scheduler:update", onUpdate);
|
||||
|
||||
// return () => {
|
||||
// // cleanup on unmount
|
||||
// //coreSocket.off("data", onData);
|
||||
// coreSocket.off("scheduler:update", onUpdate);
|
||||
// coreSocket.off("connect", handleConnect);
|
||||
// };
|
||||
// }, []);
|
||||
|
||||
// if (shipments.length === 0) {
|
||||
// return <div>Loading.....</div>;
|
||||
// }
|
||||
|
||||
return <div className="p-4 "></div>;
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
|
||||
export const Route = createFileRoute(
|
||||
'/(mobileStuff)/_mobileLayout/m/cyclecounts',
|
||||
)({
|
||||
component: RouteComponent,
|
||||
})
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/(mobileStuff)/_mobileLayout/m/cyclecounts"!</div>
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
|
||||
export const Route = createFileRoute('/(mobileStuff)/_mobileLayout/m/delivery')(
|
||||
{
|
||||
component: RouteComponent,
|
||||
},
|
||||
)
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/(mobileStuff)/_mobileLayout/m/delivery"!</div>
|
||||
}
|
||||
78
frontend/src/routes/(mobileStuff)/_mobileLayout/m/index.tsx
Normal file
78
frontend/src/routes/(mobileStuff)/_mobileLayout/m/index.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
import { createFileRoute, Link } from "@tanstack/react-router";
|
||||
import { LstCard } from "../../../../components/ui/lstCard";
|
||||
import {
|
||||
CardContent,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
} from "../../../../components/ui/card";
|
||||
import { Button } from "../../../../components/ui/button";
|
||||
import { cn } from "../../../../lib/utils";
|
||||
|
||||
export const Route = createFileRoute("/(mobileStuff)/_mobileLayout/m/")({
|
||||
component: RouteComponent,
|
||||
});
|
||||
|
||||
const commands = [
|
||||
{
|
||||
title: "Relocate",
|
||||
description: "Moves a pallet from one location to another",
|
||||
link: "/lst/app/m/relocate",
|
||||
},
|
||||
{
|
||||
title: "Cycle Counts",
|
||||
description: "Will do a cycle count on a specific lane",
|
||||
link: "/lst/app/m/cyclecounts",
|
||||
},
|
||||
{
|
||||
title: "Delivery",
|
||||
description:
|
||||
"Scan pallets to a delivery that has already been drag down in stock",
|
||||
link: "/lst/app/m/delivery",
|
||||
},
|
||||
];
|
||||
|
||||
function RouteComponent() {
|
||||
return (
|
||||
<div className="p-3 space-y-3">
|
||||
<LstCard>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex justify-center">
|
||||
Commands
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="flex flex-wrap justify-center gap-3">
|
||||
{commands.map((cmd) => {
|
||||
return (
|
||||
<Link
|
||||
key={cmd.title}
|
||||
to={cmd.link}
|
||||
className="block"
|
||||
>
|
||||
<Button
|
||||
variant="outline"
|
||||
className={cn(
|
||||
"flex flex-col justify-center items-center",
|
||||
"w-36 h-28 p-3 text-center", // fixed width/height for uniform grid
|
||||
"border-muted bg-background hover:bg-accent/40",
|
||||
"transition-all active:scale-95"
|
||||
)}
|
||||
>
|
||||
<span className="text-base font-semibold leading-tight">
|
||||
{cmd.title}
|
||||
</span>
|
||||
{/* <div className="max-w-[75px]">
|
||||
<span className="text-xs text-wrap">
|
||||
{cmd.description}
|
||||
</span>
|
||||
</div> */}
|
||||
</Button>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</CardContent>
|
||||
</LstCard>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
|
||||
export const Route = createFileRoute('/(mobileStuff)/_mobileLayout/m/relocate')(
|
||||
{
|
||||
component: RouteComponent,
|
||||
},
|
||||
)
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/(mobileStuff)/_mobileLayout/m/relocate"!</div>
|
||||
}
|
||||
13
frontend/src/routes/(mobileStuff)/_mobileLayout/route.tsx
Normal file
13
frontend/src/routes/(mobileStuff)/_mobileLayout/route.tsx
Normal file
@@ -0,0 +1,13 @@
|
||||
import { createFileRoute, Outlet } from "@tanstack/react-router";
|
||||
|
||||
export const Route = createFileRoute("/(mobileStuff)/_mobileLayout")({
|
||||
component: RouteComponent,
|
||||
});
|
||||
|
||||
function RouteComponent() {
|
||||
return (
|
||||
<div>
|
||||
<Outlet />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,4 +1,8 @@
|
||||
import { createRootRouteWithContext, Outlet } from "@tanstack/react-router";
|
||||
import {
|
||||
createRootRouteWithContext,
|
||||
Outlet,
|
||||
useRouter,
|
||||
} from "@tanstack/react-router";
|
||||
|
||||
import type { QueryClient } from "@tanstack/react-query";
|
||||
import { Toaster } from "sonner";
|
||||
@@ -10,6 +14,9 @@ import { SidebarProvider } from "../components/ui/sidebar";
|
||||
import SideBarNav from "../components/navBar/SideBarNav";
|
||||
import { TanStackRouterDevtools } from "@tanstack/react-router-devtools";
|
||||
import { userAccess } from "../lib/authClient";
|
||||
import mobile from "is-mobile";
|
||||
import { useEffect } from "react";
|
||||
import { coreSocket } from "../lib/socket.io/socket";
|
||||
|
||||
interface RootRouteContext {
|
||||
queryClient: QueryClient;
|
||||
@@ -21,6 +28,29 @@ interface RootRouteContext {
|
||||
const RootLayout = () => {
|
||||
//const { logout, login } = Route.useRouteContext();
|
||||
const defaultOpen = Cookies.get("sidebar_state") === "true";
|
||||
const router = useRouter();
|
||||
// console.log(mobile({ featureDetect: true, tablet: true }));
|
||||
|
||||
// if mobile lets move to the mobile section.
|
||||
useEffect(() => {
|
||||
if (mobile({ featureDetect: true, tablet: true })) {
|
||||
router.navigate({ to: "/m" });
|
||||
}
|
||||
|
||||
coreSocket.on("connect", () => {
|
||||
console.log("✅ Connected:", coreSocket.id);
|
||||
});
|
||||
|
||||
coreSocket.on("disconnect", () => {
|
||||
console.log("🔴 Disconnected");
|
||||
});
|
||||
|
||||
return () => {
|
||||
coreSocket.off("connect");
|
||||
coreSocket.off("disconnect");
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<SessionGuard>
|
||||
|
||||
@@ -5,7 +5,6 @@
|
||||
{ "path": "./tsconfig.node.json" }
|
||||
],
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
|
||||
@@ -36,6 +36,8 @@ export default defineConfig({
|
||||
},
|
||||
server: {
|
||||
port: 5500,
|
||||
host: true,
|
||||
allowedHosts: true,
|
||||
proxy: {
|
||||
"/lst/api": {
|
||||
target: `http://localhost:${Number(
|
||||
|
||||
Reference in New Issue
Block a user