From d3c5e318dc8ac27218daeabee18f9d6af9cd191f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 3 Jul 2023 19:36:58 +0200
Subject: [PATCH 01/31] Add sticky headers to PermissionsView

---
 .../views/admin/CenteredContainer.scss        | 16 +++++++++++++
 .../views/admin/CenteredContainer.tsx         | 24 ++++++++++++++++---
 .../views/admin/user/PermissionsView.tsx      | 20 ++++++++++++++--
 3 files changed, 55 insertions(+), 5 deletions(-)
 create mode 100644 projects/bp-gallery/src/components/views/admin/CenteredContainer.scss

diff --git a/projects/bp-gallery/src/components/views/admin/CenteredContainer.scss b/projects/bp-gallery/src/components/views/admin/CenteredContainer.scss
new file mode 100644
index 000000000..2e20892bc
--- /dev/null
+++ b/projects/bp-gallery/src/components/views/admin/CenteredContainer.scss
@@ -0,0 +1,16 @@
+.transform-to-left-side-of-screen {
+  transform: rotate(-90deg) translate(calc(20% - 50vh), calc(60% - 50vw));
+  position: sticky;
+  top: 0;
+  animation: fade-in 0.5s;
+}
+
+@keyframes fade-in {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
diff --git a/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx b/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx
index b05cc9f31..f867c904b 100644
--- a/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx
+++ b/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx
@@ -1,9 +1,27 @@
-import { PropsWithChildren } from 'react';
+import { PropsWithChildren, useMemo } from 'react';
+import { useScroll } from '../../../hooks/context-hooks';
+import './CenteredContainer.scss';
+
+export const CenteredContainer = ({
+  title,
+  titleOnLeftSideOfScreenAfterScroll = false,
+  children,
+}: PropsWithChildren<{ title: string; titleOnLeftSideOfScreenAfterScroll?: boolean }>) => {
+  const { scrollPos } = useScroll();
+  const titleClassName = useMemo(() => {
+    if (!titleOnLeftSideOfScreenAfterScroll) {
+      return '';
+    }
+    const fadeIn = 50;
+    if (scrollPos >= fadeIn) {
+      return 'transform-to-left-side-of-screen';
+    }
+    return '';
+  }, [titleOnLeftSideOfScreenAfterScroll, scrollPos]);
 
-export const CenteredContainer = ({ title, children }: PropsWithChildren<{ title: string }>) => {
   return (
     <div className='w-[800px] mx-auto mt-4'>
-      <h1>{title}</h1>
+      <h1 className={titleClassName}>{title}</h1>
       {children}
     </div>
   );
diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index e7f7d01e0..74bf44dbc 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -238,9 +238,24 @@ const PermissionsView = ({ userId }: { userId: string }) => {
             })
           ),
         }));
