diff --git a/astro/package.json b/astro/package.json index cdf5d92..bf4a0c0 100644 --- a/astro/package.json +++ b/astro/package.json @@ -17,12 +17,14 @@ "@hookform/resolvers": "^3.3.4", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-slot": "^1.0.2", + "@tanstack/react-query": "^5.28.14", "@types/react": "^18.2.74", "@types/react-dom": "^18.2.23", "astro": "^4.5.13", "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "css-select": "5.1.0", + "leaflet": "^1.9.4", "lucide-react": "^0.364.0", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/astro/src/components/KiosMap.tsx b/astro/src/components/KiosMap.tsx new file mode 100644 index 0000000..9a464c1 --- /dev/null +++ b/astro/src/components/KiosMap.tsx @@ -0,0 +1,148 @@ +import React, { useEffect } from 'react'; +import { MapContainer, TileLayer, Marker, Popup, Polyline, LayerGroup, GeoJSON } from 'react-leaflet'; +// import 'leaflet/dist/leaflet.css'; +import { useQuery, useMutation, useQueryClient, queryOptions } from "@tanstack/react-query"; + +type Product = { + id: string; + productTitle: string; + createdAt: string; + updatedAt: string; +}; + +// type Location = { +// latitude: number; +// longitude: number; +// } + +type Maker = { + id: string; + name: string; + location: [number, number]; + products: Product[]; + createdAt: string; + updatedAt: string; +}; + +type Retailer = { + id: string; + name: string; + location: [number, number]; + products: Product[]; + createdAt: string; + updatedAt: string; +}; + + +//Todo: update fetch url endpoints +const getMakers = async () => { + const response = await fetch("https://kios-admin.lumbung.space/api/makers"); + const makers: Maker[] = (await response.json()).docs; + console.log(makers) + return makers; +} + +const useGetMakers = () => { + return useQuery({ + queryFn: () => getMakers(), + queryKey: ['makers'] + }) +} + +const getRetailers = async () => { + const response = await fetch("https://kios-admin.lumbung.space/api/makers"); + const makers: Maker[] = (await response.json()).docs; + return makers; +} + + + + +export const KiosMap: React.FC = () => { + + const { data: makers, isLoading: isLoadingMakers, isError } = useGetMakers(); + + + const retailers = false + // const blackDotIcon = L.divIcon({ + // className: 'black-dot', + // iconSize: [20, 20], + // iconAnchor: [10, 10] + // }); + + return ( + + + + {makers && + + {makers.map((maker: any, index: number) => ( + + {maker.name} + + ))} + + } + + {/* {retailers + + {data.retailers.map((retailer: any, index: number) => ( + + {retailer.name} + + ))} + + } */} + + +{/* + {data.dispatches.map((dispatch: any, index: number) => { + const start = dispatch.startingPoint.location; + const end = dispatch.endPoint.location; + + let productsString = ''; + dispatch.products.forEach((product: any, i: number) => { + productsString += product.productTitle + (i + 1 < dispatch.products.length ? ', ' : ''); + }); + + const myDashArray = + dispatch.status === 'routeRequested' ? '20, 10' : + dispatch.status === 'completed' ? '1, 5' : + '0, 0'; + + return ( +
+ + {dispatch.startingPoint.name} + + + {dispatch.endPoint.name} + + +
+ ); + })} + */} + + ); +}; + diff --git a/astro/src/pages/Map.astro b/astro/src/pages/Map.astro new file mode 100644 index 0000000..8a75ff6 --- /dev/null +++ b/astro/src/pages/Map.astro @@ -0,0 +1,10 @@ +--- +import { AddRetailerForm } from "@/components/AddRetailerForm"; +import BaseLayout from "@/layouts/BaseLayout.astro"; +import { KiosMap } from "@/components/KiosMap" +--- + + + + + diff --git a/astro/src/utils/hooks.ts b/astro/src/utils/hooks.ts new file mode 100644 index 0000000..e69de29 diff --git a/astro/yarn.lock b/astro/yarn.lock index bf8cfbe..1dc9710 100644 --- a/astro/yarn.lock +++ b/astro/yarn.lock @@ -775,6 +775,18 @@ resolved "https://registry.yarnpkg.com/@shikijs/core/-/core-1.2.3.tgz#551c257b6e1575ef0b87635c515dec134b32f611" integrity sha512-SM+aiQVaEK2P53dEcsvhq9+LJPr0rzwezHbMQhHaSrPN4OlOB4vp1qTdhVEKfMg6atdq8s9ZotWW/CSCzWftwg== +"@tanstack/query-core@5.28.13": + version "5.28.13" + resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.28.13.tgz#15c187c23b87a393e91d0fd2ea6dfc22b8a85b75" + integrity sha512-C3+CCOcza+mrZ7LglQbjeYEOTEC3LV0VN0eYaIN6GvqAZ8Foegdgch7n6QYPtT4FuLae5ALy+m+ZMEKpD6tMCQ== + +"@tanstack/react-query@^5.28.14": + version "5.28.14" + resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-5.28.14.tgz#9585b6300eb8f167ed374e2748043dc8d6476709" + integrity sha512-cZqt03Igb3I9tM72qNX5TAAmeYl75Z+k4Mv92VkXIXc2hCrv0fIywd7GN3JV1BBJl4mr7Cc+OOKKOPy8sNVOkA== + dependencies: + "@tanstack/query-core" "5.28.13" + "@testing-library/dom@^9.0.0": version "9.3.4" resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-9.3.4.tgz#50696ec28376926fec0a1bf87d9dbac5e27f60ce" @@ -2583,6 +2595,11 @@ kleur@^4.1.4, kleur@^4.1.5: resolved "https://registry.yarnpkg.com/kleur/-/kleur-4.1.5.tgz#95106101795f7050c6c650f350c683febddb1780" integrity sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ== +leaflet@^1.9.4: + version "1.9.4" + resolved "https://registry.yarnpkg.com/leaflet/-/leaflet-1.9.4.tgz#23fae724e282fa25745aff82ca4d394748db7d8d" + integrity sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA== + lilconfig@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.1.0.tgz#78e23ac89ebb7e1bfbf25b18043de756548e7f52" diff --git a/node_modules/.yarn-integrity b/node_modules/.yarn-integrity new file mode 100644 index 0000000..ae93109 --- /dev/null +++ b/node_modules/.yarn-integrity @@ -0,0 +1,10 @@ +{ + "systemParams": "linux-x64-108", + "modulesFolders": [], + "flags": [], + "linkedModules": [], + "topLevelPatterns": [], + "lockfileEntries": {}, + "files": [], + "artifacts": {} +} \ No newline at end of file diff --git a/sampleResponses/makers.json b/sampleResponses/makers.json new file mode 100644 index 0000000..c4150ad --- /dev/null +++ b/sampleResponses/makers.json @@ -0,0 +1,88 @@ +{ + "docs": [ + { + "id": "66028ec901275c2f8eb87e76", + "name": "Display Distribute", + "location": [114.19163986185993, 22.31656075733971], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-03-26T09:00:57.371Z", + "updatedAt": "2024-03-26T09:00:57.371Z" + }, + { + "id": "65b0d00dafcaf765bddf45ba", + "name": "Fahad the Artist", + "location": [-6.84, 33.9], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:53:33.106Z", + "updatedAt": "2024-01-24T08:53:33.106Z" + }, + { + "id": "65b0cff2afcaf765bddf45a8", + "name": "Maker 3", + "location": [106, -6.2], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:53:06.945Z", + "updatedAt": "2024-01-24T08:53:06.945Z" + }, + { + "id": "65b0cfd9afcaf765bddf4596", + "name": "Maker Two", + "location": [0.128, 51.5], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:52:41.057Z", + "updatedAt": "2024-01-24T08:52:41.057Z" + }, + { + "id": "65b0cfbbafcaf765bddf4584", + "name": "Maker one", + "location": [67, 24.86], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:52:11.469Z", + "updatedAt": "2024-01-24T08:52:11.469Z" + } + ], + "totalDocs": 5, + "limit": 10, + "totalPages": 1, + "page": 1, + "pagingCounter": 1, + "hasPrevPage": false, + "hasNextPage": false, + "prevPage": null, + "nextPage": null +} diff --git a/sampleResponses/products.json b/sampleResponses/products.json new file mode 100644 index 0000000..f77a326 --- /dev/null +++ b/sampleResponses/products.json @@ -0,0 +1,31 @@ +{ + "docs": [ + { + "id": "660a87b201275c2f8eb88302", + "productTitle": "Tote Bags", + "createdAt": "2024-04-01T10:08:50.417Z", + "updatedAt": "2024-04-01T10:08:50.417Z" + }, + { + "id": "66028ee601275c2f8eb87e93", + "productTitle": "Acts of Departure: Dispatches from The Last Emporium", + "createdAt": "2024-03-26T09:01:26.239Z", + "updatedAt": "2024-03-26T09:01:26.239Z" + }, + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "totalDocs": 3, + "limit": 10, + "totalPages": 1, + "page": 1, + "pagingCounter": 1, + "hasPrevPage": false, + "hasNextPage": false, + "prevPage": null, + "nextPage": null +} diff --git a/sampleResponses/retailers.json b/sampleResponses/retailers.json new file mode 100644 index 0000000..ed583cc --- /dev/null +++ b/sampleResponses/retailers.json @@ -0,0 +1,58 @@ +{ + "docs": [ + { + "id": "65b0cf7eafcaf765bddf4564", + "name": "Retailer 3", + "location": [9.19, 45.5], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:51:10.008Z", + "updatedAt": "2024-01-24T08:51:10.008Z" + }, + { + "id": "65b0cf6bafcaf765bddf4552", + "name": "Retailer two", + "location": [-74, 40.7], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:50:51.876Z", + "updatedAt": "2024-01-24T08:50:51.876Z" + }, + { + "id": "65b0cf25afcaf765bddf4540", + "name": "Retailer one", + "location": [2.45, 48.9], + "products": [ + { + "id": "65b0cefaafcaf765bddf4527", + "productTitle": "Product one", + "createdAt": "2024-01-24T08:48:58.369Z", + "updatedAt": "2024-01-24T08:48:58.369Z" + } + ], + "createdAt": "2024-01-24T08:49:41.635Z", + "updatedAt": "2024-01-24T08:49:41.635Z" + } + ], + "totalDocs": 3, + "limit": 10, + "totalPages": 1, + "page": 1, + "pagingCounter": 1, + "hasPrevPage": false, + "hasNextPage": false, + "prevPage": null, + "nextPage": null +} diff --git a/yarn.lock b/yarn.lock new file mode 100644 index 0000000..fb57ccd --- /dev/null +++ b/yarn.lock @@ -0,0 +1,4 @@ +# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. +# yarn lockfile v1 + +