Feat/mock post api

[Driedoutjerky]

Summary

• Adds mock post API using localStorage
• Connected WritePostPage to create posts
• Connected MemoryArchivePage to load saved posts
• Connected ViewPostPage to display posts by route id
• Added delete post behavior in MemoryArchivePage and ViewPostPage
• Added navigation from archive to write post page

Notes

• This is still frontend mock data only.
• Attach an image feature doesn't work yet.
• localStorage is used temporarily until backend endpoints are connected.
• Authentication is intentionally not included yet.
• Date sync is not implemented yet.

Testing

Tested locally with:

npm run dev

This should open WritePostPage when you enter localhost:5173 (localhost:5173/write)

After test ends, to clear out your local storage, open DevTools console and run

localStorage.removeItem("memory_egg_posts");

Expected Output

Below is a demo video based on following the steps given as below. However, you may try anything crazy you want to, so we can find some unexpected bugs. Click on it to watch!

1. Memory tag selector in /write exists

• This chooses tag value for the post.
• Check later if the post is attached with the correct tag in archive page.

2. Memory Stats correctness

• Copy and paste the texts given below, to the text area in the write post page.

This study aims to investigate how AI-assisted cognitive walkthrough (CW) compares with human-led CW in explaining usability breakdowns in task-based interaction. Specifically, we compare human CW findings with AI-generated CW results to identify differences in coverage of issues, time required for analysis, and strength of evidence between steps and assessment. In addition, we test multiple AI models and prompt strategies to determine how the performance of AI differs depending on those factors. This study further seeks to translate these insights into recommendations for hybrid CW workflows of human and AI that balance speed and credibility, in the environment of evaluation of complex, multi-step IT services.

• Expected memory stat output should be shown as below.

3. Write post then press Post button.

• Afterwards, you will get an alert message, then should be redirected to localhost:5173/archive
• Alert message is as below.

• You should be able to see the post you've written in the archive page.

4. Check if Write Post functions as expected.

• Pressing Write Post makes you able to write a new post, redirecting you to localhost:5173/write
• Write another post for testing.

5. Post one more post, then check View button in archive page.

• Pressing View will redirect you to the view post page of that specific post.

6. Check if Delete Post functions as expected.

• In that view post page, try to press Delete Post button.
• An alert would pop up asking for confirmation, pressing cancel should not delete that post while pressing ok deletes that post.

• After deleting post, you should be automatically redirected to the archive page. not seeing the deleted page anymore.

7. check if mini Delete Post functions as expected in Archive Page.

• Press specific post, then press the button with symbol "⌫", an alert would pop up asking for confirmation.
• After deleting post, you should no longer see the deleted page.