🐛 Fix all variants of #81

frontend/src/components/group/useGroupMembership.ts

@@ -0,0 +1,31 @@
+import * as React from "react"
+import {useAuthorizationContext} from "../../contexts/authorization"
+import {useGroupContext} from "../../contexts/group"
+
+
+export function useGroupMembership(): boolean | undefined {
+    const authorization = useAuthorizationContext()
+    const group = useGroupContext()
+
+
+    return React.useMemo(
+        () => {
+            if(!authorization) {
+                return undefined
+            }
+            if(!group) {
+                return undefined
+            }
+            if(!authorization.state.token) {
+                return false
+            }
+            if(!(
+                group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
+            )) {
+                return false
+            }
+            return true
+        },
+        [authorization, group]
+    )
+}

frontend/src/components/notebook/NotebookCreateBox.tsx

@@ -1,13 +1,13 @@
 import {Box, Details, Form, Idiomatic as I, useFormState} from "@steffo/bluelib-react"
 import * as React from "react"
 import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {useProjectContext} from "../../contexts/project"
 import {useApplyChanges} from "../../hooks/useApplyChanges"
 import {useFormSlug} from "../../hooks/useFormSlug"
 import {ManagedResource, ManagedViewSet} from "../../hooks/useManagedViewSet"
 import {SophonNotebook} from "../../types/SophonTypes"
 import {Validators} from "../../utils/Validators"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface NotebookCreateBoxProps {
@@ -18,7 +18,6 @@ export interface NotebookCreateBoxProps {
 
 export function NotebookCreateBox({viewSet, resource}: NotebookCreateBoxProps): JSX.Element | null {
     const authorization = useAuthorizationContext()
-    const group = useGroupContext()
     const project = useProjectContext()
 
     const name =
@@ -56,18 +55,7 @@ export function NotebookCreateBox({viewSet, resource}: NotebookCreateBoxProps):
             [viewSet, resource],
         )
 
-    if(!authorization) {
+    if(!useGroupMembership()) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.token) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }
     if(resource) {

frontend/src/components/notebook/NotebookDeleteButton.tsx

@@ -1,11 +1,10 @@
 import {faTrash} from "@fortawesome/free-solid-svg-icons"
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
 import * as React from "react"
-import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {ManagedResource} from "../../hooks/useManagedViewSet"
 import {SophonNotebook} from "../../types/SophonTypes"
 import {SafetyButton} from "../elements/SafetyButton"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface NotebookDeleteButtonProps {
@@ -14,21 +13,7 @@ export interface NotebookDeleteButtonProps {
 
 
 export function NotebookDeleteButton({resource}: NotebookDeleteButtonProps): JSX.Element | null {
-    const authorization = useAuthorizationContext()
+    if(!useGroupMembership()) {
-    const group = useGroupContext()
-
-    if(!authorization) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.user) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }
     if(resource.value.is_running) {

frontend/src/components/notebook/NotebookLockButton.tsx

@@ -2,10 +2,9 @@ import {faLock} from "@fortawesome/free-solid-svg-icons"
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
 import {Button} from "@steffo/bluelib-react"
 import * as React from "react"
-import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {ManagedResource} from "../../hooks/useManagedViewSet"
 import {SophonNotebook} from "../../types/SophonTypes"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface NotebookLockButtonProps {
@@ -14,21 +13,7 @@ export interface NotebookLockButtonProps {
 
 
 export function NotebookLockButton({resource}: NotebookLockButtonProps): JSX.Element | null {
-    const authorization = useAuthorizationContext()
+    if(!useGroupMembership()) {
-    const group = useGroupContext()
-
-    if(!authorization) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.user) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }
     if(resource.value.locked_by) {

frontend/src/components/notebook/NotebookStartButton.tsx

@@ -2,10 +2,9 @@ import {faLightbulb} from "@fortawesome/free-solid-svg-icons"
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
 import {Button} from "@steffo/bluelib-react"
 import * as React from "react"
-import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {ManagedResource} from "../../hooks/useManagedViewSet"
 import {SophonNotebook} from "../../types/SophonTypes"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface NotebookStartButtonProps {
@@ -14,21 +13,7 @@ export interface NotebookStartButtonProps {
 
 
 export function NotebookStartButton({resource}: NotebookStartButtonProps): JSX.Element | null {
-    const authorization = useAuthorizationContext()
+    if(!useGroupMembership()) {
-    const group = useGroupContext()
-
-    if(!authorization) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.user) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }
     if(resource.value.is_running) {

frontend/src/components/notebook/NotebookStopButton.tsx

@@ -2,10 +2,9 @@ import {faLightbulb} from "@fortawesome/free-regular-svg-icons"
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
 import {Button} from "@steffo/bluelib-react"
 import * as React from "react"
-import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {ManagedResource} from "../../hooks/useManagedViewSet"
 import {SophonNotebook} from "../../types/SophonTypes"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface NotebookStopButtonProps {
@@ -14,21 +13,7 @@ export interface NotebookStopButtonProps {
 
 
 export function NotebookStopButton({resource}: NotebookStopButtonProps): JSX.Element | null {
-    const authorization = useAuthorizationContext()
+    if(!useGroupMembership()) {
-    const group = useGroupContext()
-
-    if(!authorization) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.user) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }
     if(!resource.value.is_running) {

frontend/src/components/notebook/NotebookUnlockButton.tsx

@@ -3,10 +3,10 @@ import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
 import {Button} from "@steffo/bluelib-react"
 import * as React from "react"
 import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {ManagedResource} from "../../hooks/useManagedViewSet"
 import {SophonNotebook} from "../../types/SophonTypes"
 import {SafetyButton} from "../elements/SafetyButton"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface NotebookUnlockButtonProps {
@@ -16,27 +16,15 @@ export interface NotebookUnlockButtonProps {
 
 export function NotebookUnlockButton({resource}: NotebookUnlockButtonProps): JSX.Element | null {
     const authorization = useAuthorizationContext()
-    const group = useGroupContext()
 
-    if(!authorization) {
+    if(!useGroupMembership()) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.user) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }
     if(!resource.value.locked_by) {
         return null
     }
 
-    if(resource.value.locked_by === authorization.state.user.id) {
+    if(resource.value.locked_by === authorization!.state.user!.id) {
         return (
             <Button onClick={() => resource.action("PATCH", "unlock", {})} disabled={resource.busy}>
                 <FontAwesomeIcon icon={faLockOpen} spin={resource.busy}/>&nbsp;Unlock

frontend/src/components/project/ProjectCreateBox.tsx

@@ -7,6 +7,7 @@ import {useFormSlug} from "../../hooks/useFormSlug"
 import {ManagedResource, ManagedViewSet} from "../../hooks/useManagedViewSet"
 import {SophonResearchProject} from "../../types/SophonTypes"
 import {Validators} from "../../utils/Validators"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface ProjectCreateBoxProps {
@@ -40,33 +41,6 @@ export function ProjectCreateBox({viewSet, resource}: ProjectCreateBoxProps): JS
     const slug =
         useFormSlug(resource, name.value)
 
-    const canAdministrate =
-        React.useMemo(
-            () => {
-                if(resource) {
-                    if(!authorization) {
-                        return false
-                    }
-                    if(!group) {
-                        return false
-                    }
-                    if(!authorization.state.user) {
-                        return false
-                    }
-                    if(!(
-                        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-                    )) {
-                        return false
-                    }
-                    return true
-                }
-                else {
-                    return true
-                }
-            },
-            [authorization, group, resource],
-        )
-
     const applyChanges =
         useApplyChanges(viewSet, resource, {
             name: name.value,
@@ -88,11 +62,7 @@ export function ProjectCreateBox({viewSet, resource}: ProjectCreateBoxProps): JS
             [viewSet, resource],
         )
 
-    if(!authorization?.state.token ||
+    if(!useGroupMembership()) {
-        !(
-            viewSet || resource
-        ) ||
-        !canAdministrate) {
         return null
     }
 

frontend/src/components/project/ProjectDeleteButton.tsx

@@ -1,11 +1,10 @@
 import {faTrash} from "@fortawesome/free-solid-svg-icons"
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
 import * as React from "react"
-import {useAuthorizationContext} from "../../contexts/authorization"
-import {useGroupContext} from "../../contexts/group"
 import {ManagedResource} from "../../hooks/useManagedViewSet"
 import {SophonResearchProject} from "../../types/SophonTypes"
 import {SafetyButton} from "../elements/SafetyButton"
+import {useGroupMembership} from "../group/useGroupMembership"
 
 
 export interface ProjectDeleteButtonProps {
@@ -14,21 +13,7 @@ export interface ProjectDeleteButtonProps {
 
 
 export function ProjectDeleteButton({resource}: ProjectDeleteButtonProps): JSX.Element | null {
-    const authorization = useAuthorizationContext()
+    if(!useGroupMembership()) {
-    const group = useGroupContext()
-
-    if(!authorization) {
-        return null
-    }
-    if(!group) {
-        return null
-    }
-    if(!authorization.state.user) {
-        return null
-    }
-    if(!(
-        group.value.members.includes(authorization.state.user.id) || group.value.owner === authorization.state.user.id
-    )) {
         return null
     }