mirror of
https://github.com/utopia-os/utopia-ui.git
synced 2025-12-13 07:46:10 +00:00
updated to utopia-ui@3.0.0-alpha.138
This commit is contained in:
parent
e4a56218f5
commit
d3417d6d59
@ -7,10 +7,6 @@
|
||||
<meta name="description" content="collaborative and interactive Maps for Utopians">
|
||||
<link rel="icon" type="image/png" href="/3markers-globe.svg" />
|
||||
<title>Utopia Map</title>
|
||||
|
||||
<meta property="og:title" content="Utopia Map" />
|
||||
<meta property="og:description" content="collaborative and interactive Maps for Utopians" />
|
||||
<meta property="og:image" content="/3markers-globe_256.png" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
50
package-lock.json
generated
50
package-lock.json
generated
@ -16,8 +16,8 @@
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-rnd": "^10.4.1",
|
||||
"react-router-dom": "^6.11.2",
|
||||
"utopia-ui": "^3.0.0-alpha.126"
|
||||
"react-router-dom": "^6.23.0",
|
||||
"utopia-ui": "^3.0.0-alpha.138"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.2.79",
|
||||
@ -1950,8 +1950,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@remix-run/router": {
|
||||
"version": "1.9.0",
|
||||
"license": "MIT",
|
||||
"version": "1.16.0",
|
||||
"resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.16.0.tgz",
|
||||
"integrity": "sha512-Quz1KOffeEf/zwkCBM3kBtH4ZoZ+pT3xIXBG4PPW/XFtDP7EGhtTiC2+gpL9GnR7+Qdet5Oa6cYSvwKYg6kN9Q==",
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
}
|
||||
@ -1968,20 +1969,20 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tanstack/query-core": {
|
||||
"version": "5.32.0",
|
||||
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.32.0.tgz",
|
||||
"integrity": "sha512-Z3flEgCat55DRXU5UMwYU1U+DgFZKA3iufyOKs+II7iRAo0uXkeU7PH5e6sOH1CGEag0IpKmZxlUFpCg6roSKw==",
|
||||
"version": "5.32.1",
|
||||
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.32.1.tgz",
|
||||
"integrity": "sha512-mCWa1wdGb1jiny4+qYegbSeadcFj+Nq65KFSs4A1DRveoIq7SrTwUhqu7hrB6d54cQH5x59DfJvxusn3w1Cj/g==",
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/tannerlinsley"
|
||||
}
|
||||
},
|
||||
"node_modules/@tanstack/react-query": {
|
||||
"version": "5.32.0",
|
||||
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.32.0.tgz",
|
||||
"integrity": "sha512-+E3UudQtarnx9A6xhpgMZapyF+aJfNBGFMgI459FnduEZqT/9KhOWnMOneZahLRt52yzskSA0AuOyLkXHK0yBA==",
|
||||
"version": "5.32.1",
|
||||
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.32.1.tgz",
|
||||
"integrity": "sha512-+nXLMB0JK0XwTJ+lQt49DPNLrbSppni9N5W5yMR085yW3YaRKRUFhfVTER3TvQd1UycHpoGPFnt1gHiijXERAg==",
|
||||
"dependencies": {
|
||||
"@tanstack/query-core": "5.32.0"
|
||||
"@tanstack/query-core": "5.32.1"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
@ -3048,9 +3049,10 @@
|
||||
}
|
||||
},
|
||||
"node_modules/ejs": {
|
||||
"version": "3.1.9",
|
||||
"version": "3.1.10",
|
||||
"resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
|
||||
"integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"jake": "^10.8.5"
|
||||
},
|
||||
@ -5970,10 +5972,11 @@
|
||||
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
|
||||
},
|
||||
"node_modules/react-router": {
|
||||
"version": "6.16.0",
|
||||
"license": "MIT",
|
||||
"version": "6.23.0",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.23.0.tgz",
|
||||
"integrity": "sha512-wPMZ8S2TuPadH0sF5irFGjkNLIcRvOSaEe7v+JER8508dyJumm6XZB1u5kztlX0RVq6AzRVndzqcUh6sFIauzA==",
|
||||
"dependencies": {
|
||||
"@remix-run/router": "1.9.0"
|
||||
"@remix-run/router": "1.16.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
@ -5983,11 +5986,12 @@
|
||||
}
|
||||
},
|
||||
"node_modules/react-router-dom": {
|
||||
"version": "6.16.0",
|
||||
"license": "MIT",
|
||||
"version": "6.23.0",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.23.0.tgz",
|
||||
"integrity": "sha512-Q9YaSYvubwgbal2c9DJKfx6hTNoBp3iJDsl+Duva/DwxoJH+OTXkxGpql4iUK2sla/8z4RpjAm6EWx1qUDuopQ==",
|
||||
"dependencies": {
|
||||
"@remix-run/router": "1.9.0",
|
||||
"react-router": "6.16.0"
|
||||
"@remix-run/router": "1.16.0",
|
||||
"react-router": "6.23.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
@ -7241,9 +7245,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/utopia-ui": {
|
||||
"version": "3.0.0-alpha.126",
|
||||
"resolved": "https://registry.npmjs.org/utopia-ui/-/utopia-ui-3.0.0-alpha.126.tgz",
|
||||
"integrity": "sha512-RM4N4NNwLp+5fUwcboD/8Y7V/ocu9X3qEH/F5Isz45M7q3qymeshMn/ytQEvFdPKJq5aWBplvbnCYzfSUELqHw==",
|
||||
"version": "3.0.0-alpha.138",
|
||||
"resolved": "https://registry.npmjs.org/utopia-ui/-/utopia-ui-3.0.0-alpha.138.tgz",
|
||||
"integrity": "sha512-tW7IL5hW6Cgg9jClxwra6qdmMFWbNg2gT2vJT7y4JRil5LLHZzECabqYn1jo5ia8C0c07bRqXRtZdrRcODk3JA==",
|
||||
"dependencies": {
|
||||
"@heroicons/react": "^2.0.17",
|
||||
"@tanstack/react-query": "^5.17.8",
|
||||
|
||||
@ -18,8 +18,8 @@
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-rnd": "^10.4.1",
|
||||
"react-router-dom": "^6.11.2",
|
||||
"utopia-ui": "^3.0.0-alpha.126"
|
||||
"react-router-dom": "^6.23.0",
|
||||
"utopia-ui": "^3.0.0-alpha.138"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.2.79",
|
||||
|
||||
23
src/App.tsx
23
src/App.tsx
@ -26,11 +26,11 @@ function App() {
|
||||
const [map, setMap] = useState<any>();
|
||||
const [layers, setLayers] = useState<any>();
|
||||
const [layerPageRoutes, setLayerPageRoutes] = useState<any>();
|
||||
const [loading, setLoading] = useState<boolean>(true);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
setPermissionsApiInstance(new permissionsApi());
|
||||
setTagsApi(new itemsApi<Tag>('tags', undefined, "36fc9ba7-1a6b-4fc2-9db1-39d67aaf6918"));
|
||||
setMapApiInstance(new mapApi(window.location.origin));
|
||||
}, [])
|
||||
|
||||
@ -42,7 +42,8 @@ function App() {
|
||||
const getMap = async () => {
|
||||
const map = await mapApiInstance?.getItems();
|
||||
map && setMap(map);
|
||||
map && setLayersApiInstance(new layersApi(map.id));
|
||||
map && map!="null" && setLayersApiInstance(new layersApi(map.id));
|
||||
map && map!="null" && map.own_tag_space ? setTagsApi(new itemsApi<Tag>('tags', undefined, map.id)) : setTagsApi(new itemsApi<Tag>('tags'));
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
@ -73,6 +74,10 @@ if(map && map.name){
|
||||
|
||||
}
|
||||
|
||||
setLoading(false);
|
||||
|
||||
|
||||
|
||||
}, [map])
|
||||
|
||||
|
||||
@ -84,7 +89,7 @@ if(map && map.name){
|
||||
<AuthProvider userApi={new userApi}>
|
||||
<AppShell assetsApi={new assetsApi("https://api.utopia-lab.org/assets/")} appName={map.name}>
|
||||
<Permissions api={permissionsApiInstance} adminRole='8ed0b24e-3320-48cd-8444-bc152304e580'></Permissions>
|
||||
<Tags api={tagsApi}></Tags>
|
||||
{tagsApi && <Tags api={tagsApi}></Tags>}
|
||||
<Modal>
|
||||
<ModalContent map={map} />
|
||||
</Modal>
|
||||
@ -95,7 +100,7 @@ if(map && map.name){
|
||||
<Route path="/*" element={<MapContainer map={map} layers={layers} />}>
|
||||
<Route path='login' element={<LoginPage />} />
|
||||
<Route path='signup' element={<SignupPage />} />
|
||||
<Route path='reset-password' element={<RequestPasswordPage reset_url="https://map.collaborative-finance.org/set-new-password/" />} />
|
||||
<Route path='reset-password' element={<RequestPasswordPage reset_url={map.url + "/set-new-password/"} />} />
|
||||
<Route path='set-new-password' element={<SetNewPasswordPage />} />
|
||||
<Route path="profile/*" element={<OverlayProfile />} />
|
||||
<Route path="item/*" element={<OverlayItemProfile />} />
|
||||
@ -106,7 +111,7 @@ if(map && map.name){
|
||||
<Route path="landingpage" element={<Landingpage />} />
|
||||
{
|
||||
layers.map((l: any) =>
|
||||
<Route key={l.id} path={l.name} element={<OverlayItemsIndexPage layerName={l.name} breadcrumbs={[{ name: "Home", path: "/" }, { name: l.name, path: "/" + l.name }]} itemNameField={'name'} itemTextField={'text'} itemImageField={'image'} url={'/item/'} parameterField={'id'} itemSymbolField={'symbol'} itemSubnameField={'subname'} />} />
|
||||
<Route key={l.id} path={l.name} element={<OverlayItemsIndexPage plusButton={l.index_plus_button} layerName={l.name} breadcrumbs={[{ name: "Home", path: "/" }, { name: l.name, path: "/" + l.name }]} itemNameField={'name'} itemTextField={'text'} itemImageField={'image'} url={'/item/'} parameterField={'id'} itemSymbolField={'symbol'} itemSubnameField={'subname'} />} />
|
||||
)
|
||||
}
|
||||
</Route>
|
||||
@ -116,14 +121,20 @@ if(map && map.name){
|
||||
</AuthProvider>
|
||||
</div>
|
||||
)
|
||||
else if (map == "null" && !loading) return (
|
||||
|
||||
else return (
|
||||
<div className="flex items-center justify-center h-screen">
|
||||
<div>
|
||||
<p className='text-xl font-semibold'>This map does not exist</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
else return (
|
||||
<div className="flex items-center justify-center h-screen">
|
||||
<span className="loading loading-spinner loading-lg"></span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
|
||||
@ -30,7 +30,7 @@ export class itemsApi<T> implements ItemsApi<T>{
|
||||
|
||||
async getItems() {
|
||||
try {
|
||||
return await directusClient.request(readItems(this.collectionName as never, { fields: ['*', "relations.*", { user_created: ['*', {offers: ['*'], needs: ['*']}] }], filter: this.filter, limit: 500 }));
|
||||
return await directusClient.request(readItems(this.collectionName as never, { fields: ['*', "relations.*", "user_created.*", {offers: ['*'], needs: ['*']}] , filter: this.filter, limit: 500 }));
|
||||
} catch (error: any) {
|
||||
console.log(error);
|
||||
if (error.errors[0]?.message)
|
||||
|
||||
@ -13,7 +13,8 @@ export class mapApi {
|
||||
async getItems() {
|
||||
try {
|
||||
const map = await directusClient.request(readItems("maps" as any, { fields: ['*'], filter: { "url": { "_eq": this.url } } as any, limit: 500 }));
|
||||
return map[0];
|
||||
if(map[0]) return map[0];
|
||||
else return "null";
|
||||
} catch (error: any) {
|
||||
console.log(error);
|
||||
if (error.errors[0]?.message)
|
||||
|
||||
@ -13,8 +13,12 @@ function MapContainer({ layers, map }: { layers: Array<LayerProps>, map: any })
|
||||
const [apis, setApis] = useState<Array<layerApi>>([]);
|
||||
|
||||
useEffect(() => {
|
||||
layers.map(layer => {
|
||||
apis && setApis(current => [...current, { id: layer.id!, api: new itemsApi<Place>('items', layer.id) }])
|
||||
layers.map((layer:LayerProps) => {
|
||||
apis && setApis(current => [...current, { id: layer.id!, api: new itemsApi<Place>('items', layer.id, undefined, {
|
||||
...(layer.itemType.name == "event" && { "end": {
|
||||
"_gte": "$NOW"
|
||||
}})
|
||||
}) }])
|
||||
})
|
||||
}, [layers])
|
||||
|
||||
@ -36,7 +40,7 @@ function MapContainer({ layers, map }: { layers: Array<LayerProps>, map: any })
|
||||
markerIcon={layer.markerIcon}
|
||||
markerShape={layer.markerShape}
|
||||
onlyOnePerOwner={layer.onlyOnePerOwner}
|
||||
markerDefaultColor='#3D3846'
|
||||
markerDefaultColor={layer.menuColor}
|
||||
itemType={layer.itemType}
|
||||
itemNameField='name'
|
||||
itemTextField='text'
|
||||
@ -44,6 +48,8 @@ function MapContainer({ layers, map }: { layers: Array<LayerProps>, map: any })
|
||||
itemSubnameField='subname'
|
||||
itemColorField='color'
|
||||
itemOwnerField='user_created'
|
||||
itemOffersField='offers'
|
||||
itemNeedsField='needs'
|
||||
customEditLink='/edit-item'
|
||||
customEditParameter='id'
|
||||
api={apis?.find(api => api.id === layer.id)?.api}>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user