+      const accordionStyle = {
+        backgroundColor: '#e9e9e9',
+      };
       return (
-        <Accordion key={archive?.id ?? type} sx={{ backgroundColor: '#e9e9e9' }}>
-          <AccordionSummary expandIcon={<ExpandMore />}>
+        <Accordion
+          key={archive?.id ?? type}
+          sx={accordionStyle}
+          classes={{
+            root: 'before:z-20', // ::before is the divider between Accordions
+          }}
+        >
+          <AccordionSummary
+            expandIcon={<ExpandMore />}
+            classes={{
+              root: '!sticky top-0 z-10 ',
+            }}
+            sx={accordionStyle}
+          >
             <Typography fontWeight='bold'>
               <CoverageCheckbox
                 coverage={combineCoverages(
@@ -347,6 +362,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
                   ? t('admin.permissions.publicTitle')
                   : t('admin.permissions.title', { userName: user?.username })
               }
+              titleOnLeftSideOfScreenAfterScroll
             >
               <div className='mb-2'>
                 <Input

From 999d0b931846b825697ba53207e59015e434028f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 3 Jul 2023 19:42:04 +0200
Subject: [PATCH 02/31] Replace plural header archives with singular for
 archive specific permissions

---
 .../src/components/views/admin/user/PermissionsView.tsx        | 2 +-
 projects/bp-gallery/src/shared/locales/de.json                 | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index 74bf44dbc..69b970fac 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -296,7 +296,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
                       coverage={combineCoverages(section.groups.map(group => group.coverage))}
                       operations={section.groups.flatMap(group => group.operations)}
                       archive={archive}
-                      label={t(`admin.permissions.section.${section.name}`)}
+                      label={t(`admin.permissions.section.${section.name}`, { context: type })}
                       prompt
                       toggleOperations={toggleOperations}
                     />
diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index 60a096778..8f1f4257a 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -200,7 +200,8 @@
         "collection": "Collections",
         "tags": "Tags: Schlagworte, Personen und Orte",
         "comment": "Kommentare",
-        "archive": "Archive",
+        "archive_system": "Archive",
+        "archive_archive": "Archiv",
         "games": "Spiele",
         "user": "Nutzer"
       },

From 539086047aebfe1123ea3f103dcf126792fe9ce4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 3 Jul 2023 19:47:20 +0200
Subject: [PATCH 03/31] Improve filter input visibility

---
 .../components/views/admin/user/PermissionsView.tsx    | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index 69b970fac..388f72b86 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -1,11 +1,11 @@
-import { ExpandMore } from '@mui/icons-material';
+import { ExpandMore, Search } from '@mui/icons-material';
 import {
   Accordion,
   AccordionDetails,
   AccordionSummary,
   Button,
-  Input,
   Stack,
+  TextField,
   Typography,
 } from '@mui/material';
 import { Operation, Parameter } from 'bp-graphql/build';
@@ -365,11 +365,15 @@ const PermissionsView = ({ userId }: { userId: string }) => {
               titleOnLeftSideOfScreenAfterScroll
             >
               <div className='mb-2'>
-                <Input
+                <TextField
                   fullWidth
                   value={filter}
                   onChange={onFilterChange}
                   placeholder={t('admin.permissions.filterPlaceholder')}
+                  variant='outlined'
+                  InputProps={{
+                    endAdornment: <Search />,
+                  }}
                 />
               </div>
               {renderSections('system')}

From df107a8a95970ddb656952fe249b96fcf4d201e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 3 Jul 2023 20:03:55 +0200
Subject: [PATCH 04/31] Fix save state not showing when user can't edit picture

---
 .../views/picture/sidebar/PictureSidebar.tsx  | 28 ++++++++++++-------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx b/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx
index 9b78b6fe3..6fd33fd26 100644
--- a/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx
+++ b/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx
@@ -114,17 +114,25 @@ const PictureSidebar = ({
             hasHiddenLinks={false}
             onSave={canUpdatePicture ? onSave : undefined}
             topInfo={(anyFieldTouched, isSaving) =>
-              canEditPicture && (
+              (canEditPicture || canUpdatePicture) && (
                 <div className='curator-ops'>
-                  <Button startIcon={<Crop />} onClick={() => setEditDialogOpen(true)}>
-                    {t('curator.editPicture')}
-                  </Button>
-                  <PictureEditDialog
-                    picture={picture}
-                    open={editDialogOpen}
-                    onClose={onDialogClose}
-                  />
-                  <span className='save-state'>{saveStatus(anyFieldTouched, isSaving)}</span>
+                  {canEditPicture && (
+                    <>
+                      <Button startIcon={<Crop />} onClick={() => setEditDialogOpen(true)}>
+                        {t('curator.editPicture')}
+                      </Button>
+                      <PictureEditDialog
+                        picture={picture}
+                        open={editDialogOpen}
+                        onClose={onDialogClose}
+                      />
+                    </>
+                  )}
+                  {canUpdatePicture && (
+                    <span className='save-state ml-auto'>
+                      {saveStatus(anyFieldTouched, isSaving)}
+                    </span>
+                  )}
                 </div>
               )
             }

From 9fe07ac5e619d789a503b93a1bb1f144a4b60e93 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 3 Jul 2023 21:10:36 +0200
Subject: [PATCH 05/31] Disable map when user can't update location coordinates

---
 .../LocationManagementDialog.tsx              | 53 ++++++++++++++++---
 1 file changed, 46 insertions(+), 7 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx b/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx
index 6be23ce6a..77122672d 100644
--- a/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx
+++ b/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx
@@ -18,9 +18,10 @@ import markerShadow from 'leaflet/dist/images/marker-shadow.png';
 import { pick } from 'lodash';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { MapContainer, Marker, TileLayer, useMapEvent } from 'react-leaflet';
+import { MapContainer, Marker, TileLayer, ZoomControl, useMapEvent } from 'react-leaflet';
 import {
   useCanRunCreateLocationTagMutation,
+  useCanRunUpdateLocationCoordinatesMutation,
   useCreateLocationTagMutation,
   useUpdateLocationCoordinatesMutation,
 } from '../../../graphql/APIConnector';
@@ -53,10 +54,10 @@ const LocationMarker = ({
   setPosition,
 }: {
   position?: LatLng;
-  setPosition: (pos: LatLng) => void;
+  setPosition?: (pos: LatLng) => void;
 }) => {
   useMapEvent('click', event => {
-    setPosition(event.latlng.clone());
+    setPosition?.(event.latlng.clone());
   });
 
   const myIcon = new Icon({
@@ -74,6 +75,15 @@ const LocationMarker = ({
   return position ? <Marker icon={myIcon} position={position} /> : null;
 };
 
+const mapControlKeys = [
+  'dragging',
+  'touchZoom',
+  'scrollWheelZoom',
+  'boxZoom',
+  'doubleClickZoom',
+  'keyboard',
+] as const;
+
 const LocationManagementDialogPreset = ({
   handleClose,
   dialogProps,
@@ -167,6 +177,22 @@ const LocationManagementDialogPreset = ({
   const [updateLocationCoordinatesMutation] = useUpdateLocationCoordinatesMutation({
     onCompleted: refetch,
   });
+  const { canRun: canUpdateLocationCoordinates } = useCanRunUpdateLocationCoordinatesMutation({
+    variables: {
+      tagId: locationTag.id,
+    },
+  });
+
+  useEffect(() => {
+    for (const key of mapControlKeys) {
+      const handler = map.current?.[key];
+      if (canUpdateLocationCoordinates) {
+        handler?.enable();
+      } else {
+        handler?.disable();
+    }
+    }
+  }, [canUpdateLocationCoordinates]);
 
   const initialMapValues = useMemo(() => {
     return {
@@ -357,21 +383,31 @@ const LocationManagementDialogPreset = ({
             </div>
           </div>
           <div className='location-management-right'>
-            <div className='location-management-map'>
+            <div
+              className={`location-management-map ${
+                canUpdateLocationCoordinates ? '' : 'grayscale'
+              }`}
+            >
               <MapContainer
                 center={initialMapValues.center}
                 zoom={initialMapValues.zoom}
                 className='map-container w-full h-full mb-1'
-                scrollWheelZoom={true}
+                {...Object.fromEntries(
+                  mapControlKeys.map(key => [key, canUpdateLocationCoordinates] as const)
+                )}
+                zoomControl={false}
                 ref={map}
               >
                 <TileLayer
                   attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
                   url='https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
                 />
+                {canUpdateLocationCoordinates && <ZoomControl />}
                 <LocationMarker
                   position={position}
-                  setPosition={pos => {
+                  setPosition={
+                    canUpdateLocationCoordinates
+                      ? pos => {
                     updateLocationCoordinatesMutation({
                       variables: {
                         tagId: locationTag.id,
@@ -382,7 +418,9 @@ const LocationManagementDialogPreset = ({
                       },
                     });
                     setPosition(pos);
-                  }}
+                        }
+                      : undefined
+                  }
                 />
               </MapContainer>
             </div>
@@ -398,6 +436,7 @@ const LocationManagementDialogPreset = ({
                   });
                   setPosition(undefined);
                 }}
+                disabled={!canUpdateLocationCoordinates}
                 endIcon={<Delete />}
               >
                 {t('tag-panel.delete-coordinate')}

From b65b584b4a735e751efbaa6b48b05a97719ee831 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 3 Jul 2023 21:12:31 +0200
Subject: [PATCH 06/31] Refactor LocationManagementDialog buttons

---
 .../components/provider/MuiThemeProvider.tsx  |  3 +-
 .../LocationManagementDialog.scss             | 20 ++-----
 .../LocationManagementDialog.tsx              | 54 +++++++++----------
 .../bp-gallery/src/shared/style.module.scss   |  2 +
 4 files changed, 34 insertions(+), 45 deletions(-)

diff --git a/projects/bp-gallery/src/components/provider/MuiThemeProvider.tsx b/projects/bp-gallery/src/components/provider/MuiThemeProvider.tsx
index c76d58b4a..f570d25dc 100644
--- a/projects/bp-gallery/src/components/provider/MuiThemeProvider.tsx
+++ b/projects/bp-gallery/src/components/provider/MuiThemeProvider.tsx
@@ -19,7 +19,8 @@ type ColorsType = Record<
   | 'archiveColor'
   | 'titleColor'
   | 'allSearchColor'
-  | 'likeColor',
+  | 'likeColor'
+  | 'greyColor',
   string
 >;
 
diff --git a/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.scss b/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.scss
index a1b93662b..a12ea78e2 100644
--- a/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.scss
+++ b/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.scss
@@ -23,6 +23,7 @@
 
   .location-management-left {
     padding-right: 8px;
+
     .location-management-name-container {
       display: flex;
 
@@ -80,6 +81,7 @@
   .location-management-right {
     padding-left: 8px;
     max-width: 400px;
+
     .location-management-map {
       width: 400px;
       height: 400px;
@@ -92,32 +94,18 @@
         color: $archiveColor;
         margin-top: 1rem;
       }
-
-      .location-management-button {
-        color: #ffffff;
-        margin-top: 0.5rem;
-        width: 100%;
-        padding-inline: 1rem;
-        align-self: center;
-      }
-
-      .location-management-primary {
-        background-color: $primaryColor;
-      }
-
-      .location-management-gray {
-        background-color: lightgray;
-      }
     }
   }
 }
 
 .location-management-navigation {
   display: flex;
+
   .location-management-previous-button {
     margin-left: 10px;
     margin-right: auto;
   }
+
   .location-management-next-button {
     margin-left: auto;
     margin-right: 4px;
diff --git a/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx b/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx
index 77122672d..b6dd949ff 100644
--- a/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx
+++ b/projects/bp-gallery/src/components/views/location-curating/LocationManagementDialog.tsx
@@ -11,7 +11,7 @@ import {
   Visibility,
   VisibilityOff,
 } from '@mui/icons-material';
-import { Button, Chip, DialogContent, IconButton, TextField } from '@mui/material';
+import { Button, ButtonProps, Chip, DialogContent, IconButton, TextField } from '@mui/material';
 import { Icon, LatLng, Map } from 'leaflet';
 import myMarkerIcon from 'leaflet/dist/images/marker-icon-2x.png';
 import markerShadow from 'leaflet/dist/images/marker-shadow.png';
@@ -190,7 +190,7 @@ const LocationManagementDialogPreset = ({
         handler?.enable();
       } else {
         handler?.disable();
-    }
+      }
     }
   }, [canUpdateLocationCoordinates]);
 
@@ -408,16 +408,16 @@ const LocationManagementDialogPreset = ({
                   setPosition={
                     canUpdateLocationCoordinates
                       ? pos => {
-                    updateLocationCoordinatesMutation({
-                      variables: {
-                        tagId: locationTag.id,
-                        coordinate: {
-                          latitude: pos.lat,
-                          longitude: pos.lng,
-                        },
-                      },
-                    });
-                    setPosition(pos);
+                          updateLocationCoordinatesMutation({
+                            variables: {
+                              tagId: locationTag.id,
+                              coordinate: {
+                                latitude: pos.lat,
+                                longitude: pos.lng,
+                              },
+                            },
+                          });
+                          setPosition(pos);
                         }
                       : undefined
                   }
@@ -425,8 +425,7 @@ const LocationManagementDialogPreset = ({
               </MapContainer>
             </div>
             <div className='location-management-actions'>
-              <Button
-                className='location-management-button location-management-primary'
+              <LocationManagementButton
                 onClick={() => {
                   updateLocationCoordinatesMutation({
                     variables: {
@@ -440,15 +439,14 @@ const LocationManagementDialogPreset = ({
                 endIcon={<Delete />}
               >
                 {t('tag-panel.delete-coordinate')}
-              </Button>
+              </LocationManagementButton>
               <div className='location-management-picture-count'>
                 {flattenedPictures &&
                   t('tag-panel.location-pictures', {
                     count: flattenedPictures.locationTags[0].pictures.length,
                   })}
               </div>
-              <Button
-                className='location-management-button location-management-primary'
+              <LocationManagementButton
                 onClick={() => {
                   handleClose(undefined);
                   visit(`/show-more/location/${locationTag.id}`, {
@@ -459,35 +457,31 @@ const LocationManagementDialogPreset = ({
                 endIcon={<ArrowForwardIos />}
               >
                 {t('common.show-pictures')}
-              </Button>
-              <Button
-                className={`${
-                  localVisibility ? 'location-management-primary' : 'location-management-gray'
-                } location-management-button`}
+              </LocationManagementButton>
+              <LocationManagementButton
                 onClick={() => {
                   setVisible(!localVisibility);
                   setLocalVisibility(localVisibility => !localVisibility);
                 }}
                 disabled={!canSetVisible}
+                color={localVisibility ? 'primary' : 'grey'}
                 endIcon={localVisibility ? <Visibility /> : <VisibilityOff />}
               >
                 {localVisibility ? t('common.visible') : t('common.invisible')}
-              </Button>
-              <Button
-                className={`${
-                  isRoot ? 'location-management-primary' : 'location-management-gray'
-                } location-management-button`}
+              </LocationManagementButton>
+              <LocationManagementButton
                 onClick={() => {
                   if (locationTag.parent_tags?.length) {
                     setTagAsRoot(!isRoot);
                     setIsRoot(isRoot => !isRoot);
                   }
                 }}
+                color={isRoot ? 'primary' : 'grey'}
                 disabled={!canSetTagAsRoot}
                 endIcon={<AccountTree />}
               >
                 {isRoot ? t('common.root') : t('common.no-root')}
-              </Button>
+              </LocationManagementButton>
             </div>
           </div>
         </div>
@@ -526,4 +520,8 @@ const LocationManagementDialogPreset = ({
   );
 };
 
+const LocationManagementButton = (props: ButtonProps) => {
+  return <Button className='!my-1' fullWidth color='primary' variant='contained' {...props} />;
+};
+
 export default LocationManagementDialogPreset;
diff --git a/projects/bp-gallery/src/shared/style.module.scss b/projects/bp-gallery/src/shared/style.module.scss
index eed4bfed1..9dbcfd465 100755
--- a/projects/bp-gallery/src/shared/style.module.scss
+++ b/projects/bp-gallery/src/shared/style.module.scss
@@ -18,6 +18,7 @@ $archiveColor: #446ab7;
 $titleColor: #5f5e5e;
 $allSearchColor: #84b0c4;
 $likeColor: #60a5fa; // blue-400 from tailwind
+$greyColor: #d3d3d3;
 
 :export {
   primaryColor: $primaryColor;
@@ -38,6 +39,7 @@ $likeColor: #60a5fa; // blue-400 from tailwind
   titleColor: $titleColor;
   allSearchColor: $allSearchColor;
   likeColor: $likeColor;
+  greyColor: $greyColor;
 }
 
 $mobile-breakpoint: 750px;

From 87a6664ced87097920bc5cb3260ef8601cb9dd78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Tue, 4 Jul 2023 16:21:08 +0200
Subject: [PATCH 07/31] Only show editable archives in ArchivesView

---
 .../views/admin/archive/ArchivesView.tsx      | 17 ++++--
 projects/bp-gallery/src/hooks/can-do-hooks.ts | 55 +++++++++++++------
 2 files changed, 52 insertions(+), 20 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/archive/ArchivesView.tsx b/projects/bp-gallery/src/components/views/admin/archive/ArchivesView.tsx
index 6da8aad60..65d4da4ef 100644
--- a/projects/bp-gallery/src/components/views/admin/archive/ArchivesView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/archive/ArchivesView.tsx
@@ -20,13 +20,22 @@ export const ArchivesView = () => {
   const { data, error, loading } = useGetAllArchiveTagsQuery();
   const archives: FlatArchiveTag[] | undefined = useSimplifiedQueryResponseData(data)?.archiveTags;
 
+  const {
+    canUseArchivesView,
+    canUseMultipleEditArchiveViews,
+    loading: canUseArchivesViewLoading,
+  } = useCanUseArchivesView();
+
   const sortedArchives = useMemo(
-    () => (archives ? archives.slice().sort((a, b) => a.name.localeCompare(b.name)) : undefined),
-    [archives]
+    () =>
+      archives
+        ? archives
+            .filter(archive => canUseMultipleEditArchiveViews[archive.id])
+            .sort((a, b) => a.name.localeCompare(b.name))
+        : undefined,
+    [archives, canUseMultipleEditArchiveViews]
   );
 
-  const { canUseArchivesView, loading: canUseArchivesViewLoading } = useCanUseArchivesView();
-
   return (
     <ProtectedRoute canUse={canUseArchivesView} canUseLoading={canUseArchivesViewLoading}>
       {() => {
diff --git a/projects/bp-gallery/src/hooks/can-do-hooks.ts b/projects/bp-gallery/src/hooks/can-do-hooks.ts
index aa7e23be0..702609211 100644
--- a/projects/bp-gallery/src/hooks/can-do-hooks.ts
+++ b/projects/bp-gallery/src/hooks/can-do-hooks.ts
@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
 import { parseUserId } from '../components/views/admin/user/helper';
 import {
   useCanRunAcceptCommentMutation,
@@ -25,6 +26,8 @@ import {
   useCanRunGetUsersQuery,
   useCanRunMergeCollectionsMutation,
   useCanRunMultipleCreatePictureMutations,
+  useCanRunMultipleRemoveArchiveTagMutations,
+  useCanRunMultipleUpdateArchiveMutations,
   useCanRunMultipleUpdateExhibitionMutations,
   useCanRunMultipleUpdatePictureSequenceDataMutations,
   useCanRunMultipleUploadMutation,
@@ -71,18 +74,36 @@ export const useCanUseEditArchiveView = (id: string) => {
   };
 };
 
-export const useCanUseSomeEditArchiveView = () => {
-  const { canRun: canEditSomeArchive, loading: canEditSomeArchiveLoading } =
-    useCanRunUpdateArchiveMutation({
-      withSomeVariables: true,
+export const useCanUseMultipleEditArchiveViews = () => {
+  const { data, loading: archivesLoading } = useGetAllArchiveTagsQuery();
+  const archives: FlatArchiveTag[] | undefined = useSimplifiedQueryResponseData(data)?.archiveTags;
+  const { canRunMultiple: canEditMultipleArchives, loading: canEditMultipleArchivesLoading } =
+    useCanRunMultipleUpdateArchiveMutations({
+      variableSets:
+        archives?.map(archive => ({
+          archiveId: archive.id,
+        })) ?? [],
     });
-  const { canRun: canRemoveSomeArchive, loading: canRemoveSomeArchiveLoading } =
-    useCanRunRemoveArchiveTagMutation({
-      withSomeVariables: true,
+  const { canRunMultiple: canRemoveMultipleArchives, loading: canRemoveMultipleArchivesLoading } =
+    useCanRunMultipleRemoveArchiveTagMutations({
+      variableSets:
+        archives?.map(archive => ({
+          id: archive.id,
+        })) ?? [],
     });
+  const canUseMultipleEditArchiveViews = useMemo(
+    () =>
+      Object.fromEntries(
+        archives?.map((archive, index) => [
+          archive.id,
+          (canEditMultipleArchives[index] ?? false) || (canRemoveMultipleArchives[index] ?? false),
+        ]) ?? []
+      ),
+    [archives, canEditMultipleArchives, canRemoveMultipleArchives]
+  );
   return {
-    canUseSomeEditArchiveView: canEditSomeArchive || canRemoveSomeArchive,
-    loading: canEditSomeArchiveLoading || canRemoveSomeArchiveLoading,
+    canUseMultipleEditArchiveViews,
+    loading: archivesLoading || canEditMultipleArchivesLoading || canRemoveMultipleArchivesLoading,
   };
 };
 
@@ -394,16 +415,18 @@ export const useCanUseUsersView = () => {
 };
 
 export const useCanUseArchivesView = () => {
-  const { canRun: canGetAllArchiveTags, loading: canGetAllArchiveTagsLoading } =
-    useCanRunGetAllArchiveTagsQuery();
-  const { canUseSomeEditArchiveView, loading: canUseSomeEditArchiveViewLoading } =
-    useCanUseSomeEditArchiveView();
+  const { canUseMultipleEditArchiveViews, loading: canUseMultipleEditArchiveViewsLoading } =
+    useCanUseMultipleEditArchiveViews();
   const { canAddArchive, loading: canAddArchiveLoading } = useCanAddArchive();
 
+  const canUseSomeEditArchiveView =
+    !canUseMultipleEditArchiveViewsLoading &&
+    Object.values(canUseMultipleEditArchiveViews).some(can => can);
+
   return {
-    canUseArchivesView: canGetAllArchiveTags && (canUseSomeEditArchiveView || canAddArchive),
-    loading:
-      canGetAllArchiveTagsLoading || canUseSomeEditArchiveViewLoading || canAddArchiveLoading,
+    canUseArchivesView: canUseSomeEditArchiveView || canAddArchive,
+    canUseMultipleEditArchiveViews,
+    loading: canUseMultipleEditArchiveViewsLoading || canAddArchiveLoading,
   };
 };
 

From 990031bdfa6212ff998155559eec9067312e6729 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Tue, 4 Jul 2023 16:43:30 +0200
Subject: [PATCH 08/31] Fix Unauthorized error on MyAccountView when user can't
 run getUser

---
 .../views/admin/user/RemoveUserButton.tsx         | 15 +++------------
 .../src/components/views/admin/user/UserView.tsx  |  2 +-
 2 files changed, 4 insertions(+), 13 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/RemoveUserButton.tsx b/projects/bp-gallery/src/components/views/admin/user/RemoveUserButton.tsx
index eacb2aa59..d67e95090 100644
--- a/projects/bp-gallery/src/components/views/admin/user/RemoveUserButton.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/RemoveUserButton.tsx
@@ -1,22 +1,13 @@
 import { useMemo } from 'react';
-import { useGetUserQuery, useRemoveUserMutation } from '../../../../graphql/APIConnector';
-import { useSimplifiedQueryResponseData } from '../../../../graphql/queryUtils';
+import { useRemoveUserMutation } from '../../../../graphql/APIConnector';
 import { useCanRemoveUser } from '../../../../hooks/can-do-hooks';
 import { FlatUsersPermissionsUser } from '../../../../types/additionalFlatTypes';
 import { DangerousRemoveButton } from '../DangerousRemoveButton';
 
-export const RemoveUserButton = ({ id }: { id: string | undefined }) => {
-  const { data } = useGetUserQuery({
-    variables: {
-      id: id ?? '-1',
-    },
-  });
-  const user: FlatUsersPermissionsUser | undefined =
-    useSimplifiedQueryResponseData(data)?.usersPermissionsUser;
-
+export const RemoveUserButton = ({ user }: { user: FlatUsersPermissionsUser | undefined }) => {
   const [removeUserMutation] = useRemoveUserMutation();
 
-  const { canRemoveUser } = useCanRemoveUser(id);
+  const { canRemoveUser } = useCanRemoveUser(user?.id);
 
   const entity = useMemo(
     () =>
diff --git a/projects/bp-gallery/src/components/views/admin/user/UserView.tsx b/projects/bp-gallery/src/components/views/admin/user/UserView.tsx
index 7cf1cfc08..49164153b 100644
--- a/projects/bp-gallery/src/components/views/admin/user/UserView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/UserView.tsx
@@ -93,7 +93,7 @@ export const UserView = ({
             {t('admin.user.permissions')}
           </Button>
         )}
-        <RemoveUserButton id={user?.id} />
+        <RemoveUserButton user={user} />
       </Stack>
     </CenteredContainer>
   );

From 84255eb4b2b107d8da62e72a8b631e1439b023c4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 11:44:43 +0200
Subject: [PATCH 09/31] Remove ability to login via resetPassword

Also remove jwt token from changePasswort response.
---
 .../src/components/provider/AuthProvider.tsx         |  7 ++++---
 .../views/admin/user/ChangePasswordView.tsx          |  2 +-
 projects/bp-gallery/src/graphql/APIConnector.tsx     | 12 ++++++++----
 projects/bp-gallery/src/graphql/operation.graphql    |  4 ++--
 projects/bp-gallery/src/shared/locales/de.json       |  3 ++-
 projects/bp-graphql/src/operations/changePassword.ts |  4 +++-
 projects/bp-graphql/src/operations/resetPassword.ts  |  4 +++-
 7 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/projects/bp-gallery/src/components/provider/AuthProvider.tsx b/projects/bp-gallery/src/components/provider/AuthProvider.tsx
index 773d5f678..4c39b30e9 100644
--- a/projects/bp-gallery/src/components/provider/AuthProvider.tsx
+++ b/projects/bp-gallery/src/components/provider/AuthProvider.tsx
@@ -126,10 +126,11 @@ const AuthProvider = ({ children }: PropsWithChildren<{}>) => {
           passwordConfirmation,
         },
       });
-      const jwtToken = data?.resetPassword?.jwt;
-      await afterLogin(errors, jwtToken);
+      if (!errors && data?.resetPassword) {
+        displaySuccess(t('admin.resetPassword.success'));
+      }
     },
-    [resetPasswordMutation, afterLogin]
+    [resetPasswordMutation, displaySuccess, t]
   );
 
   const logout = useCallback(() => {
diff --git a/projects/bp-gallery/src/components/views/admin/user/ChangePasswordView.tsx b/projects/bp-gallery/src/components/views/admin/user/ChangePasswordView.tsx
index 472302b21..b4e4762e3 100644
--- a/projects/bp-gallery/src/components/views/admin/user/ChangePasswordView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/ChangePasswordView.tsx
@@ -26,7 +26,7 @@ export const ChangePasswordView = () => {
         passwordConfirmation,
       },
     });
-    if (result.data?.changePassword?.jwt) {
+    if (result.data?.changePassword?.user.id) {
       openAlert({
         alertType: AlertType.SUCCESS,
         message: t('admin.changePassword.success'),
diff --git a/projects/bp-gallery/src/graphql/APIConnector.tsx b/projects/bp-gallery/src/graphql/APIConnector.tsx
index 1577ccbda..dc6392df0 100644
--- a/projects/bp-gallery/src/graphql/APIConnector.tsx
+++ b/projects/bp-gallery/src/graphql/APIConnector.tsx
@@ -3942,7 +3942,7 @@ export type ChangePasswordMutationVariables = Exact<{
   passwordConfirmation: Scalars['String'];
 }>;
 
-export type ChangePasswordMutation = { changePassword?: { jwt?: string | null } | null };
+export type ChangePasswordMutation = { changePassword?: { user: { id: string } } | null };
 
 export type ContactMutationVariables = Exact<{
   recipient: Scalars['String'];
@@ -4259,7 +4259,7 @@ export type ResetPasswordMutationVariables = Exact<{
   passwordConfirmation: Scalars['String'];
 }>;
 
-export type ResetPasswordMutation = { resetPassword?: { jwt?: string | null } | null };
+export type ResetPasswordMutation = { resetPassword?: { user: { id: string } } | null };
 
 export type SetPicturesForCollectionMutationVariables = Exact<{
   pictureIds: Array<InputMaybe<Scalars['ID']>> | InputMaybe<Scalars['ID']>;
@@ -8085,7 +8085,9 @@ export const ChangePasswordDocument = gql`
       password: $password
       passwordConfirmation: $passwordConfirmation
     ) {
-      jwt
+      user {
+        id
+      }
     }
   }
 `;
@@ -10206,7 +10208,9 @@ export type RemoveUserMutationOptions = Apollo.BaseMutationOptions<
 export const ResetPasswordDocument = gql`
   mutation resetPassword($token: String!, $password: String!, $passwordConfirmation: String!) {
     resetPassword(code: $token, password: $password, passwordConfirmation: $passwordConfirmation) {
-      jwt
+      user {
+        id
+      }
     }
   }
 `;
diff --git a/projects/bp-gallery/src/graphql/operation.graphql b/projects/bp-gallery/src/graphql/operation.graphql
index 0c2bd4f58..da76da45b 100644
--- a/projects/bp-gallery/src/graphql/operation.graphql
+++ b/projects/bp-gallery/src/graphql/operation.graphql
@@ -41,7 +41,7 @@ mutation addArchiveTag($name: String!) { addArchiveTag(name: $name) }
 mutation addPermission( $user_id: ID $operation_name: String $archive_tag: ID $on_other_users: Boolean ) { addPermission( user_id: $user_id operation_name: $operation_name archive_tag: $archive_tag on_other_users: $on_other_users ) }
 mutation addUser($username: String! $email: String!) { addUser(username: $username email: $email) }
 mutation bulkEdit($pictureIds: [ID!]! $data: JSON!) { doBulkEdit(ids: $pictureIds data: $data) }
-mutation changePassword( $currentPassword: String! $password: String! $passwordConfirmation: String! ) { changePassword( currentPassword: $currentPassword password: $password passwordConfirmation: $passwordConfirmation ) { jwt } }
+mutation changePassword( $currentPassword: String! $password: String! $passwordConfirmation: String! ) { changePassword( currentPassword: $currentPassword password: $password passwordConfirmation: $passwordConfirmation ) { user { id } } }
 mutation contact( $recipient: String! $sender_name: String! $reply_email: String! $subject: String! $message: String! ) { contact( recipient: $recipient sender_name: $sender_name reply_email: $reply_email subject: $subject message: $message ) }
 mutation createExhibition($archiveId: ID! $publishedAt: DateTime!) { createExhibition(data: { archive_tag: $archiveId publishedAt: $publishedAt }) { data { id } } }
 mutation createExhibitionPicture( $exhibitionIdealotId: ID! $pictureId: ID! $publishedAt: DateTime! ) { createExhibitionPicture( data: { exhibition_idealot: $exhibitionIdealotId picture: $pictureId publishedAt: $publishedAt } ) { data { id } } }
@@ -80,7 +80,7 @@ mutation postComment( $id: ID! $author: String! $text: String! $date: DateTime!
 mutation removeArchiveTag($id: ID!) { removeArchiveTag(id: $id) }
 mutation removeUpload($id: ID!) { removeFile(id: $id) { data { id } } }
 mutation removeUser($id: ID!) { removeUser(id: $id) }
-mutation resetPassword($token: String! $password: String! $passwordConfirmation: String!) { resetPassword( code: $token password: $password passwordConfirmation: $passwordConfirmation ) { jwt } }
+mutation resetPassword($token: String! $password: String! $passwordConfirmation: String!) { resetPassword( code: $token password: $password passwordConfirmation: $passwordConfirmation ) { user { id } } }
 mutation setPicturesForCollection($pictureIds: [ID]! $collectionId: ID!) { updateCollection(id: $collectionId data: { pictures: $pictureIds }) { data { id } } }
 mutation unpinComment($commentId: ID!) { updateComment(id: $commentId data: { pinned: false }) { data { id } } }
 mutation unpublishPicture($id: ID!) { updatePicture(id: $id data: { publishedAt: null }) { data { id } } }
diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index 55346ecd4..7e437160b 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -310,7 +310,8 @@
     "resetPassword": {
       "title": "Passwort setzen/zurücksetzen",
       "password": "Neues Passwort",
-      "passwordConfirmation": "Neues Passwort wiederholen"
+      "passwordConfirmation": "Neues Passwort wiederholen",
+      "success": "Passwort erfolgreich gesetzt/zurückgesetzt"
     },
     "changePassword": {
       "title": "Passwort ändern",
diff --git a/projects/bp-graphql/src/operations/changePassword.ts b/projects/bp-graphql/src/operations/changePassword.ts
index dbca7db8d..e8bd82385 100644
--- a/projects/bp-graphql/src/operations/changePassword.ts
+++ b/projects/bp-graphql/src/operations/changePassword.ts
@@ -13,7 +13,9 @@ export default {
         password: $password
         passwordConfirmation: $passwordConfirmation
       ) {
-        jwt
+        user {
+          id
+        }
       }
     }
   `,
diff --git a/projects/bp-graphql/src/operations/resetPassword.ts b/projects/bp-graphql/src/operations/resetPassword.ts
index 9c4d43b84..3ad5edc7f 100644
--- a/projects/bp-graphql/src/operations/resetPassword.ts
+++ b/projects/bp-graphql/src/operations/resetPassword.ts
@@ -9,7 +9,9 @@ export default {
         password: $password
         passwordConfirmation: $passwordConfirmation
       ) {
-        jwt
+        user {
+          id
+        }
       }
     }
   `,

From 94326b73268d456624f5f24893553dfc4e432ba4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 11:53:13 +0200
Subject: [PATCH 10/31] Fix error handling again

---
 projects/bp-gallery/src/helpers/app-helpers.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/projects/bp-gallery/src/helpers/app-helpers.ts b/projects/bp-gallery/src/helpers/app-helpers.ts
index 2eb7796ee..59e23ad21 100644
--- a/projects/bp-gallery/src/helpers/app-helpers.ts
+++ b/projects/bp-gallery/src/helpers/app-helpers.ts
@@ -88,7 +88,9 @@ const errorToStrings = (error: unknown): string[] => {
       for (const resultError of error.result.errors) {
         errors.push(...errorToStrings(resultError));
       }
-    } else if ('message' in error) {
+    }
+
+    if (errors.length === 0 && 'message' in error) {
       errors.push(...errorToStrings(error.message));
     }
   }

From bc3ba93ec683005639627b525c4ac7bd41b5d1ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 13:36:26 +0200
Subject: [PATCH 11/31] Extract location specific permissions into own section

---
 projects/bp-gallery/src/shared/locales/de.json                  | 1 +
 projects/bp-graphql/src/Operation.ts                            | 1 +
 projects/bp-graphql/src/groups/updateLocationHierarchy.ts       | 2 +-
 projects/bp-graphql/src/operations/updateLocationAcceptance.ts  | 2 +-
 projects/bp-graphql/src/operations/updateLocationCoordinates.ts | 2 +-
 5 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index 7e437160b..907683bc3 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -199,6 +199,7 @@
         "picture": "Bilder",
         "collection": "Collections",
         "tags": "Tags: Schlagworte, Personen und Orte",
+        "locations": "Orte",
         "comment": "Kommentare",
         "archive_system": "Archive",
         "archive_archive": "Archiv",
diff --git a/projects/bp-graphql/src/Operation.ts b/projects/bp-graphql/src/Operation.ts
index b0c386c00..149890143 100644
--- a/projects/bp-graphql/src/Operation.ts
+++ b/projects/bp-graphql/src/Operation.ts
@@ -40,6 +40,7 @@ export const sections = [
   'picture',
   'collection',
   'tags',
+  'locations',
   'comment',
   'archive',
   'games',
diff --git a/projects/bp-graphql/src/groups/updateLocationHierarchy.ts b/projects/bp-graphql/src/groups/updateLocationHierarchy.ts
index 6c350e8a8..d8b423a22 100644
--- a/projects/bp-graphql/src/groups/updateLocationHierarchy.ts
+++ b/projects/bp-graphql/src/groups/updateLocationHierarchy.ts
@@ -2,6 +2,6 @@ import { Group } from '../Operation';
 
 export default {
   name: 'updateLocationHierarchy',
-  section: 'tags',
+  section: 'locations',
   needsParameters: [],
 } satisfies Group;
diff --git a/projects/bp-graphql/src/operations/updateLocationAcceptance.ts b/projects/bp-graphql/src/operations/updateLocationAcceptance.ts
index 64e1709c7..98ea36816 100644
--- a/projects/bp-graphql/src/operations/updateLocationAcceptance.ts
+++ b/projects/bp-graphql/src/operations/updateLocationAcceptance.ts
@@ -2,7 +2,7 @@ import { Operation, graphql } from '../Operation.js';
 import { always } from '../isAllowedHelpers.js';
 
 export default {
-  section: 'tags',
+  section: 'locations',
   needsParameters: [],
   isAllowed: always,
   document: graphql`
diff --git a/projects/bp-graphql/src/operations/updateLocationCoordinates.ts b/projects/bp-graphql/src/operations/updateLocationCoordinates.ts
index 2fd80216b..296e95d31 100644
--- a/projects/bp-graphql/src/operations/updateLocationCoordinates.ts
+++ b/projects/bp-graphql/src/operations/updateLocationCoordinates.ts
@@ -2,7 +2,7 @@ import { Operation, graphql } from '../Operation.js';
 import { always } from '../isAllowedHelpers.js';
 
 export default {
-  section: 'tags',
+  section: 'locations',
   needsParameters: [],
   isAllowed: always,
   document: graphql`

From 26deafc1c91abba1983d159af07168e180cbf662 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 13:43:50 +0200
Subject: [PATCH 12/31] Improve translation for withoutArchive

---
 projects/bp-gallery/src/shared/locales/de.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index 907683bc3..91aa0c882 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -191,7 +191,7 @@
       "publicTitle": "Rechte eines unangemeldeten Nutzers",
       "filterPlaceholder": "Archive filtern",
       "systemPermissions": "System-Rechte",
-      "withoutArchive": "Ohne Archiv",
+      "withoutArchive": "Bilder ohne Archivzuordnung",
       "reallyGrantAllPermissions": "Wirklich alle Rechte aus \"{{header}}\" vergeben?",
       "reallyRemoveAllPermissions": "Wirklich alle Rechte aus \"{{header}}\" entziehen?",
       "reallyEditAllPermissionsContent": "Sie können dies nicht rückgängig machen, sondern müssen den vorigen Stand manuell wiederherstellen.",

From acd3a56b022199311d93d1730b00c90b0dff714e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 13:44:10 +0200
Subject: [PATCH 13/31] Clarify getUser and updateUser translations

---
 projects/bp-gallery/src/shared/locales/de.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index 91aa0c882..9b4a3ef42 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -244,8 +244,8 @@
         "addPermission": "Recht vergeben",
         "getParameterizedPermissions": "Rechte ansehen",
         "deleteParameterizedPermission": "Recht entziehen",
-        "getUser": "Nutzer-Daten ansehen",
-        "updateUser": "Nutzer-Daten bearbeiten",
+        "getUser": "Alle Nutzer-Daten ansehen",
+        "updateUser": "Alle Nutzer-Daten bearbeiten",
         "getUsers": "Liste aller Nutzer sehen",
         "login": "Sich anmelden",
         "removeUser": "Nutzer löschen"

From d0850ac9eba65d3a330df425d093903a68e93ef4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 14:35:52 +0200
Subject: [PATCH 14/31] Split off updateCollectionParents from updateCollection

---
 .../collection-curating/AddCollectionMenu.tsx |  20 ++--
 .../collection-curating/CollectionsPanel.tsx  |  18 +--
 .../UnlinkCollectionAction.tsx                |  28 +++--
 .../bp-gallery/src/graphql/APIConnector.tsx   | 111 ++++++++++++++++++
 .../bp-gallery/src/graphql/operation.graphql  |   1 +
 projects/bp-gallery/src/hooks/can-do-hooks.ts |  10 +-
 .../bp-gallery/src/shared/locales/de.json     |   1 +
 projects/bp-graphql/src/operations.ts         |   1 +
 .../src/operations/updateCollectionParents.ts |  17 +++
 9 files changed, 175 insertions(+), 32 deletions(-)
 create mode 100644 projects/bp-graphql/src/operations/updateCollectionParents.ts

diff --git a/projects/bp-gallery/src/components/views/collection-curating/AddCollectionMenu.tsx b/projects/bp-gallery/src/components/views/collection-curating/AddCollectionMenu.tsx
index 35e3fdfbc..fcbde31c5 100644
--- a/projects/bp-gallery/src/components/views/collection-curating/AddCollectionMenu.tsx
+++ b/projects/bp-gallery/src/components/views/collection-curating/AddCollectionMenu.tsx
@@ -4,9 +4,9 @@ import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
   useCanRunCreateSubCollectionMutation,
-  useCanRunUpdateCollectionMutation,
+  useCanRunUpdateCollectionParentsMutation,
   useCreateSubCollectionMutation,
-  useUpdateCollectionMutation,
+  useUpdateCollectionParentsMutation,
 } from '../../../graphql/APIConnector';
 import { FlatCollection } from '../../../types/additionalFlatTypes';
 import { DialogPreset, useDialog } from '../../provider/DialogProvider';
@@ -25,10 +25,10 @@ const AddCollectionMenu = ({
 
   const open = Boolean(anchorEl);
 
-  const [updateCollection] = useUpdateCollectionMutation({
+  const [updateCollectionParents] = useUpdateCollectionParentsMutation({
     refetchQueries: ['getCollectionInfoById', 'getAllCollections'],
   });
-  const { canRun: canUpdateCollection } = useCanRunUpdateCollectionMutation();
+  const { canRun: canUpdateCollectionParents } = useCanRunUpdateCollectionParentsMutation();
 
   const [createSubCollection] = useCreateSubCollectionMutation({
     refetchQueries: ['getCollectionInfoById', 'getAllCollections'],
@@ -73,18 +73,16 @@ const AddCollectionMenu = ({
           }
           const parents = moveCollection ? [] : originalParents.map(c => c.id);
           parents.push(parentCollectionId);
-          updateCollection({
+          updateCollectionParents({
             variables: {
               collectionId: selectedCollection.id,
-              data: {
-                parent_collections: parents,
-              },
+              parentCollectionIds: parents,
             },
           });
         }
       });
     },
-    [updateCollection, parentCollectionId, dialog, t]
+    [updateCollectionParents, parentCollectionId, dialog, t]
   );
 
   return (
@@ -97,7 +95,7 @@ const AddCollectionMenu = ({
           <ListItemText>{t('curator.createCollection')}</ListItemText>
         </MenuItem>
       )}
-      {canUpdateCollection && (
+      {canUpdateCollectionParents && (
         <MenuItem onClick={() => onLinkOrMoveSubcollection(false)}>
           <ListItemIcon>
             <Link />
@@ -105,7 +103,7 @@ const AddCollectionMenu = ({
           <ListItemText>{t('curator.linkCollection')}</ListItemText>
         </MenuItem>
       )}
-      {canUpdateCollection && (
+      {canUpdateCollectionParents && (
         <MenuItem onClick={() => onLinkOrMoveSubcollection(true)}>
           <ListItemIcon>
             <MoveDown />
diff --git a/projects/bp-gallery/src/components/views/collection-curating/CollectionsPanel.tsx b/projects/bp-gallery/src/components/views/collection-curating/CollectionsPanel.tsx
index 51a065fd5..6ac33c61d 100644
--- a/projects/bp-gallery/src/components/views/collection-curating/CollectionsPanel.tsx
+++ b/projects/bp-gallery/src/components/views/collection-curating/CollectionsPanel.tsx
@@ -7,6 +7,7 @@ import {
   useCanRunDeleteCollectionMutation,
   useCanRunMergeCollectionsMutation,
   useCanRunUpdateCollectionMutation,
+  useCanRunUpdateCollectionParentsMutation,
   useDeleteCollectionMutation,
   useGetCollectionInfoByIdQuery,
   useMergeCollectionsMutation,
@@ -54,6 +55,7 @@ const CollectionsPanel = ({
   });
   const { canRun: canMergeCollections } = useCanRunMergeCollectionsMutation();
 
+  const { canRun: canUpdateCollectionParents } = useCanRunUpdateCollectionParentsMutation();
   const { canRun: canCreateSubCollection } = useCanRunCreateSubCollectionMutation();
 
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
@@ -152,14 +154,12 @@ const CollectionsPanel = ({
               key={child.id}
               onClick={() => selectChild(child)}
             >
-              {canUpdateCollection &&
-                (child.parent_collections?.length ?? 0) > 1 &&
-                parentCollection && (
-                  <UnlinkCollectionAction
-                    childCollection={child}
-                    parentCollection={parentCollection}
-                  />
-                )}
+              {(child.parent_collections?.length ?? 0) > 1 && parentCollection && (
+                <UnlinkCollectionAction
+                  childCollection={child}
+                  parentCollection={parentCollection}
+                />
+              )}
               <span className='text'>{child.name}</span>
               <span className='actions'>
                 {canUpdateCollection && (
@@ -206,7 +206,7 @@ const CollectionsPanel = ({
             </div>
           );
         })}
-        {(canUpdateCollection || canCreateSubCollection) && (
+        {(canUpdateCollectionParents || canCreateSubCollection) && (
           <>
             <div
               className='panel-entry new'
diff --git a/projects/bp-gallery/src/components/views/collection-curating/UnlinkCollectionAction.tsx b/projects/bp-gallery/src/components/views/collection-curating/UnlinkCollectionAction.tsx
index 9d46bbcef..a0c8a626a 100644
--- a/projects/bp-gallery/src/components/views/collection-curating/UnlinkCollectionAction.tsx
+++ b/projects/bp-gallery/src/components/views/collection-curating/UnlinkCollectionAction.tsx
@@ -2,7 +2,10 @@ import { Link } from '@mui/icons-material';
 import { Tooltip } from '@mui/material';
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useUpdateCollectionMutation } from '../../../graphql/APIConnector';
+import {
+  useCanRunUpdateCollectionParentsMutation,
+  useUpdateCollectionParentsMutation,
+} from '../../../graphql/APIConnector';
 import { FlatCollection } from '../../../types/additionalFlatTypes';
 import { DialogPreset, useDialog } from '../../provider/DialogProvider';
 
@@ -15,9 +18,10 @@ const UnlinkCollectionAction = ({
 }) => {
   const { t } = useTranslation();
   const dialog = useDialog();
-  const [updateCollection] = useUpdateCollectionMutation({
+  const [updateCollectionParents] = useUpdateCollectionParentsMutation({
     refetchQueries: ['getCollectionInfoById', 'getAllCollections'],
   });
+  const { canRun: canUpdateCollectionParents } = useCanRunUpdateCollectionParentsMutation();
 
   const onUnlinkChildCollection = useCallback(
     (collection: FlatCollection) => {
@@ -34,17 +38,15 @@ const UnlinkCollectionAction = ({
         const newParents = (collection.parent_collections?.map(p => p.id) ?? []).filter(
           id => id !== parentCollection.id
         );
-        updateCollection({
+        updateCollectionParents({
           variables: {
             collectionId: collection.id,
-            data: {
-              parent_collections: newParents,
-            },
+            parentCollectionIds: newParents,
           },
         });
       });
     },
-    [parentCollection, dialog, t, updateCollection]
+    [parentCollection, dialog, t, updateCollectionParents]
   );
 
   return (
@@ -60,10 +62,14 @@ const UnlinkCollectionAction = ({
     >
       <span
         className='link-indicator'
-        onClick={event => {
-          event.stopPropagation();
-          onUnlinkChildCollection(childCollection);
-        }}
+        onClick={
+          canUpdateCollectionParents
+            ? event => {
+                event.stopPropagation();
+                onUnlinkChildCollection(childCollection);
+              }
+            : undefined
+        }
       >
         <Link />
         <span>{childCollection.parent_collections?.length}</span>
diff --git a/projects/bp-gallery/src/graphql/APIConnector.tsx b/projects/bp-gallery/src/graphql/APIConnector.tsx
index dc6392df0..8568c2448 100644
--- a/projects/bp-gallery/src/graphql/APIConnector.tsx
+++ b/projects/bp-gallery/src/graphql/APIConnector.tsx
@@ -4304,6 +4304,15 @@ export type UpdateCollectionMutation = {
   updateCollection?: { data?: { id?: string | null } | null } | null;
 };
 
+export type UpdateCollectionParentsMutationVariables = Exact<{
+  collectionId: Scalars['ID'];
+  parentCollectionIds: Array<InputMaybe<Scalars['ID']>> | InputMaybe<Scalars['ID']>;
+}>;
+
+export type UpdateCollectionParentsMutation = {
+  updateCollection?: { data?: { id?: string | null } | null } | null;
+};
+
 export type UpdateExhibitionMutationVariables = Exact<{
   id: Scalars['ID'];
   data: ExhibitionInput;
@@ -10528,6 +10537,64 @@ export type UpdateCollectionMutationOptions = Apollo.BaseMutationOptions<
   UpdateCollectionMutationVariables
 >;
 
+export const UpdateCollectionParentsDocument = gql`
+  mutation updateCollectionParents($collectionId: ID!, $parentCollectionIds: [ID]!) {
+    updateCollection(id: $collectionId, data: { parent_collections: $parentCollectionIds }) {
+      data {
+        id
+      }
+    }
+  }
+`;
+
+export type UpdateCollectionParentsMutationFn = Apollo.MutationFunction<
+  UpdateCollectionParentsMutation,
+  UpdateCollectionParentsMutationVariables
+>;
+
+/**
+ * __useUpdateCollectionParentsMutation__
+ *
+ * To run a mutation, you first call `useUpdateCollectionParentsMutation` within a React component and pass it any options that fit your needs.
+ * When your component renders, `useUpdateCollectionParentsMutation` returns a tuple that includes:
+ * - A mutate function that you can call at any time to execute the mutation
+ * - An object with fields that represent the current status of the mutation's execution
+ *
+ * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
+ *
+ * @example
+ * const [updateCollectionParentsMutation, { data, loading, error }] = useUpdateCollectionParentsMutation({
+ *   variables: {
+ *      collectionId: // value for 'collectionId'
+ *      parentCollectionIds: // value for 'parentCollectionIds'
+ *   },
+ * });
+ */
+export function useUpdateCollectionParentsMutation(
+  baseOptions?: Apollo.MutationHookOptions<
+    UpdateCollectionParentsMutation,
+    UpdateCollectionParentsMutationVariables
+  >
+) {
+  const options = { ...defaultOptions, ...baseOptions };
+  return Apollo.useMutation<
+    UpdateCollectionParentsMutation,
+    UpdateCollectionParentsMutationVariables
+  >(UpdateCollectionParentsDocument, options);
+}
+
+export type UpdateCollectionParentsMutationHookResult = ReturnType<
+  typeof useUpdateCollectionParentsMutation
+>;
+
+export type UpdateCollectionParentsMutationResult =
+  Apollo.MutationResult<UpdateCollectionParentsMutation>;
+
+export type UpdateCollectionParentsMutationOptions = Apollo.BaseMutationOptions<
+  UpdateCollectionParentsMutation,
+  UpdateCollectionParentsMutationVariables
+>;
+
 export const UpdateExhibitionDocument = gql`
   mutation updateExhibition($id: ID!, $data: ExhibitionInput!) {
     updateExhibition(id: $id, data: $data) {
@@ -15661,6 +15728,50 @@ export function useCanRunMultipleUpdateCollectionMutations(
   };
 }
 
+export function useCanRunUpdateCollectionParentsMutation(
+  options?: Omit<
+    Apollo.QueryHookOptions<CanRunOperationQuery, CanRunOperationQueryVariables>,
+    'variables'
+  > & {
+    variables?: Partial<UpdateCollectionParentsMutationVariables>;
+    withSomeVariables?: boolean;
+  }
+) {
+  const { data, loading, refetch } = useCanRunOperationQuery({
+    ...options,
+    variables: {
+      operation: UpdateCollectionParentsDocument.loc?.source.body ?? '',
+      variableSets: [options?.variables ?? {}],
+      withSomeVariables: options?.withSomeVariables,
+    },
+  });
+  useAuthChangeEffect(refetch);
+  return { canRun: data?.canRunOperation?.[0] ?? (loading ? false : true), loading };
+}
+
+export function useCanRunMultipleUpdateCollectionParentsMutations(
+  options: Omit<
+    Apollo.QueryHookOptions<CanRunOperationQuery, CanRunOperationQueryVariables>,
+    'variables'
+  > & {
+    variableSets: Partial<UpdateCollectionParentsMutationVariables>[];
+  }
+) {
+  const { data, loading, refetch } = useCanRunOperationQuery({
+    ...options,
+    variables: {
+      operation: UpdateCollectionParentsDocument.loc?.source.body ?? '',
+      variableSets: options.variableSets,
+    },
+  });
+  useAuthChangeEffect(refetch);
+  return {
+    canRunMultiple:
+      data?.canRunOperation ?? options.variableSets.map(_ => (loading ? false : true)),
+    loading,
+  };
+}
+
 export function useCanRunUpdateExhibitionMutation(
   options?: Omit<
     Apollo.QueryHookOptions<CanRunOperationQuery, CanRunOperationQueryVariables>,
diff --git a/projects/bp-gallery/src/graphql/operation.graphql b/projects/bp-gallery/src/graphql/operation.graphql
index da76da45b..fdab84ed8 100644
--- a/projects/bp-gallery/src/graphql/operation.graphql
+++ b/projects/bp-gallery/src/graphql/operation.graphql
@@ -86,6 +86,7 @@ mutation unpinComment($commentId: ID!) { updateComment(id: $commentId data: { pi
 mutation unpublishPicture($id: ID!) { updatePicture(id: $id data: { publishedAt: null }) { data { id } } }
 mutation updateArchive($archiveId: ID! $data: ArchiveTagInput!) { updateArchiveTag(id: $archiveId data: $data) { data { id } } }
 mutation updateCollection($collectionId: ID! $data: CollectionInput!) { updateCollection(id: $collectionId data: $data) { data { id } } }
+mutation updateCollectionParents($collectionId: ID! $parentCollectionIds: [ID]!) { updateCollection(id: $collectionId data: { parent_collections: $parentCollectionIds }) { data { id } } }
 mutation updateExhibition($id: ID! $data: ExhibitionInput!) { updateExhibition(id: $id data: $data) { data { id } } }
 mutation updateExhibitionPicture($id: ID! $data: ExhibitionPictureInput!) { updateExhibitionPicture(id: $id data: $data) { data { id } } }
 mutation updateExhibitionSection( $id: ID! $title: String $text: String $order: Int $exhibitionPictureIds: [ID] ) { updateExhibitionSection( id: $id data: { title: $title text: $text exhibition_pictures: $exhibitionPictureIds order: $order } ) { data { id } } }
diff --git a/projects/bp-gallery/src/hooks/can-do-hooks.ts b/projects/bp-gallery/src/hooks/can-do-hooks.ts
index 702609211..23ce936a5 100644
--- a/projects/bp-gallery/src/hooks/can-do-hooks.ts
+++ b/projects/bp-gallery/src/hooks/can-do-hooks.ts
@@ -36,6 +36,7 @@ import {
   useCanRunRemoveUserMutation,
   useCanRunUpdateArchiveMutation,
   useCanRunUpdateCollectionMutation,
+  useCanRunUpdateCollectionParentsMutation,
   useCanRunUpdateExhibitionMutation,
   useCanRunUpdatePictureMutation,
   useCanRunUpdateUserMutation,
@@ -254,6 +255,8 @@ export const useCanUseCollectionCuratingView = () => {
 
   const { canRun: canUpdateCollection, loading: canUpdateCollectionLoading } =
     useCanRunUpdateCollectionMutation();
+  const { canRun: canUpdateCollectionParents, loading: canUpdateCollectionParentsLoading } =
+    useCanRunUpdateCollectionParentsMutation();
   const { canRun: canDeleteCollection, loading: canDeleteCollectionLoading } =
     useCanRunDeleteCollectionMutation();
   const { canRun: canMergeCollections, loading: canMergeCollectionsLoading } =
@@ -265,11 +268,16 @@ export const useCanUseCollectionCuratingView = () => {
     canUseCollectionCuratingView:
       canGetRootCollection &&
       canGetCollectionInfoById &&
-      (canUpdateCollection || canDeleteCollection || canMergeCollections || canCreateSubCollection),
+      (canUpdateCollection ||
+        canUpdateCollectionParents ||
+        canDeleteCollection ||
+        canMergeCollections ||
+        canCreateSubCollection),
     loading:
       canGetRootCollectionLoading ||
       canGetCollectionInfoByIdLoading ||
       canUpdateCollectionLoading ||
+      canUpdateCollectionParentsLoading ||
       canDeleteCollectionLoading ||
       canMergeCollectionsLoading ||
       canCreateSubCollectionLoading,
diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index 9b4a3ef42..244920edb 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -219,6 +219,7 @@
         "mergeCollections": "Collections zusammenführen",
         "setPicturesForCollection": "Bilder in einer Collection verwalten",
         "updateCollection": "Collection-Eigenschaften bearbeiten",
+        "updateCollectionParents": "Collection-Hierarchie verwalten",
         "createTag": "Tag anlegen",
         "deleteTag": "Tag löschen",
         "getAllTags": "Liste aller Tags ansehen",
diff --git a/projects/bp-graphql/src/operations.ts b/projects/bp-graphql/src/operations.ts
index 116289a88..eb8f7e643 100644
--- a/projects/bp-graphql/src/operations.ts
+++ b/projects/bp-graphql/src/operations.ts
@@ -86,6 +86,7 @@ export { default as unpinComment } from './operations/unpinComment.js';
 export { default as unpublishPicture } from './operations/unpublishPicture.js';
 export { default as updateArchive } from './operations/updateArchive.js';
 export { default as updateCollection } from './operations/updateCollection.js';
+export { default as updateCollectionParents } from './operations/updateCollectionParents.js';
 export { default as updateExhibition } from './operations/updateExhibition.js';
 export { default as updateExhibitionPicture } from './operations/updateExhibitionPicture.js';
 export { default as updateExhibitionSection } from './operations/updateExhibitionSection.js';
diff --git a/projects/bp-graphql/src/operations/updateCollectionParents.ts b/projects/bp-graphql/src/operations/updateCollectionParents.ts
new file mode 100644
index 000000000..010d1015d
--- /dev/null
+++ b/projects/bp-graphql/src/operations/updateCollectionParents.ts
@@ -0,0 +1,17 @@
+import { Operation, graphql } from '../Operation.js';
+import { always } from '../isAllowedHelpers.js';
+
+export default {
+  section: 'collection',
+  needsParameters: [],
+  isAllowed: always,
+  document: graphql`
+    mutation updateCollectionParents($collectionId: ID!, $parentCollectionIds: [ID]!) {
+      updateCollection(id: $collectionId, data: { parent_collections: $parentCollectionIds }) {
+        data {
+          id
+        }
+      }
+    }
+  `,
+} satisfies Operation;

From 7337cf73115ed2b124dcba1615056622d94b3d4f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 15:01:41 +0200
Subject: [PATCH 15/31] Adapt ListItemButtons for users according to
 permissions

---
 .../components/views/admin/user/UsersView.tsx | 41 ++++++++++++++-----
 1 file changed, 30 insertions(+), 11 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx b/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx
index c60bde872..75faca7b5 100644
--- a/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx
@@ -1,11 +1,16 @@
-import { Edit } from '@mui/icons-material';
+import { ChevronRight, Edit } from '@mui/icons-material';
 import { List, ListItemButton, ListItemIcon, ListItemText } from '@mui/material';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useGetUsersQuery } from '../../../../graphql/APIConnector';
+import {
+  useCanRunGetUserQuery,
+  useCanRunUpdateUserMutation,
+  useGetUsersQuery,
+} from '../../../../graphql/APIConnector';
 import { useSimplifiedQueryResponseData } from '../../../../graphql/queryUtils';
 import { useVisit } from '../../../../helpers/history';
 import { useCanUseUsersView } from '../../../../hooks/can-do-hooks';
+import { useAuth } from '../../../../hooks/context-hooks';
 import { FlatUsersPermissionsUser } from '../../../../types/additionalFlatTypes';
 import Loading from '../../../common/Loading';
 import ProtectedRoute from '../../../common/ProtectedRoute';
@@ -17,13 +22,17 @@ import { PUBLIC_USER_ID } from './helper';
 export const UsersView = () => {
   const { t } = useTranslation();
   const { visit } = useVisit();
+  const { userId } = useAuth();
 
   const { data, error, loading } = useGetUsersQuery();
   const users: FlatUsersPermissionsUser[] | undefined =
     useSimplifiedQueryResponseData(data)?.usersPermissionsUsers;
 
+  const { canRun: canGetUser } = useCanRunGetUserQuery();
+  const { canRun: canUpdateUser } = useCanRunUpdateUserMutation();
+
   const sortedUsers = useMemo(
-    () => (users ? users.slice().sort((a, b) => a.username.localeCompare(b.username)) : undefined),
+    () => (users ? users.sort((a, b) => a.username.localeCompare(b.username)) : undefined),
     [users]
   );
 
@@ -44,14 +53,24 @@ export const UsersView = () => {
                 {[
                   { id: PUBLIC_USER_ID, username: t('admin.users.publicUsername') },
                   ...sortedUsers,
-                ].map(user => (
-                  <ListItemButton key={user.id} onClick={() => visit(`/admin/user/${user.id}`)}>
-                    <ListItemText primary={user.username} />
-                    <ListItemIcon>
-                      <Edit />
-                    </ListItemIcon>
-                  </ListItemButton>
-                ))}
+                ].map(user => {
+                  const isMe = user.id === userId;
+                  const visible = canGetUser || isMe;
+                  const editable = canUpdateUser || isMe;
+                  const path = isMe ? '/my-account' : `/admin/user/${user.id}`;
+                  return (
+                    <ListItemButton
+                      key={user.id}
+                      onClick={visible ? () => visit(path) : undefined}
+                      disabled={!visible}
+                    >
+                      <ListItemText primary={user.username} />
+                      {visible && (
+                        <ListItemIcon>{editable ? <Edit /> : <ChevronRight />}</ListItemIcon>
+                      )}
+                    </ListItemButton>
+                  );
+                })}
               </List>
             </CenteredContainer>
           );

From 341a5050552b28a48ffdc3eec676dc99d29300b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Wed, 5 Jul 2023 15:01:53 +0200
Subject: [PATCH 16/31] Translate error messages in QueryErrorDisplay

---
 .../bp-gallery/src/components/common/QueryErrorDisplay.tsx | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/projects/bp-gallery/src/components/common/QueryErrorDisplay.tsx b/projects/bp-gallery/src/components/common/QueryErrorDisplay.tsx
index 5d9f13a9c..367b730d4 100644
--- a/projects/bp-gallery/src/components/common/QueryErrorDisplay.tsx
+++ b/projects/bp-gallery/src/components/common/QueryErrorDisplay.tsx
@@ -1,10 +1,9 @@
-import { ApolloError } from '@apollo/client';
 import { useTranslation } from 'react-i18next';
-import { translateErrorMessage } from '../../i18n';
+import { errorToTranslatedString } from '../../helpers/app-helpers';
 
-const QueryErrorDisplay = ({ error }: { error: ApolloError }) => {
+const QueryErrorDisplay = ({ error }: { error: unknown }) => {
   const { t } = useTranslation();
-  return <div>{translateErrorMessage(error.message, t)}</div>;
+  return <div>{errorToTranslatedString(error, t)}</div>;
 };
 
 export default QueryErrorDisplay;

From a5beb0a298298ea0fd4b4a3721bd0ee473b4fd4c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Fri, 7 Jul 2023 14:30:16 +0200
Subject: [PATCH 17/31] Default to pictures and texts when logged in

---
 .../components/common/picture-gallery/PictureScrollGrid.tsx  | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx b/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx
index d83b086df..8dc719e86 100644
--- a/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx
+++ b/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { PictureFiltersInput } from '../../../graphql/APIConnector';
 import { useSimplifiedQueryResponseData } from '../../../graphql/queryUtils';
 import { useCachedOnRefetch } from '../../../hooks/cache-on-refetch.hook';
-import { useScroll } from '../../../hooks/context-hooks';
+import { useAuth, useScroll } from '../../../hooks/context-hooks';
 import useGetPictures, {
   NUMBER_OF_PICTURES_LOADED_PER_FETCH,
   TextFilter,
@@ -63,8 +63,9 @@ const PictureScrollGrid = ({
   const [lastScrollHeight, setLastScrollHeight] = useState<number>(0);
   const [isFetching, setIsFetching] = useState<boolean>(false);
 
+  const { loggedIn } = useAuth();
   const [selectedTextFilter, setSelectedTextFilter] = useState(
-    textFilter ?? TextFilter.ONLY_PICTURES
+    textFilter ?? (loggedIn ? TextFilter.PICTURES_AND_TEXTS : TextFilter.ONLY_PICTURES)
   );
 
   const { data, loading, error, fetchMore, refetch } = useGetPictures(

From f8b3c174cf516852be9a16ec59e3eff2db56ee3b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Fri, 7 Jul 2023 15:56:46 +0200
Subject: [PATCH 18/31] Extract PresentationModeButton

---
 .../views/picture/overlay/PictureViewUI.tsx   | 16 ++----------
 .../overlay/PresentationModeButton.tsx        | 25 +++++++++++++++++++
 2 files changed, 27 insertions(+), 14 deletions(-)
 create mode 100644 projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx

diff --git a/projects/bp-gallery/src/components/views/picture/overlay/PictureViewUI.tsx b/projects/bp-gallery/src/components/views/picture/overlay/PictureViewUI.tsx
index 1943e5b50..541974ad2 100644
--- a/projects/bp-gallery/src/components/views/picture/overlay/PictureViewUI.tsx
+++ b/projects/bp-gallery/src/components/views/picture/overlay/PictureViewUI.tsx
@@ -1,8 +1,6 @@
-import { PresentToAll } from '@mui/icons-material';
-import { Button } from '@mui/material';
-import { useTranslation } from 'react-i18next';
 import PictureNavigationButtons from './PictureNavigationButtons';
 import { PictureToolbar } from './PictureToolbar';
+import { PresentationModeButton } from './PresentationModeButton';
 
 export const PictureViewUI = ({
   calledViaLink,
@@ -13,21 +11,11 @@ export const PictureViewUI = ({
   pictureId: string;
   sessionId: string;
 }) => {
-  const { t } = useTranslation();
-
   return (
     <div className='picture-ui'>
       <PictureNavigationButtons />
       <PictureToolbar calledViaLink={calledViaLink} />
-      <Button
-        className='presentation-mode-button'
-        onClick={() => {
-          window.open(`/picture/${pictureId}?presentation=${sessionId}`, '_blank', 'fullscreen=1');
-        }}
-      >
-        <PresentToAll />
-        {t('common.presentationMode')}
-      </Button>
+      <PresentationModeButton pictureId={pictureId} sessionId={sessionId} />
     </div>
   );
 };
diff --git a/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx b/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx
new file mode 100644
index 000000000..22366aa02
--- /dev/null
+++ b/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx
@@ -0,0 +1,25 @@
+import { PresentToAll } from '@mui/icons-material';
+import { Button } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+
+export const PresentationModeButton = ({
+  pictureId,
+  sessionId,
+}: {
+  pictureId: string;
+  sessionId: string;
+}) => {
+  const { t } = useTranslation();
+
+  return (
+    <Button
+      className='presentation-mode-button'
+      onClick={() => {
+        window.open(`/picture/${pictureId}?presentation=${sessionId}`, '_blank', 'fullscreen=1');
+      }}
+    >
+      <PresentToAll />
+      {t('common.presentationMode')}
+    </Button>
+  );
+};

From f4dd938a8711bd8d34f2eea3f7535c928d6193ad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Fri, 7 Jul 2023 15:57:22 +0200
Subject: [PATCH 19/31] Add noDistractionModeStyle to PresentationModeButton

---
 .../views/picture/overlay/PresentationModeButton.tsx         | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx b/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx
index 22366aa02..76c135d5e 100644
--- a/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx
+++ b/projects/bp-gallery/src/components/views/picture/overlay/PresentationModeButton.tsx
@@ -1,6 +1,7 @@
 import { PresentToAll } from '@mui/icons-material';
 import { Button } from '@mui/material';
 import { useTranslation } from 'react-i18next';
+import { useNoDistractionModeStyle } from '../helpers/no-distraction-mode-style';
 
 export const PresentationModeButton = ({
   pictureId,
@@ -11,9 +12,11 @@ export const PresentationModeButton = ({
 }) => {
   const { t } = useTranslation();
 
+  const noDistractionModeStyle = useNoDistractionModeStyle();
+
   return (
     <Button
-      className='presentation-mode-button'
+      className={`presentation-mode-button ${noDistractionModeStyle}`}
       onClick={() => {
         window.open(`/picture/${pictureId}?presentation=${sessionId}`, '_blank', 'fullscreen=1');
       }}

From 2edaa3e2386dc4dc2bfc88bfbcc0b798d3e86105 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 12:54:14 +0200
Subject: [PATCH 20/31] Batch addPermission and deleteParameterizedPermission

This is to mitigate a bug/behavior with refetchQueries, where
getParameterizedPermissions is refetched when the first mutation comes
back, but the refetch triggered by later mutations somehow does not run.
Batching the mutations solves this problem, since the refetch can only
start after all of the mutations have come back, which they can only do
together, since they are a batch (currently, there are never more than
50 mutations run at the same time). It also reduces network load as a
side benefit.
---
 projects/bp-gallery/src/helpers/app-helpers.ts | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/projects/bp-gallery/src/helpers/app-helpers.ts b/projects/bp-gallery/src/helpers/app-helpers.ts
index 59e23ad21..03016bb86 100644
--- a/projects/bp-gallery/src/helpers/app-helpers.ts
+++ b/projects/bp-gallery/src/helpers/app-helpers.ts
@@ -2,7 +2,11 @@ import { ApolloLink, from } from '@apollo/client';
 import { BatchHttpLink } from '@apollo/client/link/batch-http';
 import { onError as createErrorLink } from '@apollo/client/link/error';
 import { createUploadLink } from 'apollo-upload-client';
-import { canRunOperation } from 'bp-graphql/build/operations';
+import {
+  addPermission,
+  canRunOperation,
+  deleteParameterizedPermission,
+} from 'bp-graphql/build/operations';
 import { extractFiles } from 'extract-files';
 import { Maybe } from 'graphql/jsutils/Maybe';
 import { TFunction } from 'i18next';
@@ -130,7 +134,9 @@ export const buildHttpLink = (
         : {}),
     },
   };
-  const batchedOperationNames = [canRunOperation].map(operation => operation.document.name);
+  const batchedOperationNames = [canRunOperation, addPermission, deleteParameterizedPermission].map(
+    operation => operation.document.name
+  );
   let httpLink = ApolloLink.split(
     operation =>
       !batchedOperationNames.includes(operation.operationName) ||

From 8d1e6fbd279c3e75d9d183c5a98e56d5a7b4ea1f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 13:14:57 +0200
Subject: [PATCH 21/31] Manually refetch permissions

This is the second part of the fix for the problem described in the
previous commit. Batching alone does not help when BooleanParameters
change, since they rely on the correct order of delete and add, so the
refetch triggered by the delete overshadows the refetch triggered by the
add. Refetching manually solves this problem, since a refetch is only
triggered after a logical action is completed.

Batching is kept for the network load aspect.
---
 .../views/admin/user/PermissionsView.tsx      | 68 +++++++++++--------
 .../user/permissions/BooleanParamater.tsx     | 17 ++++-
 2 files changed, 53 insertions(+), 32 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index 388f72b86..a6485af09 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -63,6 +63,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
     data: permissionsData,
     loading: permissionsLoading,
     error: permissionsError,
+    refetch: refetchPermissions,
   } = useGetParameterizedPermissionsQuery({
     variables: {
       userId: parsedUserId,
@@ -109,12 +110,8 @@ const PermissionsView = ({ userId }: { userId: string }) => {
   const archives: FlatArchiveTag[] | undefined =
     useSimplifiedQueryResponseData(archivesData)?.archiveTags;
 
-  const [createPermission] = useAddPermissionMutation({
-    refetchQueries: ['getParameterizedPermissions'],
-  });
-  const [deletePermission] = useDeleteParameterizedPermissionMutation({
-    refetchQueries: ['getParameterizedPermissions'],
-  });
+  const [createPermission] = useAddPermissionMutation();
+  const [deletePermission] = useDeleteParameterizedPermissionMutation();
 
   const loading = userLoading || permissionsLoading || archivesLoading;
   const error = userError ?? permissionsError ?? archivesError;
@@ -122,8 +119,8 @@ const PermissionsView = ({ userId }: { userId: string }) => {
   const dialog = useDialog();
 
   const addPermission = useCallback(
-    (operation: Operation, { archive_tag, ...parameters }: Parameters) => {
-      createPermission({
+    async (operation: Operation, { archive_tag, ...parameters }: Parameters) => {
+      await createPermission({
         variables: {
           operation_name: operation.document.name,
           user_id: parsedUserId,
@@ -136,15 +133,18 @@ const PermissionsView = ({ userId }: { userId: string }) => {
   );
 
   const addPreset = useCallback(
-    (
+    async (
       operations: { operation: Operation; parameters: ParametersWithoutArchive }[],
       archive: FlatArchiveTag | null
     ) => {
-      for (const { operation, parameters } of operations) {
-        addPermission(operation, { archive_tag: archive ?? undefined, ...parameters });
-      }
+      await Promise.all(
+        operations.map(async ({ operation, parameters }) => {
+          await addPermission(operation, { archive_tag: archive ?? undefined, ...parameters });
+        })
+      );
+      await refetchPermissions();
     },
-    [addPermission]
+    [addPermission, refetchPermissions]
   );
 
   const toggleOperations = useCallback(
@@ -169,24 +169,29 @@ const PermissionsView = ({ userId }: { userId: string }) => {
         }
       }
       if (removeAll) {
-        for (const operation of operations) {
-          const permission = findPermission(operation, archive);
-          if (!permission) {
-            continue;
-          }
-          deletePermission({
-            variables: {
-              id: permission.id,
-            },
-          });
-        }
+        await Promise.all(
+          operations.map(async operation => {
+            const permission = findPermission(operation, archive);
+            if (!permission) {
+              return;
+            }
+            await deletePermission({
+              variables: {
+                id: permission.id,
+              },
+            });
+          })
+        );
       } else {
-        for (const operation of operations) {
-          addPermission(operation, { archive_tag: archive ?? undefined });
-        }
+        await Promise.all(
+          operations.map(async operation => {
+            await addPermission(operation, { archive_tag: archive ?? undefined });
+          })
+        );
       }
+      await refetchPermissions();
     },
-    [dialog, t, findPermission, deletePermission, addPermission]
+    [dialog, t, findPermission, deletePermission, addPermission, refetchPermissions]
   );
 
   const [filter, setFilter] = useState('');
@@ -321,6 +326,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
                             archive={archive}
                             deletePermission={deletePermission}
                             addPermission={addPermission}
+                            refetchPermissions={refetchPermissions}
                           />
                         </div>
                       ))}
@@ -341,6 +347,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
       findPermission,
       addPermission,
       deletePermission,
+      refetchPermissions,
     ]
   );
 
@@ -397,6 +404,7 @@ const ParameterInputs = ({
   archive,
   deletePermission,
   addPermission,
+  refetchPermissions,
 }: {
   group: GroupStructure;
   findPermission: (
@@ -405,7 +413,8 @@ const ParameterInputs = ({
   ) => FlatParameterizedPermission | null;
   archive: FlatArchiveTag | null;
   deletePermission: (parameters: { variables: { id: string } }) => Promise<unknown>;
-  addPermission: (operation: Operation, parameters: Parameters) => void;
+  addPermission: (operation: Operation, parameters: Parameters) => Promise<unknown>;
+  refetchPermissions: () => Promise<unknown>;
 }) => {
   const { t } = useTranslation();
 
@@ -414,6 +423,7 @@ const ParameterInputs = ({
     findPermission,
     addPermission,
     deletePermission,
+    refetchPermissions,
     archive,
   };
 
diff --git a/projects/bp-gallery/src/components/views/admin/user/permissions/BooleanParamater.tsx b/projects/bp-gallery/src/components/views/admin/user/permissions/BooleanParamater.tsx
index 0dcd49521..112da13a8 100644
--- a/projects/bp-gallery/src/components/views/admin/user/permissions/BooleanParamater.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/permissions/BooleanParamater.tsx
@@ -16,6 +16,7 @@ export const BooleanParameter = ({
   findPermission,
   deletePermission,
   addPermission,
+  refetchPermissions,
   falseTitle,
   trueTitle,
 }: {
@@ -27,7 +28,8 @@ export const BooleanParameter = ({
     archive: FlatArchiveTag | null
   ) => FlatParameterizedPermission | null;
   deletePermission: (options: { variables: { id: string } }) => Promise<unknown>;
-  addPermission: (operation: Operation, parameters: Parameters) => void;
+  addPermission: (operation: Operation, parameters: Parameters) => Promise<unknown>;
+  refetchPermissions: () => Promise<unknown>;
   falseTitle: string;
   trueTitle: string;
 }) => {
@@ -43,15 +45,24 @@ export const BooleanParameter = ({
               },
             });
           }
-          addPermission(operation, {
+          await addPermission(operation, {
             archive_tag: archive ?? undefined,
             ...permission,
             [parameter]: Boolean(event.target.value),
           });
+          await refetchPermissions();
         });
       }
     },
-    [operations, findPermission, archive, addPermission, parameter, deletePermission]
+    [
+      operations,
+      findPermission,
+      archive,
+      addPermission,
+      parameter,
+      deletePermission,
+      refetchPermissions,
+    ]
   );
 
   const allTrue = useMemo(

From afca54b4dbf1c1b15a6a2ab5d543c3b736d90fd9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 13:18:15 +0200
Subject: [PATCH 22/31] Extend public preset to basic preset

---
 .../views/admin/user/permissions/presets.ts   | 26 +++++++++++++++++--
 .../bp-gallery/src/shared/locales/de.json     |  2 +-
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/permissions/presets.ts b/projects/bp-gallery/src/components/views/admin/user/permissions/presets.ts
index 4a6937fce..d1e388138 100644
--- a/projects/bp-gallery/src/components/views/admin/user/permissions/presets.ts
+++ b/projects/bp-gallery/src/components/views/admin/user/permissions/presets.ts
@@ -17,7 +17,29 @@ export type Preset = {
 export const presets: Preset[] = [
   {
     type: 'system',
-    name: 'public',
-    permissions: ['login'],
+    name: 'basic',
+    permissions: [
+      'setPicturesForCollection',
+      'getAllCollections',
+      'getAllTags',
+      'createTag',
+      'updateLocationCoordinates',
+      'getUnverifiedComments',
+      'getUser',
+      'getUsers',
+      {
+        name: 'removeUser',
+        parameters: {
+          on_other_users: false,
+        },
+      },
+      {
+        name: 'getParameterizedPermissions',
+        parameters: {
+          on_other_users: false,
+        },
+      },
+      'login',
+    ],
   },
 ];
diff --git a/projects/bp-gallery/src/shared/locales/de.json b/projects/bp-gallery/src/shared/locales/de.json
index eb932fe35..9784468bd 100755
--- a/projects/bp-gallery/src/shared/locales/de.json
+++ b/projects/bp-gallery/src/shared/locales/de.json
@@ -264,7 +264,7 @@
         }
       },
       "preset": {
-        "public": "Allgemeiner Nutzer"
+        "basic": "Basis-Nutzer"
       }
     },
     "user": {

From aa70f94c129d843c3e246d39786a3d07ea9fa2e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 15:00:57 +0200
Subject: [PATCH 23/31] Make section titles toggle accordions instead of
 checkboxes

---
 .../components/views/admin/user/PermissionsView.tsx  |  2 ++
 .../views/admin/user/permissions/Coverage.tsx        | 12 +++++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index a6485af09..3dec80625 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -275,6 +275,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
                 label={summary}
                 prompt
                 toggleOperations={toggleOperations}
+                clickThrough
               />
             </Typography>
           </AccordionSummary>
@@ -304,6 +305,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
                       label={t(`admin.permissions.section.${section.name}`, { context: type })}
                       prompt
                       toggleOperations={toggleOperations}
+                      clickThrough
                     />
                   </AccordionSummary>
                   <AccordionDetails>
diff --git a/projects/bp-gallery/src/components/views/admin/user/permissions/Coverage.tsx b/projects/bp-gallery/src/components/views/admin/user/permissions/Coverage.tsx
index a9c4dd83e..da9e8cf33 100644
--- a/projects/bp-gallery/src/components/views/admin/user/permissions/Coverage.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/permissions/Coverage.tsx
@@ -16,6 +16,7 @@ export const CoverageCheckbox = ({
   label,
   prompt,
   toggleOperations,
+  clickThrough = false,
 }: {
   coverage: Coverage;
   operations: Operation[];
@@ -29,6 +30,7 @@ export const CoverageCheckbox = ({
     header: string,
     prompt?: boolean
   ) => void;
+  clickThrough?: boolean;
 }) => {
   const checked = coverage === Coverage.ALL;
   const indeterminate = coverage === Coverage.SOME;
@@ -44,8 +46,16 @@ export const CoverageCheckbox = ({
 
   return (
     <FormControlLabel
-      control={<Checkbox indeterminate={indeterminate} checked={checked} onChange={onClick} />}
+      control={
+        <Checkbox
+          className={clickThrough ? 'pointer-events-auto' : ''}
+          indeterminate={indeterminate}
+          checked={checked}
+          onChange={onClick}
+        />
+      }
       label={label}
+      className={clickThrough ? 'pointer-events-none' : ''}
     />
   );
 };

From 6083649071c7f94bc4f0ae4a48b297b009c4aae5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 15:04:05 +0200
Subject: [PATCH 24/31] Extract SaveStatus

---
 projects/bp-gallery/src/components/common/SaveStatus.tsx   | 7 +++++++
 .../src/components/views/bulk-edit/BulkEditView.scss       | 4 ----
 .../src/components/views/bulk-edit/BulkEditView.tsx        | 6 +++++-
 .../components/views/picture/sidebar/PictureSidebar.tsx    | 5 ++---
 .../views/picture/sidebar/picture-info/PictureInfo.scss    | 7 -------
 5 files changed, 14 insertions(+), 15 deletions(-)
 create mode 100644 projects/bp-gallery/src/components/common/SaveStatus.tsx

diff --git a/projects/bp-gallery/src/components/common/SaveStatus.tsx b/projects/bp-gallery/src/components/common/SaveStatus.tsx
new file mode 100644
index 000000000..9057fe925
--- /dev/null
+++ b/projects/bp-gallery/src/components/common/SaveStatus.tsx
@@ -0,0 +1,7 @@
+export const SaveStatus = ({ label, className }: { label: string; className?: string }) => {
+  return (
+    <span className={`text-[#5a5a5a] bg-[#e5e5e5] rounded py-2 px-3 ${className ?? ''}`}>
+      {label}
+    </span>
+  );
+};
diff --git a/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.scss b/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.scss
index 2911fe502..57eb7f4d1 100644
--- a/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.scss
+++ b/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.scss
@@ -47,10 +47,6 @@
       padding-top: 20px;
       box-sizing: border-box;
     }
-
-    .save-state {
-      margin-left: auto;
-    }
   }
 
   &-grid-wrapper {
diff --git a/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.tsx b/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.tsx
index edf9d4dad..09824bc9b 100644
--- a/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.tsx
+++ b/projects/bp-gallery/src/components/views/bulk-edit/BulkEditView.tsx
@@ -14,6 +14,7 @@ import { FlatPicture } from '../../../types/additionalFlatTypes';
 import Loading from '../../common/Loading';
 import ProtectedRoute from '../../common/ProtectedRoute';
 import QueryErrorDisplay from '../../common/QueryErrorDisplay';
+import { SaveStatus } from '../../common/SaveStatus';
 import PictureScrollGrid from '../../common/picture-gallery/PictureScrollGrid';
 import { HideStats } from '../../provider/ShowStatsProvider';
 import { PictureToolbar } from '../picture/overlay/PictureToolbar';
@@ -153,7 +154,10 @@ const BulkEditView = ({
                   onSave={onSave}
                   topInfo={(anyFieldTouched, isSaving) => (
                     <div className='curator-ops'>
-                      <span className='save-state'>{saveStatus(anyFieldTouched, isSaving)}</span>
+                      <SaveStatus
+                        className='ml-auto'
+                        label={saveStatus(anyFieldTouched, isSaving)}
+                      />
                     </div>
                   )}
                 />
diff --git a/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx b/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx
index 6fd33fd26..f8b28ec92 100644
--- a/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx
+++ b/projects/bp-gallery/src/components/views/picture/sidebar/PictureSidebar.tsx
@@ -11,6 +11,7 @@ import { useCanEditPicture } from '../../../../hooks/can-do-hooks';
 import { FlatPicture } from '../../../../types/additionalFlatTypes';
 import Loading from '../../../common/Loading';
 import QueryErrorDisplay from '../../../common/QueryErrorDisplay';
+import { SaveStatus } from '../../../common/SaveStatus';
 import { PictureViewContext } from '../PictureView';
 import PictureViewNavigationBar from '../overlay/PictureViewNavigationBar';
 import './PictureSidebar.scss';
@@ -129,9 +130,7 @@ const PictureSidebar = ({
                     </>
                   )}
                   {canUpdatePicture && (
-                    <span className='save-state ml-auto'>
-                      {saveStatus(anyFieldTouched, isSaving)}
-                    </span>
+                    <SaveStatus className='ml-auto' label={saveStatus(anyFieldTouched, isSaving)} />
                   )}
                 </div>
               )
diff --git a/projects/bp-gallery/src/components/views/picture/sidebar/picture-info/PictureInfo.scss b/projects/bp-gallery/src/components/views/picture/sidebar/picture-info/PictureInfo.scss
index 7e1a9f938..73fa9a62c 100644
--- a/projects/bp-gallery/src/components/views/picture/sidebar/picture-info/PictureInfo.scss
+++ b/projects/bp-gallery/src/components/views/picture/sidebar/picture-info/PictureInfo.scss
@@ -24,12 +24,5 @@
     .MuiButton-root {
       flex: 1 1 0;
     }
-
-    .save-state {
-      color: #5a5a5a;
-      background: #e5e5e5;
-      border-radius: 0.25rem;
-      padding: 0.5rem 0.75rem;
-    }
   }
 }

From 484d3014e20ae71c98f303f88a2a781fb7fea373 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 15:04:25 +0200
Subject: [PATCH 25/31] Add SaveStatus to PermissionsView

---
 .../views/admin/CenteredContainer.tsx         |  2 +-
 .../views/admin/user/PermissionsView.tsx      | 66 ++++++++++++-------
 2 files changed, 42 insertions(+), 26 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx b/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx
index f867c904b..410484e19 100644
--- a/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx
+++ b/projects/bp-gallery/src/components/views/admin/CenteredContainer.tsx
@@ -20,7 +20,7 @@ export const CenteredContainer = ({
   }, [titleOnLeftSideOfScreenAfterScroll, scrollPos]);
 
   return (
-    <div className='w-[800px] mx-auto mt-4'>
+    <div className='relative w-[800px] mx-auto mt-4'>
       <h1 className={titleClassName}>{title}</h1>
       {children}
     </div>
diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index 3dec80625..098beadcb 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -1,3 +1,4 @@
+import { NetworkStatus } from '@apollo/client';
 import { ExpandMore, Search } from '@mui/icons-material';
 import {
   Accordion,
@@ -29,6 +30,7 @@ import {
 import Loading from '../../../common/Loading';
 import ProtectedRoute from '../../../common/ProtectedRoute';
 import QueryErrorDisplay from '../../../common/QueryErrorDisplay';
+import { SaveStatus } from '../../../common/SaveStatus';
 import { DialogPreset, useDialog } from '../../../provider/DialogProvider';
 import { FALLBACK_PATH } from '../../../routes';
 import { CenteredContainer } from '../CenteredContainer';
@@ -61,14 +63,17 @@ const PermissionsView = ({ userId }: { userId: string }) => {
 
   const {
     data: permissionsData,
-    loading: permissionsLoading,
+    loading: rawPermissionsLoading,
     error: permissionsError,
     refetch: refetchPermissions,
+    networkStatus,
   } = useGetParameterizedPermissionsQuery({
     variables: {
       userId: parsedUserId,
     },
+    notifyOnNetworkStatusChange: true,
   });
+  const permissionsLoading = rawPermissionsLoading && networkStatus !== NetworkStatus.refetch;
   const permissions: FlatParameterizedPermission[] | undefined =
     useSimplifiedQueryResponseData(permissionsData)?.parameterizedPermissions;
 
@@ -110,8 +115,12 @@ const PermissionsView = ({ userId }: { userId: string }) => {
   const archives: FlatArchiveTag[] | undefined =
     useSimplifiedQueryResponseData(archivesData)?.archiveTags;
 
-  const [createPermission] = useAddPermissionMutation();
-  const [deletePermission] = useDeleteParameterizedPermissionMutation();
+  const [createPermission, { loading: createPermissionLoading }] = useAddPermissionMutation();
+  const [deletePermission, { loading: deletePermissionLoading }] =
+    useDeleteParameterizedPermissionMutation();
+
+  const working =
+    createPermissionLoading || deletePermissionLoading || networkStatus === NetworkStatus.refetch;
 
   const loading = userLoading || permissionsLoading || archivesLoading;
   const error = userError ?? permissionsError ?? archivesError;
@@ -365,30 +374,37 @@ const PermissionsView = ({ userId }: { userId: string }) => {
           return <Loading />;
         } else if (permissionLookup && archives) {
           return (
-            <CenteredContainer
-              title={
-                isPublic
-                  ? t('admin.permissions.publicTitle')
-                  : t('admin.permissions.title', { userName: user?.username })
-              }
-              titleOnLeftSideOfScreenAfterScroll
-            >
-              <div className='mb-2'>
-                <TextField
-                  fullWidth
-                  value={filter}
-                  onChange={onFilterChange}
-                  placeholder={t('admin.permissions.filterPlaceholder')}
-                  variant='outlined'
-                  InputProps={{
-                    endAdornment: <Search />,
-                  }}
+            <>
+              <CenteredContainer
+                title={
+                  isPublic
+                    ? t('admin.permissions.publicTitle')
+                    : t('admin.permissions.title', { userName: user?.username })
+                }
+                titleOnLeftSideOfScreenAfterScroll
+              >
+                <div className='mb-2'>
+                  <TextField
+                    fullWidth
+                    value={filter}
+                    onChange={onFilterChange}
+                    placeholder={t('admin.permissions.filterPlaceholder')}
+                    variant='outlined'
+                    InputProps={{
+                      endAdornment: <Search />,
+                    }}
+                  />
+                </div>
+                {renderSections('system')}
+                {renderSections('archive', null)}
+                {archives.map(archive => renderSections('archive', archive))}
+              </CenteredContainer>
+              <div className='absolute right-5 top-[6.75rem]'>
+                <SaveStatus
+                  label={t(working ? 'curator.saveStatus.saving' : 'curator.saveStatus.saved')}
                 />
               </div>
-              {renderSections('system')}
-              {renderSections('archive', null)}
-              {archives.map(archive => renderSections('archive', archive))}
-            </CenteredContainer>
+            </>
           );
         } else {
           return <Redirect to={FALLBACK_PATH} />;

From b39157b84dde6a649005f421eaf12d1deddcc649 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 16:57:24 +0200
Subject: [PATCH 26/31] Fix tests

---
 .../bp-gallery/cypress/e2e/bulk-edit.cy.ts     |  4 ++--
 .../cypress/e2e/bulk-edit/collections.cy.ts    | 12 ++++++------
 .../cypress/e2e/bulk-edit/dates.cy.ts          |  6 +++---
 .../cypress/e2e/bulk-edit/descriptions.cy.ts   |  4 ++--
 .../cypress/e2e/bulk-edit/keyword-tags.cy.ts   |  8 ++++----
 .../cypress/e2e/bulk-edit/location-tags.cy.ts  |  8 ++++----
 .../cypress/e2e/bulk-edit/person-tags.cy.ts    |  8 ++++----
 projects/bp-gallery/cypress/e2e/facetags.cy.ts |  4 ++--
 projects/bp-gallery/cypress/e2e/helper.ts      |  2 +-
 .../e2e/picture_uploading_and_tagging.cy.ts    | 18 +++++++++---------
 .../src/components/common/SaveStatus.tsx       |  5 ++++-
 11 files changed, 41 insertions(+), 38 deletions(-)

diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit.cy.ts
index 74a40cf56..f68beb05e 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit.cy.ts
@@ -24,9 +24,9 @@ describe('bulk edit', () => {
     bulkEdit();
     cy.contains('.picture-info-field', 'Personen').find('input').type('Simon');
     cy.contains('Simon Heraldson').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('.MuiChip-root', 'Simon Heraldson').find('[data-testid="CancelIcon"]').click(); // cleanup
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Zurück').click();
     cy.get('.picture-preview .adornment [data-testid="CheckBoxIcon"]').should('not.exist');
   });
diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit/collections.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit/collections.cy.ts
index 27b9fb611..e392c79cf 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit/collections.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit/collections.cy.ts
@@ -29,7 +29,7 @@ describe('bulk edit collections', () => {
     // create a picture without collections
     cy.visit('/picture/1');
     cy.contains('.MuiChip-root', 'Top-Level collection').find('[data-testid="CancelIcon"]').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
 
     cy.visit('/picture/3');
     cy.contains('Collection 1');
@@ -48,7 +48,7 @@ describe('bulk edit collections', () => {
     cy.contains('.picture-info-field', 'Collections')
       .find('input')
       .type('Top-Level collection{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
   });
 
   it('adds new collections while keeping old ones', () => {
@@ -62,7 +62,7 @@ describe('bulk edit collections', () => {
     selectPictures('2', '1');
     bulkEdit();
     cy.contains('.picture-info-field', 'Collections').find('input').type('Collection 2{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Collection 2');
     cy.visit('/picture/2');
     cy.contains('Collection 1');
@@ -77,7 +77,7 @@ describe('bulk edit collections', () => {
     selectPictures('2', '1');
     bulkEdit();
     cy.contains('.MuiChip-root', 'Collection 2').find('[data-testid="CancelIcon"]').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Collection 1').should('not.exist');
     cy.contains('Collection 2').should('not.exist');
     cy.visit('/picture/2');
@@ -100,7 +100,7 @@ describe('bulk edit collections', () => {
     bulkEdit();
     cy.contains('.picture-info-field', 'Collections').find('input').type('Collection 2');
     cy.get('.MuiAutocomplete-popper').contains('Collection 2').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Collection 1');
     cy.contains('Collection 2');
     cy.visit('/picture/3');
@@ -112,7 +112,7 @@ describe('bulk edit collections', () => {
     // cleanup
     cy.get('[data-testid="CancelIcon"]'); // wait for auth
     cy.contains('.MuiChip-root', 'Collection 2').find('[data-testid="CancelIcon"]').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Collection 1');
     cy.contains('Collection 2').should('not.exist');
   });
diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit/dates.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit/dates.cy.ts
index e537592b9..cb7fec3ef 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit/dates.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit/dates.cy.ts
@@ -34,14 +34,14 @@ describe('bulk edit dates', () => {
     cy.contains('Keine Zeit bekannt').click();
     cy.get('.rdrDateInput').eq(0).clear();
     cy.get('.rdrDateInput').eq(0).type('20.04.1969{enter}{esc}');
-    cy.contains('.save-state', 'Gespeichert.');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert.');
     cy.visit('/picture/5');
     waitForCuratorPictureInfo();
     cy.contains('20.04.1969').click();
     // cleanup
     cy.get('.rdrDateInput').eq(0).clear();
     cy.get('.rdrDateInput').eq(0).type('01.04.1970{enter}{esc}');
-    cy.contains('.save-state', 'Gespeichert.');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert.');
     cy.contains('01.04.1970');
 
     cy.visit('/picture/1');
@@ -52,7 +52,7 @@ describe('bulk edit dates', () => {
     cy.get('.rdrDateInput').eq(0).type('01.01.1961{enter}');
     cy.get('.rdrDateInput').eq(1).clear();
     cy.get('.rdrDateInput').eq(1).type('31.01.2022{enter}{esc}');
-    cy.contains('.save-state', 'Gespeichert.');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert.');
     cy.contains('01.01.1961 - 31.01.2022');
   });
 });
diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit/descriptions.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit/descriptions.cy.ts
index f29c7fd77..8ebeff0a7 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit/descriptions.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit/descriptions.cy.ts
@@ -68,7 +68,7 @@ describe('bulk edit descriptions', () => {
       .find('.jodit-wysiwyg:empty')
       .type('Irgendwas cooles');
     cy.contains('.field-title', 'Beschreibungen').click();
-    cy.contains('.save-state', 'Gespeichert.');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert.');
 
     cy.visit('/picture/1');
     cy.contains('Yet another description');
@@ -87,7 +87,7 @@ describe('bulk edit descriptions', () => {
       .find('.MuiIconButton-root [data-testid="DeleteIcon"]')
       .click();
     cy.contains('Bestätigen').click();
-    cy.contains('.save-state', 'Gespeichert.');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert.');
     cy.contains('Yet another description');
     cy.contains('Irgendwas cooles').should('not.exist');
 
diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit/keyword-tags.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit/keyword-tags.cy.ts
index 1719b8eb5..ab61e9134 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit/keyword-tags.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit/keyword-tags.cy.ts
@@ -52,7 +52,7 @@ describe('bulk edit keyword tags', () => {
     cy.contains('.picture-info-field', 'Schlagworte')
       .find('input')
       .type('Verifiziertes Testschlagwort 4{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Verifiziertes Testschlagwort 4');
     cy.visit('/picture/3');
     cy.contains('Verifiziertes Testschlagwort 2');
@@ -69,7 +69,7 @@ describe('bulk edit keyword tags', () => {
     cy.contains('.MuiChip-root', 'Verifiziertes Testschlagwort 4')
       .find('[data-testid="CancelIcon"]')
       .click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Verifiziertes Testschlagwort 2').should('not.exist');
     cy.contains('Verifiziertes Testschlagwort 4').should('not.exist');
     cy.visit('/picture/3');
@@ -93,7 +93,7 @@ describe('bulk edit keyword tags', () => {
     cy.contains('.picture-info-field', 'Schlagworte')
       .find('input')
       .type('Verifiziertes Testschlagwort 4{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Verifiziertes Testschlagwort 2');
     cy.contains('Verifiziertes Testschlagwort 4');
     cy.visit('/picture/4');
@@ -107,7 +107,7 @@ describe('bulk edit keyword tags', () => {
     cy.contains('.MuiChip-root', 'Verifiziertes Testschlagwort 4')
       .find('[data-testid="CancelIcon"]')
       .click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Verifiziertes Testschlagwort 2');
     cy.contains('Verifiziertes Testschlagwort 4').should('not.exist');
   });
diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit/location-tags.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit/location-tags.cy.ts
index e1f4ece3e..0c012c2cd 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit/location-tags.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit/location-tags.cy.ts
@@ -50,7 +50,7 @@ describe('bulk edit location tags', () => {
     selectPictures('1', '25');
     bulkEdit();
     cy.contains('.picture-info-field', 'Orte').find('input').type('Verifizierter Testort 3{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Verifizierter Testort 3');
     cy.visit('/picture/1');
     cy.contains('.MuiChip-root', 'Bad Harzburg');
@@ -67,7 +67,7 @@ describe('bulk edit location tags', () => {
     cy.contains('.MuiChip-root', 'Verifizierter Testort 3')
       .find('[data-testid="CancelIcon"]')
       .click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('.MuiChip-root', 'Bad Harzburg').should('not.exist');
     cy.contains('Verifizierter Testort 3').should('not.exist');
     cy.visit('/picture/1');
@@ -89,7 +89,7 @@ describe('bulk edit location tags', () => {
     selectPictures('1', '4');
     bulkEdit();
     cy.contains('.picture-info-field', 'Orte').find('input').type('Market{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('.MuiChip-root', 'Bad Harzburg');
     cy.contains('Market place');
     cy.visit('/picture/1');
@@ -101,7 +101,7 @@ describe('bulk edit location tags', () => {
     // cleanup
     cy.get('[data-testid="CancelIcon"]'); // wait for auth
     cy.contains('.MuiChip-root', 'Market place').find('[data-testid="CancelIcon"]').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Bad Harzburg');
     cy.contains('Market place').should('not.exist');
   });
diff --git a/projects/bp-gallery/cypress/e2e/bulk-edit/person-tags.cy.ts b/projects/bp-gallery/cypress/e2e/bulk-edit/person-tags.cy.ts
index eb0520245..ef9e60207 100644
--- a/projects/bp-gallery/cypress/e2e/bulk-edit/person-tags.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/bulk-edit/person-tags.cy.ts
@@ -50,7 +50,7 @@ describe('bulk edit person tags', () => {
     selectPictures('1', '3');
     bulkEdit();
     cy.contains('.picture-info-field', 'Personen').find('input').type('Katharina{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Katharina Schmunk');
     cy.visit('/picture/1');
     cy.contains('Simon Heraldson').should('not.exist');
@@ -65,7 +65,7 @@ describe('bulk edit person tags', () => {
     selectPictures('1', '3');
     bulkEdit();
     cy.contains('.MuiChip-root', 'Katharina Schmunk').find('[data-testid="CancelIcon"]').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Simon Heraldson').should('not.exist');
     cy.contains('Katharina Schmunk').should('not.exist');
     cy.visit('/picture/1');
@@ -87,7 +87,7 @@ describe('bulk edit person tags', () => {
     selectPictures('2', '3');
     bulkEdit();
     cy.contains('.picture-info-field', 'Personen').find('input').type('Katharina{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Simon Heraldson');
     cy.contains('Katharina Schmunk');
     cy.visit('/picture/2');
@@ -99,7 +99,7 @@ describe('bulk edit person tags', () => {
     // cleanup
     cy.get('[data-testid="CancelIcon"]'); // wait for auth
     cy.contains('.MuiChip-root', 'Katharina Schmunk').find('[data-testid="CancelIcon"]').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
     cy.contains('Simon Heraldson');
     cy.contains('Katharina Schmunk').should('not.exist');
   });
diff --git a/projects/bp-gallery/cypress/e2e/facetags.cy.ts b/projects/bp-gallery/cypress/e2e/facetags.cy.ts
index f54ddec42..8e0c2ec36 100644
--- a/projects/bp-gallery/cypress/e2e/facetags.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/facetags.cy.ts
@@ -31,13 +31,13 @@ describe('face tagging', () => {
     cy.contains('.field-content', 'Personen').find('input').clear();
     cy.contains('.field-content', 'Personen').find('input').type('TestPerson');
     cy.contains('TestPerson hinzufügen').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
 
     cy.contains('.field-content', 'Personen').find('input').click();
     cy.contains('.field-content', 'Personen').find('input').clear();
     cy.contains('.field-content', 'Personen').find('input').type('Personentest');
     cy.contains('Personentest hinzufügen').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
 
     cy.contains('Personen markieren').click();
     cy.contains('Personen bearbeiten');
diff --git a/projects/bp-gallery/cypress/e2e/helper.ts b/projects/bp-gallery/cypress/e2e/helper.ts
index 78bee55c3..267a3d2a5 100644
--- a/projects/bp-gallery/cypress/e2e/helper.ts
+++ b/projects/bp-gallery/cypress/e2e/helper.ts
@@ -7,7 +7,7 @@ export const waitForAllImagesLoaded = () => {
 };
 
 export const waitForCuratorPictureInfo = () => {
-  cy.get('.save-state');
+  cy.get('[data-testid="save-status"]');
 };
 
 export const clickBulkOperation = (name: string) => {
diff --git a/projects/bp-gallery/cypress/e2e/picture_uploading_and_tagging.cy.ts b/projects/bp-gallery/cypress/e2e/picture_uploading_and_tagging.cy.ts
index 17477c245..8cc8929f4 100644
--- a/projects/bp-gallery/cypress/e2e/picture_uploading_and_tagging.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/picture_uploading_and_tagging.cy.ts
@@ -56,23 +56,23 @@ describe('picture uploading and tagging', () => {
     cy.get('.date-indicator').click();
     cy.contains('.rdrInputRange', 'Jahr').find('input').clear();
     cy.contains('.rdrInputRange', 'Jahr').find('input').type('1000{esc}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
   });
 
   it('tagging picture with description', () => {
     cy.get('.add-button').click();
     cy.get('.description-wrapper').find('.jodit-container').type('Test');
-    cy.get('.save-state:contains(Speichern ausstehend)').should('exist');
+    cy.get('[data-testid="save-status"]:contains(Speichern ausstehend)').should('exist');
     cy.get('.picture-container img').click();
-    cy.get('.save-state:contains(Gespeichert)').should('exist');
+    cy.get('[data-testid="save-status"]:contains(Gespeichert)').should('exist');
   });
 
   it('change picture description', () => {
     cy.get('.description-wrapper').find('.jodit-container').type('Beschreibung');
-    cy.get('.save-state:contains(Speichern ausstehend)').should('exist');
+    cy.get('[data-testid="save-status"]:contains(Speichern ausstehend)').should('exist');
     // regression test for https://github.com/hpi-swa-lab/BP2021RH1/issues/401
     cy.get('.picture-container img').click();
-    cy.get('.save-state:contains(Gespeichert)').should('exist');
+    cy.get('[data-testid="save-status"]:contains(Gespeichert)').should('exist');
   });
 
   it('tagging picture with person tag', () => {
@@ -80,7 +80,7 @@ describe('picture uploading and tagging', () => {
     cy.contains('.field-content', 'Personen').find('input').clear();
     cy.contains('.field-content', 'Personen').find('input').type('TestPerson');
     cy.contains('TestPerson hinzufügen').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
   });
 
   it('tagging picture with location tag', () => {
@@ -88,7 +88,7 @@ describe('picture uploading and tagging', () => {
     cy.contains('.field-content', 'Orte').find('input').clear();
     cy.contains('.field-content', 'Orte').find('input').type('TestOrt');
     cy.contains('TestOrt hinzufügen').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
   });
 
   it('tagging picture with keyword tag', () => {
@@ -96,14 +96,14 @@ describe('picture uploading and tagging', () => {
     cy.contains('.field-content', 'Schlagworte').find('input').clear();
     cy.contains('.field-content', 'Schlagworte').find('input').type('TestSchlagwort');
     cy.contains('TestSchlagwort hinzufügen').click();
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
   });
 
   it('tagging picture with collection', () => {
     cy.contains('.field-content', 'Collections').find('input').click();
     cy.contains('.field-content', 'Collections').find('input').clear();
     cy.contains('.field-content', 'Collections').find('input').type('TestCollection{enter}');
-    cy.contains('.save-state', 'Gespeichert');
+    cy.contains('[data-testid="save-status"]', 'Gespeichert');
   });
 
   it('checking tags', () => {
diff --git a/projects/bp-gallery/src/components/common/SaveStatus.tsx b/projects/bp-gallery/src/components/common/SaveStatus.tsx
index 9057fe925..24dc029b5 100644
--- a/projects/bp-gallery/src/components/common/SaveStatus.tsx
+++ b/projects/bp-gallery/src/components/common/SaveStatus.tsx
@@ -1,6 +1,9 @@
 export const SaveStatus = ({ label, className }: { label: string; className?: string }) => {
   return (
-    <span className={`text-[#5a5a5a] bg-[#e5e5e5] rounded py-2 px-3 ${className ?? ''}`}>
+    <span
+      className={`text-[#5a5a5a] bg-[#e5e5e5] rounded py-2 px-3 ${className ?? ''}`}
+      data-testid='save-status'
+    >
       {label}
     </span>
   );

From 27ea78b01cff3df2876cf9d4223f62a7e2cb265d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 20:41:49 +0200
Subject: [PATCH 27/31] Fix a5beb0a298298ea0fd4b4a3721bd0ee473b4fd4c for
 delayed auth loading

---
 .../components/common/picture-gallery/PictureScrollGrid.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx b/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx
index 8dc719e86..e1f17ae83 100644
--- a/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx
+++ b/projects/bp-gallery/src/components/common/picture-gallery/PictureScrollGrid.tsx
@@ -68,6 +68,12 @@ const PictureScrollGrid = ({
     textFilter ?? (loggedIn ? TextFilter.PICTURES_AND_TEXTS : TextFilter.ONLY_PICTURES)
   );
 
+  useEffect(() => {
+    if (textFilter === null) {
+      setSelectedTextFilter(loggedIn ? TextFilter.PICTURES_AND_TEXTS : TextFilter.ONLY_PICTURES);
+    }
+  }, [textFilter, loggedIn]);
+
   const { data, loading, error, fetchMore, refetch } = useGetPictures(
     queryParams,
     isAllSearchActive,

From 17735bee08fdfd27b0cddaf55f90e5bf7e2ae818 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Mon, 10 Jul 2023 20:42:16 +0200
Subject: [PATCH 28/31] Fix text filter tests

---
 .../cypress/e2e/link-pictures-with-texts.cy.ts         | 10 +++++++---
 .../common/picture-gallery/TextFilterSelect.tsx        |  7 ++++++-
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/projects/bp-gallery/cypress/e2e/link-pictures-with-texts.cy.ts b/projects/bp-gallery/cypress/e2e/link-pictures-with-texts.cy.ts
index b0525095d..455a8340f 100644
--- a/projects/bp-gallery/cypress/e2e/link-pictures-with-texts.cy.ts
+++ b/projects/bp-gallery/cypress/e2e/link-pictures-with-texts.cy.ts
@@ -1,14 +1,18 @@
 import { login, logout } from '../utils/login-utils';
 
 const checkTextDisplay = ({ prefix = '', pictureId = '2', textId = '1' } = {}) => {
-  cy.contains('Nur Bilder anzeigen');
+  // wait for page to settle
+  cy.contains('Bilder und Texte anzeigen');
+  // go through each text filter option
+  cy.get('[data-testid="text-filter-select"]').click();
+  cy.contains('Nur Bilder anzeigen').click();
   cy.get(`${prefix} #picture-preview-for-${pictureId}`);
   cy.get(`${prefix} #picture-preview-for-${textId}`).should('not.exist');
-  cy.contains('Nur Bilder anzeigen').click();
+  cy.get('[data-testid="text-filter-select"]').click();
   cy.contains('Bilder und Texte anzeigen').click();
   cy.get(`${prefix} #picture-preview-for-${pictureId}`);
   cy.get(`${prefix} #picture-preview-for-${textId}`);
-  cy.contains('Bilder und Texte anzeigen').click();
+  cy.get('[data-testid="text-filter-select"]').click();
   cy.contains('Nur Texte anzeigen').click();
   cy.get(`${prefix} #picture-preview-for-${pictureId}`).should('not.exist');
   cy.get(`${prefix} #picture-preview-for-${textId}`);
diff --git a/projects/bp-gallery/src/components/common/picture-gallery/TextFilterSelect.tsx b/projects/bp-gallery/src/components/common/picture-gallery/TextFilterSelect.tsx
index b8c05f36e..a97cda93c 100644
--- a/projects/bp-gallery/src/components/common/picture-gallery/TextFilterSelect.tsx
+++ b/projects/bp-gallery/src/components/common/picture-gallery/TextFilterSelect.tsx
@@ -22,7 +22,12 @@ export const TextFilterSelect = ({
   );
 
   return (
-    <Select value={value} onChange={onSelectChange} variant='standard'>
+    <Select
+      value={value}
+      onChange={onSelectChange}
+      variant='standard'
+      data-testid='text-filter-select'
+    >
       <MenuItem value={TextFilter.ONLY_PICTURES}>{t('common.textFilter.onlyPictures')}</MenuItem>
       <MenuItem value={TextFilter.PICTURES_AND_TEXTS}>
         {t('common.textFilter.picturesAndTexts')}

From 16f6a5385be5e4b2cce9f18f17d5acf81517f3a3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Tue, 11 Jul 2023 11:45:12 +0200
Subject: [PATCH 29/31] Serialize picture uploading

---
 .../picture-gallery/PictureUploadArea.tsx      | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/projects/bp-gallery/src/components/common/picture-gallery/PictureUploadArea.tsx b/projects/bp-gallery/src/components/common/picture-gallery/PictureUploadArea.tsx
index 5bb763136..2261617b9 100644
--- a/projects/bp-gallery/src/components/common/picture-gallery/PictureUploadArea.tsx
+++ b/projects/bp-gallery/src/components/common/picture-gallery/PictureUploadArea.tsx
@@ -102,15 +102,15 @@ const PictureUploadArea = ({
     )
       .map(upload => upload?.data?.id)
       .map(initializePictureFromFile);
-    await Promise.all(
-      preprocessPictures(uploadedPictures).map(async picture => {
-        await createPicture({
-          variables: {
-            data: picture as any,
-          },
-        });
-      })
-    );
+    // don't turn into Promise.all, as the order of the pictures
+    // (specifically their ids) should be preserved
+    for (const picture of preprocessPictures(uploadedPictures)) {
+      await createPicture({
+        variables: {
+          data: picture as any,
+        },
+      });
+    }
     setNewFiles([]);
     if (onUploaded) {
       onUploaded();

From 62d78659405015bc74085ef0feba6afa9e375782 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Tue, 11 Jul 2023 14:44:00 +0200
Subject: [PATCH 30/31] Rename working to isWorking

---
 .../src/components/views/admin/user/PermissionsView.tsx       | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
index 098beadcb..08471af92 100644
--- a/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/PermissionsView.tsx
@@ -119,7 +119,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
   const [deletePermission, { loading: deletePermissionLoading }] =
     useDeleteParameterizedPermissionMutation();
 
-  const working =
+  const isWorking =
     createPermissionLoading || deletePermissionLoading || networkStatus === NetworkStatus.refetch;
 
   const loading = userLoading || permissionsLoading || archivesLoading;
@@ -401,7 +401,7 @@ const PermissionsView = ({ userId }: { userId: string }) => {
               </CenteredContainer>
               <div className='absolute right-5 top-[6.75rem]'>
                 <SaveStatus
-                  label={t(working ? 'curator.saveStatus.saving' : 'curator.saveStatus.saved')}
+                  label={t(isWorking ? 'curator.saveStatus.saving' : 'curator.saveStatus.saved')}
                 />
               </div>
             </>

From 7745fa5cce2b35eab94db8ff17b4f56976c670be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20D=C3=B6rbandt?= <github.marius@doerbandt.de>
Date: Tue, 11 Jul 2023 14:44:29 +0200
Subject: [PATCH 31/31] Readd missing copy of users array

---
 .../bp-gallery/src/components/views/admin/user/UsersView.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx b/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx
index 75faca7b5..237d8cb34 100644
--- a/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx
+++ b/projects/bp-gallery/src/components/views/admin/user/UsersView.tsx
@@ -32,7 +32,7 @@ export const UsersView = () => {
   const { canRun: canUpdateUser } = useCanRunUpdateUserMutation();
 
   const sortedUsers = useMemo(
-    () => (users ? users.sort((a, b) => a.username.localeCompare(b.username)) : undefined),
+    () => (users ? users.slice().sort((a, b) => a.username.localeCompare(b.username)) : undefined),
     [users]
   );