ya

2024-06-26 10:40:09 +02:00
parent a492bf4ac0
commit de212c367f
5 changed files with 101 additions and 56 deletions
--- a/src/components/client/admin/PostEditor.tsx
+++ b/src/components/client/admin/PostEditor.tsx
@@ -1,21 +1,23 @@
 import { ActionResult } from "@/app/lib/actions/ActionResult";
 import { handleActionResult } from "@/app/lib/actions/clientActionHandler";
+import { GetPostsAttributes } from "@/app/lib/actions/entityManagement/postActions";
 import { Post, Project, Bucket, PostBucket, Attachment } from "@/model/Models";
 import { PostAttributesWithBuckets } from "@/model/Post";
+import { DeepPartial } from "@/util/DeepPartial";
 import { Attributes } from "@sequelize/core";
 import { UUID } from "crypto";
 import { ChangeEventHandler, MouseEventHandler, useLayoutEffect, useRef, useState } from "react";
 import { Accordion, AccordionBody, AccordionHeader, AccordionItem } from "react-bootstrap";

 export type PostTableCallbacks = {
-    savePost: (p:Partial<PostAttributesWithBuckets>)=>void;
+    savePost: (p:Partial<Attributes<Post>>)=>void;
    closeEditor: ()=>any;
    uploadAttachment : ()=>any;
 }

 export type EditorProps = {
    editorOpenState:boolean;
-    openedPost:Partial<PostAttributesWithBuckets>;
+    openedPost:GetPostsAttributes;
    projects?:Attributes<Project>[];
    callbacks:PostTableCallbacks;
 }
