various changes

src/components/client/admin/PostEditor.tsx

@@ -1,18 +1,26 @@
 import { ActionResult } from "@/app/lib/actions/ActionResult";
 import { handleActionResult } from "@/app/lib/actions/clientActionHandler";
-import { Post } from "@/model/Post";
-import { Project } from "@/model/Project";
+import { Post, Project, Bucket, PostBucket, Attachment } from "@/model/Models";
 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<Attributes<Post>>)=>any;
     closeEditor: ()=>any;
 }
+type PostEditorBucket = Partial<Attributes<Bucket>> & {
+    attachments:Partial<Attributes<Attachment>>[]
+}
+
+type PostEditorPost = Partial<Attributes<Post>> & {
+    buckets:PostEditorBucket[]
+}
 
 export type EditorProps = {
     open:boolean;
-    post:Partial<Attributes<Post>>;
+    post:PostEditorPost;
     projects?:Attributes<Project>[];
     callbacks:PostTableCallbacks;
 }
@@ -23,7 +31,7 @@ export default function PostEditor(props:EditorProps){
     let [title,setTitle] = useState(props.post?.title)
     let [projectID,setProjectID] = useState(props.post?.project_id)
     let textbox:any = useRef(undefined);
-
+    
     function adjustHeight() {
         if(!textbox.current || !textbox.current.style) return
             textbox.current.style.height = "fit-content";
@@ -55,6 +63,31 @@ export default function PostEditor(props:EditorProps){
             <option value={0}>unassigned</option>
             {props.projects?.map(p=><option value={p.id}>{p.readableIdentifier}</option>)}
         </select>
+        <h2>Attachments</h2>
+        <table className="table table-striped">
+        <thead>
+            <tr><td>Buckets</td></tr>
+        </thead>
+        <tbody>
+            {
+                (()=>{
+                    let bucketMap:Map<UUID,PostEditorBucket> = new Map(props.post.buckets.map((b)=>[b.id as UUID,b]));
+                    let bucketList = [...props.post.buckets.map((b)=>b.id)];
+                    return bucketList.map((e)=>{
+                        return <tr><Accordion><AccordionItem eventKey={bucketList.indexOf(e).toString()}><AccordionHeader>{e}</AccordionHeader><AccordionBody><ul>{bucketMap.get(e as UUID)?.attachments.map((attachment)=><li>{attachment.filename}</li>)}</ul></AccordionBody></AccordionItem></Accordion></tr>
+                    })
+                })()
+            }
+            <tr>
+            <td colSpan={4}>
+                <table className="table mb-0">
+                ...
+                </table>
+            </td>
+            </tr>
+            ...
+        </tbody>
+        </table>
         <button type="button" className="m-2 btn btn-primary">Preview</button>
         <button type="button" className="m-2 btn btn-success" onClick={onClickSaveButton}>Save</button>
         <button type="button" className="m-2 btn btn-danger" onClick={onClickCancelButton}>Cancel</button>