Merge pull request #680 from openstad/feat/user-can-delete-resource

Feat/user can delete resource
openstad · Nov 6, 2024 · d6e81b8 · d6e81b8
2 parents f073288 + 7e50dca
commit d6e81b8
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 18 deletions.
diff --git a/packages/resource-detail/src/resource-detail.tsx b/packages/resource-detail/src/resource-detail.tsx
@@ -26,6 +26,9 @@ import { ResourceDetailMapWidgetProps } from '@openstad-headless/leaflet-map/src
 
 import { ResourceDetailMap } from '@openstad-headless/leaflet-map/src/resource-detail-map';
 import { ShareLinks } from '../../apostrophe-widgets/share-links/src/share-links';
+import { Button } from '@utrecht/component-library-react';
+import {hasRole} from '../../lib';
+
 type booleanProps = {
   [K in
   | 'displayImage'
@@ -232,6 +235,23 @@ function ResourceDetail({
     );
   };
 
+  const { data: currentUser } = datastore.useCurrentUser({ ...props });
+  const resourceUserId = resource?.userId || null;
+  const canDelete = hasRole(currentUser, ['moderator', 'owner'], resourceUserId);
+
+  const onRemoveClick = async (resource: any) => {
+    try {
+      if (typeof resource.delete === 'function') {
+        await resource.delete(resource.id);
+        window.history.back();
+      } else {
+        console.error('Delete method not found on resource');
+      }
+    } catch (e) {
+      console.error(e);
+    }
+  }
+
   return (
     <section>
       <div
@@ -411,6 +431,21 @@ function ResourceDetail({
         ) : null}
       </div>
 
+      {canDelete && (
+        <>
+          <Spacer size={2} />
+          <Button
+            appearance="primary-action-button"
+            onClick={() => {
+              if (confirm("Deze actie verwijderd de resource"))
+                onRemoveClick(resource);
+            }}
+          >
+            Verwijder de inzending
+          </Button>
+        </>
+      )}
+
       <Spacer size={2} />
 
       {Array.isArray(useSentiments) &&

diff --git a/packages/resource-overview/src/gridder-resource-detail.tsx b/packages/resource-overview/src/gridder-resource-detail.tsx
@@ -23,15 +23,15 @@ import { Icon } from "../../ui/src/icon"
 import {Likes, LikeWidgetProps} from '@openstad-headless/likes/src/likes';
 import { BaseProps } from '@openstad-headless/types/base-props';
 import { ProjectSettingProps } from '@openstad-headless/types/project-setting-props';
+import {hasRole} from "../../lib";
 
 export type GridderResourceDetailProps =
     BaseProps &
     ProjectSettingProps &
     {
   resource: any;
   onRemoveClick?: (resource: any) => void;
-  isModerator?: boolean;
-  loginUrl?: string;
+  currentUser?: any;
   displayDocuments?: boolean;
   displayLikeButton?: boolean;
   clickableImage?: boolean;
@@ -46,19 +46,21 @@ export type GridderResourceDetailProps =
 export const GridderResourceDetail = ({
   resource,
   onRemoveClick,
-  isModerator = false,
-  loginUrl = '',
   displayDocuments = false,
   displayLikeButton = false,
   documentsTitle = '',
   documentsDesc = '',
   clickableImage = false,
+  currentUser,
   ...props
 }: GridderResourceDetailProps) => {
   // When resource is correctly typed the we will not need :any
   const theme = resource.tags?.filter((t: any) => t.type === 'theme')?.at(0);
   const area = resource.tags?.filter((t: any) => t.type === 'area')?.at(0);
 
+  const resourceUserId = resource?.userId || null;
+  const canDelete = hasRole(currentUser, ['moderator', 'owner'], resourceUserId);
+
   type DocumentType = {
     name?: string;
     url?: string;
@@ -173,19 +175,17 @@ export const GridderResourceDetail = ({
               />
             )}
 
-            <Button
-              appearance="primary-action-button"
-              disabled={!isModerator && !loginUrl}
-              onClick={() => {
-                if (!isModerator) {
-                  document.location.href = loginUrl;
-                } else {
+            {canDelete && (
+              <Button
+                appearance="primary-action-button"
+                onClick={() => {
                   if (confirm("Deze actie verwijderd de resource"))
                     onRemoveClick && onRemoveClick(resource);
-                }
-              }}>
-              {isModerator ? 'Verwijder' : 'Inloggen'}
-            </Button>
+                }}
+              >
+                Verwijder
+              </Button>
+            )}
 
           </div>
         </section>

diff --git a/packages/resource-overview/src/resource-overview.tsx b/packages/resource-overview/src/resource-overview.tsx
@@ -479,7 +479,6 @@ function ResourceOverview({
   }, [filteredResources]);
 
   const { data: currentUser } = datastore.useCurrentUser({ ...props });
-  const isModerator = hasRole(currentUser, 'moderator');
 
   const onResourceClick = useCallback(
     (resource: any, index: number) => {
@@ -532,8 +531,7 @@ function ResourceOverview({
             itemRenderer={(item) => (
               <GridderResourceDetail
                 resource={item}
-                isModerator={isModerator}
-                loginUrl={props.login?.url}
+                currentUser={currentUser}
                 displayDocuments={displayDocuments}
                 documentsTitle={documentsTitle}
                 documentsDesc={documentsDesc}