@@ -24,7 +26,7 @@ export type EditorProps = {
 export default function PostEditor(props:EditorProps){
    let [content,setContent] = useState(props.openedPost?.content)
    let [title,setTitle] = useState(props.openedPost?.title)
-    let [projectID,setProjectID] = useState(props.openedPost?.project_id)
+    let [projectID,setProjectID] = useState(props.openedPost?.project?.id)
    let textbox:any = useRef(undefined);
    
    function adjustHeight(): void {
@@ -42,7 +44,7 @@ export default function PostEditor(props:EditorProps){
            id: props.openedPost.id as number,
            content:content as string,
            title:title as string,
-            project_id:projectID
+            project_id: projectID
        });
    }
    const onClickCancelButton:MouseEventHandler<HTMLButtonElement> = (e)=>{props.callbacks.closeEditor();}
--- a/src/components/client/admin/PostTable.tsx
+++ b/src/components/client/admin/PostTable.tsx
@@ -20,12 +20,12 @@ import { useState } from "react";
 import { Project, Post, Bucket } from "@/model/Models";
 import { ActionResult } from "@/app/lib/actions/ActionResult";
 import { handleActionResult } from "@/app/lib/actions/clientActionHandler";
-import { getPostsWithBucketsAndProject } from "@/app/lib/actions/entityManagement/postActions";
+import { getPostsWithBucketsAndProject, GetPostsAttributes } from "@/app/lib/actions/entityManagement/postActions";
 import { PostAttributesWithBuckets } from "@/model/Post";

-type Actions = {
+export type PostTableActions = {
    deletePost: (id: number) => Promise<ActionResult<boolean>>
-    getPosts: () => Promise<ActionResult<PostAttributesWithBuckets[]>>
+    getPosts: () => Promise<ActionResult<GetPostsAttributes[]>>
    getProjects: () => Promise<ActionResult<Attributes<Project>[]>>
    savePost: (data: Partial<Attributes<Post>>) => Promise<ActionResult<Attributes<Post>[]>>
    // uploadAttachment: ()=> Promise<ActionResult<any>>
@@ -34,9 +34,9 @@ type Actions = {
 type Props = {
    children?: ReactNode;
    headings: Array<string>;
-    data: Partial<PostAttributesWithBuckets>[];
+    data: GetPostsAttributes[];
    projects: Attributes<Project>[];
-    actions: Actions;
+    actions: PostTableActions;
 }

 const aifa = (a: ReactNode, b: ReactNode) => a ? a : b
@@ -61,14 +61,14 @@ export default function PostTable(props: Props) {
            editorOpenState: false
        })
    }
-    function showEditor(entry: Partial<PostAttributesWithBuckets>): void {
+    function showEditor(entry: GetPostsAttributes): void {
        setEditor({
            editorOpenState: true,
            openedPost: entry
        })
    }

-    function deletePost(entry: Partial<PostAttributesWithBuckets>) {
+    function deletePost(entry: GetPostsAttributes) {
        if (!entry.id) return;
        props.actions?.deletePost(entry.id)
            .then(actionResult => {
@@ -92,7 +92,7 @@ export default function PostTable(props: Props) {
            })
    }

-    function savePost(e: Partial<PostAttributesWithBuckets>) {
+    function savePost(e: Partial<Attributes<Post>>) {
        props.actions.savePost({
            id: e.id,
            content: e.content,
@@ -102,12 +102,13 @@ export default function PostTable(props: Props) {
            .then(res => handleActionResult(res))
            .then(getPostsWithBucketsAndProject)
            .then(res => {
-                if (!res.error && res.result) setPosts(res.result);
+                const result = handleActionResult(res);
+                if (result) setPosts(result);
            })
        closeEditor();
    };

-    function TableFields({ postData }: { postData: Partial<PostAttributesWithBuckets> }) {
+    function TableFields({ postData }: { postData: GetPostsAttributes }) {
        return [
            {
                key: 'post-title',
@@ -122,7 +123,8 @@ export default function PostTable(props: Props) {
            }, {
                key: 'post-project',
                content: aifa((projects.find((e) => {
-                    return (e.id == postData.project_id)
+                    console.log(e.id)
+                    return (e.id == postData.project.id)
                })?.readableIdentifier), 'uncategorized')
            }, {
                key: 'post-createdat',
@@ -137,42 +139,46 @@ export default function PostTable(props: Props) {
                key: 'post-deletebutton',
                content: <button key="deletebutton" type="button" className="btn btn-danger" onClick={() => deletePost(postData)}> Delete</button>
            }
-        ].map(field => 
+        ].map(field =>
            <td key={field.key}>{field.content}</td>
        );
    }

-    function TableRow(props: {postData: Partial<PostAttributesWithBuckets>, headings: string | any[]}){
-                return <><tr key={props.postData.id}>
-                    <th key={`rowheading-post-${props.postData.id}`} scope="row">{props.postData.id}</th>
-                    <TableFields key={`tableFields-${props.postData.id}`} postData={props.postData} />
+    function TableRow(props: { postData: GetPostsAttributes, headings: string | any[] }) {
+        return <><tr key={props.postData.id}>
+            <th key={`rowheading-post-${props.postData.id}`} scope="row">{props.postData.id}</th>
+            <TableFields key={`tableFields-${props.postData.id}`} postData={props.postData} />
+        </tr>
+            {(editor.editorOpenState
+                && editor.openedPost
+                && editor.openedPost.id == props.postData.id)
+
+                ? <tr>
+                    <th scope="row" colSpan={props.headings.length}>
+                        <PostEditor callbacks={{
+                            savePost: savePost,
+                            closeEditor: closeEditor,
+                            uploadAttachment: () => { }
+                        }}
+                            editorOpenState={editor.editorOpenState}
+                            openedPost={editor.openedPost}
+                            projects={projects} />
+                    </th>
                </tr>
-                {(editor.editorOpenState
-                    && editor.openedPost
-                    && editor.openedPost.id == props.postData.id)

-                    ? <tr>
-                        <th scope="row" colSpan={props.headings.length}>
-                            <PostEditor callbacks={{
-                                savePost: savePost,
-                                closeEditor: closeEditor,
-                                uploadAttachment: () => { }
-                            }}
-                                editorOpenState={editor.editorOpenState}
-                                openedPost={editor.openedPost}
-                                projects={projects} />
-                        </th>
-                    </tr>
-
-                    : ""}
-                </>
+                : ""}
+        </>
    }

    return <>
-        <EntityManagementTable entityName="Post" key="der-table" headings={props.headings}>
-            {posts.map((postData: Partial<PostAttributesWithBuckets>) => <TableRow  headings={props.headings} 
-                                                                                    postData={postData} 
-                                                                                    key={postData.id}/> )}
+        <EntityManagementTable entityName="Post"
+            key="der-table"
+            headings={props.headings}>
+            {posts.map((postData: GetPostsAttributes) =>
+                <TableRow headings={props.headings}
+                    postData={postData}
+                    key={postData.id} />
+            )}
        </EntityManagementTable>
    </>
 }
--- a/src/components/server/admin/views/PostView.tsx
+++ b/src/components/server/admin/views/PostView.tsx
@@ -4,15 +4,17 @@ import { tryFetchPosts } from "@/app/api/post/route";
 import { constructAPIUrl } from "@/util/Utils";
 import { ReactNode, useEffect } from "react";
 import EntityManagementTable from "../../../client/EntityManagementTable";
-import PostTable from "@/components/client/admin/PostTable";
-import { deletePost, getPostsWithBucketsAndProject, updatePost } from "@/app/lib/actions/entityManagement/postActions";
+import PostTable, { PostTableActions } from "@/components/client/admin/PostTable";
+import { deletePost, getPostsWithBucketsAndProject, GetPostsAttributes, updatePost } from "@/app/lib/actions/entityManagement/postActions";
 import { getProjects } from "@/app/lib/actions/entityManagement/projectActions";
 import { Bucket, Project, Post, dbSync, Attachment } from "@/model/Models";
 import { tryCreateAttachment } from "@/app/api/attachment/route";
+import { handleActionResult } from '../../../../app/lib/actions/clientActionHandler';

 type Props = {
    children?:ReactNode
 }
+
 async function getHeadings(){
    let headings:string[] = ['#', 'Title', 'Content', 'Project', 'CreatedAt', 'UpdatedAt']
    
@@ -24,7 +26,7 @@ export default async function PostView(props:Props){

    const headings = await getHeadings();

-    const actions = {
+    const actions:PostTableActions = {
        deletePost: deletePost, 
        getPosts:getPostsWithBucketsAndProject, 
        getProjects:getProjects, 
@@ -32,16 +34,16 @@ export default async function PostView(props:Props){
        // uploadAttachment:tryCreateAttachment
    };

-    const posts:Post[] = await Post.findAll({include: {model: Bucket, include: {model: Attachment}}}).then(posts=>posts.map((e)=>JSON.parse(JSON.stringify(e))));
+    const posts:GetPostsAttributes[]| undefined = handleActionResult(await getPostsWithBucketsAndProject());
    const projects = await Project.findAll().then(projects=>projects.map((e)=>JSON.parse(JSON.stringify(e))));
    
    return (
        <div className="w-[100%] min-h-fit bg-gray-100 overflow-scroll">
            <div className="w-[100%] m-auto">
-                <PostTable  data={posts} 
-                            projects={projects} 
-                            headings={headings} 
-                            actions={actions}>
+                <PostTable  data={posts ? posts : []} 
+                projects={projects} 
+                headings={headings} 
+                actions={actions}>
                </PostTable>
            </div>
        </div>