andreas/portfolio2023
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

ya

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/lib/actions/clientActionHandler.ts
View File

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

45
src/app/lib/actions/entityManagement/postActions.ts
View File

@ -1,7 +1,7 @@
'use server';
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 { getCookieAuth, userIsAdmin } from '../actions';
import { ActionResult } from '../ActionResult';
@ -15,12 +15,46 @@ export async function deletePost(postID: number): Promise<ActionResult<boolean>>
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;
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});
console.dir(JSON.parse(JSON.stringify(posts)),{depth: 10, colors: true})
return {result:JSON.parse(JSON.stringify(posts))};
const posts = await Post.findAll({
include: [
{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>[]>> {
@ -32,6 +66,7 @@ export async function getPosts(): Promise<ActionResult<Attributes<Post>[]>> {
export async function updatePost(postAttributes: Partial<Attributes<Post>>): Promise<ActionResult<Attributes<Post>[]>> {
await dbSync;
console.log(`testing postattributes projectid ${postAttributes.project?.id} ${postAttributes.project_id}`)
if(! await userIsAdmin()) return {error:"Unauthorized, not updating Post."}
const post = await Post.update(postAttributes, {where:{id:postAttributes.id}});
return {result:JSON.parse(JSON.stringify(post))};

10
src/components/client/admin/PostEditor.tsx
View File

@ -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();}

82
src/components/client/admin/PostTable.tsx
View File

@ -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>
</>
}

18
src/components/server/admin/views/PostView.tsx
View File

@ -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>