This commit is contained in:
Andreas 2024-06-26 10:40:09 +02:00
parent a492bf4ac0
commit de212c367f
5 changed files with 101 additions and 56 deletions

View File

@ -1,4 +1,4 @@
'use client'
import toast from "react-hot-toast"; import toast from "react-hot-toast";
import { ActionResult } from "./ActionResult"; import { ActionResult } from "./ActionResult";

View File

@ -1,7 +1,7 @@
'use server'; 'use server';
import { revalidatePath, revalidateTag } from 'next/cache' import { revalidatePath, revalidateTag } from 'next/cache'
import { Bucket, Post, PostBucket, User, dbSync } from "@/model/Models"; import { Bucket, Post, PostBucket, Project, User, dbSync } from "@/model/Models";
import { Attributes, where } from "@sequelize/core"; import { Attributes, where } from "@sequelize/core";
import { getCookieAuth, userIsAdmin } from '../actions'; import { getCookieAuth, userIsAdmin } from '../actions';
import { ActionResult } from '../ActionResult'; import { ActionResult } from '../ActionResult';
@ -15,12 +15,46 @@ export async function deletePost(postID: number): Promise<ActionResult<boolean>>
return {result: true}; return {result: true};
} }
export async function getPostsWithBucketsAndProject(): Promise<ActionResult<PostAttributesWithBuckets[]>> { export type GetPostsAttributes = {
id: number;
title: string;
content: string;
description: string;
buckets: Attributes<Bucket>[];
user: Attributes<User>;
project: Attributes<Project>;
createdAt: Date;
updatedAt: Date;
}
export async function getPostsWithBucketsAndProject(): Promise<ActionResult<GetPostsAttributes[]>> {
await dbSync; await dbSync;
if(! await userIsAdmin()) return {error:"Unauthorized, not fetching Posts."} if(! await userIsAdmin()) return {error:"Unauthorized, not fetching Posts."}
const posts = await Post.findAll({include: [{association: Post.associations.buckets, include: Bucket.associations.attachments}, {association: Post.associations.project}], nest: false}); const posts = await Post.findAll({
console.dir(JSON.parse(JSON.stringify(posts)),{depth: 10, colors: true}) include: [
return {result:JSON.parse(JSON.stringify(posts))}; {association: Post.associations.buckets, include: Bucket.associations.attachments},
{association: Post.associations.user},
{association: Post.associations.project}],
nest: false
});
return {result:JSON.parse(JSON.stringify(posts.map((e:Post)=>{
return {
id: e.id,
title: e.title,
content: e.content,
description: e.description,
buckets: e.buckets ? e.buckets : [],
user: e.user,
project: {
id: e.project_id,
name: e.project ? e.project.name : "",
readableIdentifier: e.project ? e.project.readableIdentifier : "",
posts: e.project ? e.project.posts : []
},
createdAt: e.createdAt,
updatedAt: e.updatedAt
} as GetPostsAttributes
})))};
} }
export async function getPosts(): Promise<ActionResult<Attributes<Post>[]>> { export async function getPosts(): Promise<ActionResult<Attributes<Post>[]>> {
@ -32,6 +66,7 @@ export async function getPosts(): Promise<ActionResult<Attributes<Post>[]>> {
export async function updatePost(postAttributes: Partial<Attributes<Post>>): Promise<ActionResult<Attributes<Post>[]>> { export async function updatePost(postAttributes: Partial<Attributes<Post>>): Promise<ActionResult<Attributes<Post>[]>> {
await dbSync; await dbSync;
console.log(`testing postattributes projectid ${postAttributes.project?.id} ${postAttributes.project_id}`)
if(! await userIsAdmin()) return {error:"Unauthorized, not updating Post."} if(! await userIsAdmin()) return {error:"Unauthorized, not updating Post."}
const post = await Post.update(postAttributes, {where:{id:postAttributes.id}}); const post = await Post.update(postAttributes, {where:{id:postAttributes.id}});
return {result:JSON.parse(JSON.stringify(post))}; return {result:JSON.parse(JSON.stringify(post))};

View File

@ -1,21 +1,23 @@
import { ActionResult } from "@/app/lib/actions/ActionResult"; import { ActionResult } from "@/app/lib/actions/ActionResult";
import { handleActionResult } from "@/app/lib/actions/clientActionHandler"; 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 { Post, Project, Bucket, PostBucket, Attachment } from "@/model/Models";
import { PostAttributesWithBuckets } from "@/model/Post"; import { PostAttributesWithBuckets } from "@/model/Post";
import { DeepPartial } from "@/util/DeepPartial";
import { Attributes } from "@sequelize/core"; import { Attributes } from "@sequelize/core";
import { UUID } from "crypto"; import { UUID } from "crypto";
import { ChangeEventHandler, MouseEventHandler, useLayoutEffect, useRef, useState } from "react"; import { ChangeEventHandler, MouseEventHandler, useLayoutEffect, useRef, useState } from "react";
import { Accordion, AccordionBody, AccordionHeader, AccordionItem } from "react-bootstrap"; import { Accordion, AccordionBody, AccordionHeader, AccordionItem } from "react-bootstrap";
export type PostTableCallbacks = { export type PostTableCallbacks = {
savePost: (p:Partial<PostAttributesWithBuckets>)=>void; savePost: (p:Partial<Attributes<Post>>)=>void;
closeEditor: ()=>any; closeEditor: ()=>any;
uploadAttachment : ()=>any; uploadAttachment : ()=>any;
} }
export type EditorProps = { export type EditorProps = {
editorOpenState:boolean; editorOpenState:boolean;
openedPost:Partial<PostAttributesWithBuckets>; openedPost:GetPostsAttributes;
projects?:Attributes<Project>[]; projects?:Attributes<Project>[];
callbacks:PostTableCallbacks; callbacks:PostTableCallbacks;
} }
@ -24,7 +26,7 @@ export type EditorProps = {
export default function PostEditor(props:EditorProps){ export default function PostEditor(props:EditorProps){
let [content,setContent] = useState(props.openedPost?.content) let [content,setContent] = useState(props.openedPost?.content)
let [title,setTitle] = useState(props.openedPost?.title) 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); let textbox:any = useRef(undefined);
function adjustHeight(): void { function adjustHeight(): void {

View File

@ -20,12 +20,12 @@ import { useState } from "react";
import { Project, Post, Bucket } from "@/model/Models"; import { Project, Post, Bucket } from "@/model/Models";
import { ActionResult } from "@/app/lib/actions/ActionResult"; import { ActionResult } from "@/app/lib/actions/ActionResult";
import { handleActionResult } from "@/app/lib/actions/clientActionHandler"; 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"; import { PostAttributesWithBuckets } from "@/model/Post";
type Actions = { export type PostTableActions = {
deletePost: (id: number) => Promise<ActionResult<boolean>> deletePost: (id: number) => Promise<ActionResult<boolean>>
getPosts: () => Promise<ActionResult<PostAttributesWithBuckets[]>> getPosts: () => Promise<ActionResult<GetPostsAttributes[]>>
getProjects: () => Promise<ActionResult<Attributes<Project>[]>> getProjects: () => Promise<ActionResult<Attributes<Project>[]>>
savePost: (data: Partial<Attributes<Post>>) => Promise<ActionResult<Attributes<Post>[]>> savePost: (data: Partial<Attributes<Post>>) => Promise<ActionResult<Attributes<Post>[]>>
// uploadAttachment: ()=> Promise<ActionResult<any>> // uploadAttachment: ()=> Promise<ActionResult<any>>
@ -34,9 +34,9 @@ type Actions = {
type Props = { type Props = {
children?: ReactNode; children?: ReactNode;
headings: Array<string>; headings: Array<string>;
data: Partial<PostAttributesWithBuckets>[]; data: GetPostsAttributes[];
projects: Attributes<Project>[]; projects: Attributes<Project>[];
actions: Actions; actions: PostTableActions;
} }
const aifa = (a: ReactNode, b: ReactNode) => a ? a : b const aifa = (a: ReactNode, b: ReactNode) => a ? a : b
@ -61,14 +61,14 @@ export default function PostTable(props: Props) {
editorOpenState: false editorOpenState: false
}) })
} }
function showEditor(entry: Partial<PostAttributesWithBuckets>): void { function showEditor(entry: GetPostsAttributes): void {
setEditor({ setEditor({
editorOpenState: true, editorOpenState: true,
openedPost: entry openedPost: entry
}) })
} }
function deletePost(entry: Partial<PostAttributesWithBuckets>) { function deletePost(entry: GetPostsAttributes) {
if (!entry.id) return; if (!entry.id) return;
props.actions?.deletePost(entry.id) props.actions?.deletePost(entry.id)
.then(actionResult => { .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({ props.actions.savePost({
id: e.id, id: e.id,
content: e.content, content: e.content,
@ -102,12 +102,13 @@ export default function PostTable(props: Props) {
.then(res => handleActionResult(res)) .then(res => handleActionResult(res))
.then(getPostsWithBucketsAndProject) .then(getPostsWithBucketsAndProject)
.then(res => { .then(res => {
if (!res.error && res.result) setPosts(res.result); const result = handleActionResult(res);
if (result) setPosts(result);
}) })
closeEditor(); closeEditor();
}; };
function TableFields({ postData }: { postData: Partial<PostAttributesWithBuckets> }) { function TableFields({ postData }: { postData: GetPostsAttributes }) {
return [ return [
{ {
key: 'post-title', key: 'post-title',
@ -122,7 +123,8 @@ export default function PostTable(props: Props) {
}, { }, {
key: 'post-project', key: 'post-project',
content: aifa((projects.find((e) => { content: aifa((projects.find((e) => {
return (e.id == postData.project_id) console.log(e.id)
return (e.id == postData.project.id)
})?.readableIdentifier), 'uncategorized') })?.readableIdentifier), 'uncategorized')
}, { }, {
key: 'post-createdat', key: 'post-createdat',
@ -142,7 +144,7 @@ export default function PostTable(props: Props) {
); );
} }
function TableRow(props: {postData: Partial<PostAttributesWithBuckets>, headings: string | any[]}){ function TableRow(props: { postData: GetPostsAttributes, headings: string | any[] }) {
return <><tr key={props.postData.id}> return <><tr key={props.postData.id}>
<th key={`rowheading-post-${props.postData.id}`} scope="row">{props.postData.id}</th> <th key={`rowheading-post-${props.postData.id}`} scope="row">{props.postData.id}</th>
<TableFields key={`tableFields-${props.postData.id}`} postData={props.postData} /> <TableFields key={`tableFields-${props.postData.id}`} postData={props.postData} />
@ -169,10 +171,14 @@ export default function PostTable(props: Props) {
} }
return <> return <>
<EntityManagementTable entityName="Post" key="der-table" headings={props.headings}> <EntityManagementTable entityName="Post"
{posts.map((postData: Partial<PostAttributesWithBuckets>) => <TableRow headings={props.headings} key="der-table"
headings={props.headings}>
{posts.map((postData: GetPostsAttributes) =>
<TableRow headings={props.headings}
postData={postData} postData={postData}
key={postData.id}/> )} key={postData.id} />
)}
</EntityManagementTable> </EntityManagementTable>
</> </>
} }

View File

@ -4,15 +4,17 @@ import { tryFetchPosts } from "@/app/api/post/route";
import { constructAPIUrl } from "@/util/Utils"; import { constructAPIUrl } from "@/util/Utils";
import { ReactNode, useEffect } from "react"; import { ReactNode, useEffect } from "react";
import EntityManagementTable from "../../../client/EntityManagementTable"; import EntityManagementTable from "../../../client/EntityManagementTable";
import PostTable from "@/components/client/admin/PostTable"; import PostTable, { PostTableActions } from "@/components/client/admin/PostTable";
import { deletePost, getPostsWithBucketsAndProject, updatePost } from "@/app/lib/actions/entityManagement/postActions"; import { deletePost, getPostsWithBucketsAndProject, GetPostsAttributes, updatePost } from "@/app/lib/actions/entityManagement/postActions";
import { getProjects } from "@/app/lib/actions/entityManagement/projectActions"; import { getProjects } from "@/app/lib/actions/entityManagement/projectActions";
import { Bucket, Project, Post, dbSync, Attachment } from "@/model/Models"; import { Bucket, Project, Post, dbSync, Attachment } from "@/model/Models";
import { tryCreateAttachment } from "@/app/api/attachment/route"; import { tryCreateAttachment } from "@/app/api/attachment/route";
import { handleActionResult } from '../../../../app/lib/actions/clientActionHandler';
type Props = { type Props = {
children?:ReactNode children?:ReactNode
} }
async function getHeadings(){ async function getHeadings(){
let headings:string[] = ['#', 'Title', 'Content', 'Project', 'CreatedAt', 'UpdatedAt'] let headings:string[] = ['#', 'Title', 'Content', 'Project', 'CreatedAt', 'UpdatedAt']
@ -24,7 +26,7 @@ export default async function PostView(props:Props){
const headings = await getHeadings(); const headings = await getHeadings();
const actions = { const actions:PostTableActions = {
deletePost: deletePost, deletePost: deletePost,
getPosts:getPostsWithBucketsAndProject, getPosts:getPostsWithBucketsAndProject,
getProjects:getProjects, getProjects:getProjects,
@ -32,13 +34,13 @@ export default async function PostView(props:Props){
// uploadAttachment:tryCreateAttachment // 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)))); const projects = await Project.findAll().then(projects=>projects.map((e)=>JSON.parse(JSON.stringify(e))));
return ( return (
<div className="w-[100%] min-h-fit bg-gray-100 overflow-scroll"> <div className="w-[100%] min-h-fit bg-gray-100 overflow-scroll">
<div className="w-[100%] m-auto"> <div className="w-[100%] m-auto">
<PostTable data={posts} <PostTable data={posts ? posts : []}
projects={projects} projects={projects}
headings={headings} headings={headings}
actions={actions}> actions={actions}>