From 7be57a56580c17c46fd4220318d7b9c9ab13442a Mon Sep 17 00:00:00 2001 From: Anton Tranelis Date: Sat, 4 Jan 2025 15:24:40 +0000 Subject: [PATCH 1/5] init gallery component --- package-lock.json | 21 +++++++++++++---- package.json | 3 ++- .../Profile/Subcomponents/GalleryView.tsx | 23 +++++++++++++++++++ 3 files changed, 42 insertions(+), 5 deletions(-) create mode 100644 src/Components/Profile/Subcomponents/GalleryView.tsx diff --git a/package-lock.json b/package-lock.json index eeeffbbc..aed2d654 100644 --- a/package-lock.json +++ b/package-lock.json @@ -27,7 +27,8 @@ "react-toastify": "^9.1.3", "remark-breaks": "^4.0.0", "tributejs": "^5.1.3", - "tw-elements": "^1.0.0" + "tw-elements": "^1.0.0", + "yet-another-react-lightbox": "^3.21.7" }, "devDependencies": { "@eslint-community/eslint-plugin-eslint-comments": "^4.4.1", @@ -1170,9 +1171,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001617", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001617.tgz", - "integrity": "sha512-mLyjzNI9I+Pix8zwcrpxEbGlfqOkF9kM3ptzmKNw5tizSyYwMe+nGLTqMK9cO+0E+Bh6TsBxNAaHWEM8xwSsmA==", + "version": "1.0.30001686", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001686.tgz", + "integrity": "sha512-Y7deg0Aergpa24M3qLC5xjNklnKnhsmSyR/V89dLZ1n0ucJIFNs7PgR2Yfa/Zf6W79SbBicgtGxZr2juHkEUIA==", "dev": true, "funding": [ { @@ -7531,6 +7532,18 @@ "node": ">= 14" } }, + "node_modules/yet-another-react-lightbox": { + "version": "3.21.7", + "resolved": "https://registry.npmjs.org/yet-another-react-lightbox/-/yet-another-react-lightbox-3.21.7.tgz", + "integrity": "sha512-dcdokNuCIl92f0Vl+uzeKULnQhztIGpoZFUMvtVNUPmtwsQWpqWufeieDPeg9JtFyVCcbj4vYw3V00DS0QNoWA==", + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, "node_modules/yocto-queue": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", diff --git a/package.json b/package.json index 2a350d55..1af11483 100644 --- a/package.json +++ b/package.json @@ -73,7 +73,8 @@ "react-toastify": "^9.1.3", "remark-breaks": "^4.0.0", "tributejs": "^5.1.3", - "tw-elements": "^1.0.0" + "tw-elements": "^1.0.0", + "yet-another-react-lightbox": "^3.21.7" }, "imports": { "#components/*": "./src/Components/*", diff --git a/src/Components/Profile/Subcomponents/GalleryView.tsx b/src/Components/Profile/Subcomponents/GalleryView.tsx new file mode 100644 index 00000000..81888c89 --- /dev/null +++ b/src/Components/Profile/Subcomponents/GalleryView.tsx @@ -0,0 +1,23 @@ +import { useState } from 'react' +import Lightbox from 'yet-another-react-lightbox/*' + +import type { Item } from '#types/Item' + +export const GalleryView = ({ item }: { item: Item }) => { + const [open, setOpen] = useState(false) + // eslint-disable-next-line no-console + console.log(item) + return ( + <> + + + setOpen(false)} + slides={[{ src: '/image1.jpg' }, { src: '/image2.jpg' }, { src: '/image3.jpg' }]} + /> + + ) +} From bb2025456adebbefc2b2216f428644590c1bfbe2 Mon Sep 17 00:00:00 2001 From: Anton Tranelis Date: Tue, 7 Jan 2025 12:53:59 +0000 Subject: [PATCH 2/5] fixed vulnerability --- package-lock.json | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index aed2d654..7d6fb594 100644 --- a/package-lock.json +++ b/package-lock.json @@ -406,11 +406,10 @@ } }, "node_modules/@types/geojson": { - "version": "7946.0.14", - "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.14.tgz", - "integrity": "sha512-WCfD5Ht3ZesJUsONdhvm84dmzWOiOzOAqOncN0++w0lBw1o8OuDNJF2McvvCef/yBqb/HYRahp1BYtODFQ8bRg==", - "dev": true, - "license": "MIT" + "version": "7946.0.15", + "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.15.tgz", + "integrity": "sha512-9oSxFzDCT2Rj6DfcHF8G++jxBKS7mBqXl5xrRW+Kbvjry6Uduya2iiwqHPhVXpasAVMBYKkEPGgKhd3+/HZ6xA==", + "dev": true }, "node_modules/@types/hast": { "version": "3.0.3", @@ -4788,9 +4787,9 @@ } }, "node_modules/nanoid": { - "version": "3.3.6", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz", - "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==", + "version": "3.3.8", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.8.tgz", + "integrity": "sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==", "funding": [ { "type": "github", From 5ffe44de2ccf7519876d3c07194602b8532d0dc8 Mon Sep 17 00:00:00 2001 From: Anton Tranelis Date: Wed, 8 Jan 2025 00:31:58 +0000 Subject: [PATCH 3/5] implemented gallery widget --- package-lock.json | 18 ++++++++ package.json | 1 + src/Components/AppShell/NavBar.tsx | 2 +- .../Profile/Subcomponents/GalleryView.tsx | 46 +++++++++++++------ src/Components/Profile/Templates/FlexView.tsx | 2 + 5 files changed, 54 insertions(+), 15 deletions(-) diff --git a/package-lock.json b/package-lock.json index 18d24220..13388b1e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,6 +22,7 @@ "react-leaflet": "^4.2.1", "react-leaflet-cluster": "^2.1.0", "react-markdown": "^9.0.1", + "react-photo-album": "^3.0.2", "react-router-dom": "^6.16.0", "react-string-replace": "^1.1.1", "react-toastify": "^9.1.3", @@ -6043,6 +6044,23 @@ "react": ">=18" } }, + "node_modules/react-photo-album": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/react-photo-album/-/react-photo-album-3.0.2.tgz", + "integrity": "sha512-w3+8i6aj9l1jRfcubgVbAlBGSdtiXcqWdcwZcH4/Bavc+v7X7h+S3TkQ723pvDABjhaaxS168g9ECEBP6xnKrQ==", + "engines": { + "node": ">=18" + }, + "peerDependencies": { + "@types/react": ">=18", + "react": ">=18" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, "node_modules/react-router": { "version": "6.16.0", "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.16.0.tgz", diff --git a/package.json b/package.json index ed9294b7..948a9548 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "react-leaflet": "^4.2.1", "react-leaflet-cluster": "^2.1.0", "react-markdown": "^9.0.1", + "react-photo-album": "^3.0.2", "react-router-dom": "^6.16.0", "react-string-replace": "^1.1.1", "react-toastify": "^9.1.3", diff --git a/src/Components/AppShell/NavBar.tsx b/src/Components/AppShell/NavBar.tsx index 0e627c1f..08971877 100644 --- a/src/Components/AppShell/NavBar.tsx +++ b/src/Components/AppShell/NavBar.tsx @@ -62,7 +62,7 @@ export default function NavBar({ appName, userType }: { appName: string; userTyp if (showNav) { return ( <> -
+
- - setOpen(false)} - slides={[{ src: '/image1.jpg' }, { src: '/image2.jpg' }, { src: '/image3.jpg' }]} +
+ setIndex(current)} /> - + + = 0} close={() => setIndex(-1)} /> +
) } diff --git a/src/Components/Profile/Templates/FlexView.tsx b/src/Components/Profile/Templates/FlexView.tsx index 1dea72d6..608b0fdf 100644 --- a/src/Components/Profile/Templates/FlexView.tsx +++ b/src/Components/Profile/Templates/FlexView.tsx @@ -3,6 +3,7 @@ /* eslint-disable @typescript-eslint/no-unsafe-call */ import { ContactInfoView } from '#components/Profile/Subcomponents/ContactInfoView' +import { GalleryView } from '#components/Profile/Subcomponents/GalleryView' import { GroupSubHeaderView } from '#components/Profile/Subcomponents/GroupSubHeaderView' import { ProfileStartEndView } from '#components/Profile/Subcomponents/ProfileStartEndView' import { ProfileTextView } from '#components/Profile/Subcomponents/ProfileTextView' @@ -14,6 +15,7 @@ const componentMap = { texts: ProfileTextView, contactInfos: ContactInfoView, startEnd: ProfileStartEndView, + gallery: GalleryView, // weitere Komponenten hier } From 6501ef40084b9c81704169671bcda5a2972b3922 Mon Sep 17 00:00:00 2001 From: Anton Tranelis Date: Wed, 8 Jan 2025 00:32:03 +0000 Subject: [PATCH 4/5] 3.0.35 --- package-lock.json | 4 ++-- package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index 13388b1e..ce032247 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "utopia-ui", - "version": "3.0.34", + "version": "3.0.35", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "utopia-ui", - "version": "3.0.34", + "version": "3.0.35", "license": "GPL-3.0-only", "dependencies": { "@heroicons/react": "^2.0.17", diff --git a/package.json b/package.json index 948a9548..8feee9aa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "utopia-ui", - "version": "3.0.34", + "version": "3.0.35", "description": "Reuseable React Components to build mapping apps for real life communities and networks", "repository": "https://github.com/utopia-os/utopia-ui", "homepage:": "https://utopia-os.org/", From 0e6959331a5ae5f6e9eaf82a487718a57ff56fdf Mon Sep 17 00:00:00 2001 From: Anton Tranelis Date: Sun, 2 Feb 2025 19:24:13 +0000 Subject: [PATCH 5/5] fixed some linting --- src/Components/Profile/Subcomponents/GalleryView.tsx | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/src/Components/Profile/Subcomponents/GalleryView.tsx b/src/Components/Profile/Subcomponents/GalleryView.tsx index 76cfa0fc..7cf2bc37 100644 --- a/src/Components/Profile/Subcomponents/GalleryView.tsx +++ b/src/Components/Profile/Subcomponents/GalleryView.tsx @@ -1,15 +1,11 @@ -/* eslint-disable import/no-unassigned-import */ -/* eslint-disable import/order */ -/* eslint-disable import/no-extraneous-dependencies */ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ /* eslint-disable @typescript-eslint/restrict-template-expressions */ /* eslint-disable @typescript-eslint/no-unsafe-call */ /* eslint-disable @typescript-eslint/no-unsafe-member-access */ import { useState } from 'react' -// eslint-disable-next-line import/no-named-as-default -import Lightbox from 'yet-another-react-lightbox' -import 'yet-another-react-lightbox/styles.css' import { RowsPhotoAlbum } from 'react-photo-album' +import ReactLightbox from 'yet-another-react-lightbox' +import 'yet-another-react-lightbox/styles.css' import 'react-photo-album/rows.css' import { useAppState } from '#components/AppShell/hooks/useAppState' @@ -35,7 +31,7 @@ export const GalleryView = ({ item }: { item: Item }) => { onClick={({ index: current }) => setIndex(current)} /> - = 0} close={() => setIndex(-1)} /> + = 0} close={() => setIndex(-1)} />
) }