Feat/visibility remastered

src/app/_components/VisiblityAdmin/VisibilityAdmin.module.scss

@@ -1,15 +1,5 @@
 @use '@/styles/ohma';
 
 .VisibilityAdmin {
-    @include ohma.card;
-    background-color: ohma.$colors-secondary;
-    width: 100%;
-    .info {
-        margin-bottom: .5em;
-    }
-    .borderBottom {
-        border-bottom: 5px solid ohma.$colors-gray-900;
-        margin-bottom: .5em;
-        width: 100%;
-    }
+
 }

src/app/_components/VisiblityAdmin/VisibilityAdmin.tsx

@@ -1,40 +1,17 @@
 'use client'
 import styles from './VisibilityAdmin.module.scss'
-import VisibilityLevelAdmin from './VisibilityLevelAdmin'
-import useActionCall from '@/hooks/useActionCall'
-import { readVisibilityForAdminAction } from '@/services/visibility/actions'
-import { useCallback } from 'react'
+import type { VisibilityMatrix } from '@/services/visibility/types'
+
 
 type PropTypes = {
-    visibilityId: number
+    visibility: VisibilityMatrix
 }
 
-
-export default function VisibilityAdmin({ visibilityId }: PropTypes) {
-    const action = useCallback(() => readVisibilityForAdminAction(visibilityId), [visibilityId])
-    const { data } = useActionCall(action)
-    console.log(data)
-    if (!data) return null
+export default function VisibilityAdmin({ visibility }: PropTypes) {
+    console.log(visibility)
     return (
         <div className={styles.VisibilityAdmin}>
-            <div className={styles.info}>
-                <h1>Administrer synelighet</h1>
-                <i>Synelighet for: {data.purpose}</i>
-            </div>
-            {
-                data.type === 'REGULAR' ? (<>
-                    <div className={styles.borderBottom}>
-                        <VisibilityLevelAdmin level="REGULAR" levelName="Synelig" data={data.regular} />
-                    </div>
-                    <div>
-                        <VisibilityLevelAdmin level="ADMIN" levelName="Admin" data={data.admin} />
-                    </div>
-                </>) : (<>
-                    <p>{data.message}</p>
-                    <p>{data.regular}</p>
-                    <p>{data.admin}</p>
-                </>)
-            }
+            <h2>Synelighet!</h2>
         </div>
     )
 }

src/app/articles/[category]/EditCategory.tsx

@@ -20,7 +20,7 @@ type PropTypes = {
 
 export default function EditCategory({ category }: PropTypes) {
     const { refresh, push } = useRouter()
-    // Make a visibility check for edit
+    // Make a visibility check for edit - no just call the apropriate auther.
     const canEditCategory = true
 
     const handleSuccessDestroy = () => {

src/app/articles/[category]/SideBar.tsx

@@ -74,7 +74,7 @@ export default function SideBar({ category, children }: PropTypes) {
 }
 
 function MainListContent({ category }: { category: ExpandedArticleCategory }) {
-    // Make a visibility check for edit
+    // Make a visibility check for edit - no just call the apropriate auther.
     const canEditCategory = true
     const { push, refresh } = useRouter()
 

src/app/images/collections/[id]/CollectionAdmin.tsx

@@ -7,28 +7,27 @@ import TextInput from '@/components/UI/TextInput'
 import { ImagePagingContext } from '@/contexts/paging/ImagePaging'
 import ImageUploader from '@/components/Image/ImageUploader'
 import useEditing from '@/hooks/useEditing'
-import VisibilityAdmin from '@/components/VisiblityAdmin/VisibilityAdmin'
 import PopUp from '@/components/PopUp/PopUp'
 import Button from '@/components/UI/Button'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faCog, faEye, faUpload } from '@fortawesome/free-solid-svg-icons'
 import { useRouter } from 'next/navigation'
 import { useContext, useState } from 'react'
-import type { VisibilityCollapsed } from '@/services/visibility/types'
+import type { VisibilityMatrix } from '@/services/visibility/types'
 import type { ExpandedImageCollection } from '@/services/images/collections/types'
 
 type PropTypes = {
     collection: ExpandedImageCollection
-    visibility: VisibilityCollapsed
+    visibilityAdmin: VisibilityMatrix
+    visibilityRead: VisibilityMatrix
 }
 
-export default function CollectionAdmin({ collection, visibility }: PropTypes) {
+export default function CollectionAdmin({ collection, visibilityAdmin, visibilityRead }: PropTypes) {
+    console.log(visibilityAdmin, visibilityRead)
     const { id: collectionId } = collection
     const router = useRouter()
     const pagingContext = useContext(ImagePagingContext)
-    const canEdit = useEditing({
-        requiredVisibility: visibility,
-    })
+    const canEdit = useEditing({}) //TODO: pass in auther
     const [uploadOption, setUploadOption] = useState<'MANY' | 'ONE'>('MANY')
     if (!canEdit) return null
 
@@ -112,7 +111,7 @@ export default function CollectionAdmin({ collection, visibility }: PropTypes) {
                     <FontAwesomeIcon icon={faEye} />
                 }>
                     <div className={styles.visibility}>
-                        <VisibilityAdmin visibilityId={visibility.id} />
+                        {/* VisibilityAdmin... */}
                     </div>
                 </PopUp>
             </div>

src/app/images/collections/[id]/page.tsx

@@ -8,6 +8,7 @@ import { readImageCollectionAction } from '@/services/images/collections/actions
 import { readImagesPageAction } from '@/services/images/actions'
 import { notFound } from 'next/navigation'
 import type { PageSizeImage } from '@/contexts/paging/ImagePaging'
+import type { VisibilityMatrix } from '@/services/visibility/types'
 
 type PropTypes = {
     params: Promise<{
@@ -51,7 +52,11 @@ export default async function Collection({ params }: PropTypes) {
                             images.map(image => <ImageListImage key={image.id} image={image} />)
                         } />
                     </main>
-                    <CollectionAdmin visibility={collection.visibility} collection={collection} />
+                    <CollectionAdmin
+                        visibilityAdmin={{} as VisibilityMatrix}
+                        visibilityRead={{} as VisibilityMatrix}
+                        collection={collection}
+                    />
                 </div>
             </ImageDisplayProvider>
         </ImagePagingProvider>

src/auth/auther/RequireVisibility.ts

@@ -1,14 +1,14 @@
 import { AutherFactory } from './Auther'
-import { checkVisibility } from '@/auth/checkVisibility'
-import type { VisibilityCollapsed } from '@/services/visibility/types'
+import { checkVisibility } from '@/auth/visibility/checkVisibility'
+import type { VisibilityMatrix } from '@/services/visibility/types'
 import type { Permission } from '@prisma/client'
 
 export const RequireVisibility = AutherFactory<
     { bypassPermission: Permission },
-    { visibility: VisibilityCollapsed },
+    { visibility: VisibilityMatrix },
     'USER_NOT_REQUIERED_FOR_AUTHORIZED'
 > (({ session, dynamicFields, staticFields }) => ({
-    success: checkVisibility(session, dynamicFields.visibility, 'REGULAR') ||
+    success: checkVisibility(session.memberships, dynamicFields.visibility) ||
         session.permissions.includes(staticFields.bypassPermission),
     session,
 }))