Feat: Implement Albums UI

[rahulharpal1603]

Note:

If you are already working on an assigned issue, you cannot take this up unless the previous ones are closed.

Description:

https://pictopy-new-frontend.vercel.app/albums

Visit the above prototype website and see how the album UI looks. The backend part of the album feature is completed, and the UI is left. See screenshots below.

The API endpoints are present here: https://www.postman.com/aossie-pictopy/pictopy/folder/tnulwoe/albums

Tasks:

• Use standard ShadCN components to create the UI. (Refer to other components)
• Store all the state information using Redux only. (Refer to similar files to know how to create a Redux slice and store the query results)
• Use only usePictoQuery and usePictoMutation to handle API calling.
• Utilize the standard infoDialogSlice.ts and loaderSlice.ts to display dialog messages and loaders, respectively.

Screenshots:

[Swaim-Sahay]

Hey @rahulharpal1603
Issue: Album UI Implementation

Description
The backend for the album feature is completed, but the UI is pending. The task is to implement the frontend UI for albums based on the prototype and provided screenshots, while ensuring integration with the existing architecture.

Benefits
-Provides a complete, user-friendly album feature
-Maintains UI/UX consistency by following ShadCN components
-Ensures predictable state management with Redux
-Improves contributor workflow with standardized API handling and loaders/dialogs

Suggested Fix
-Use standard ShadCN components for the album UI (refer to existing components for consistency)
-Store all state information with Redux
-Create a Redux slice for album queries and results
-Handle API calls strictly with usePictoQuery and usePictoMutation
-Use infoDialogSlice.ts for showing dialog messages (success/error/info)
-Use loaderSlice.ts for displaying loaders during API requests
-Ensure responsiveness and accessibility across devices

Please assign this issue to me.

Thank you

[Aditya30ag]

I would like to work on this please assign this to me

[rahulharpal1603]

Please go ahead @Swaim-Sahay

[rahulharpal1603]

@Swaim-Sahay

https://pictopy-new-frontend.vercel.app/ai-tagging

On this prototype website's page, there is an option to select the photos. So to add photos to an album, we first select photos and then choose an option to add to an album.

While implementing Albums UI, you need to add this select button also, but in the Home page, not the AI-Tagging page.

[SiddharthJiyani]

@rahulharpal1603 Since its been a month and there is not much progress in the PR, can i take up the issue ?

[rahulharpal1603]

@Swaim-Sahay
Any update on the PR? If not, then I am assigning it to someone else.