huilensolis / pictura Goto Github PK

• Align the aside nav of the main application layout to match the padding that has the profile info below
  

• the button border should change the color when the the state is loading

• close session button must redirect you to /auth/log-in if the log-out is successful

• Add search page
• Add a search input and use the hook useDebouncedValue.
• Make the change of the value on the input change the URL "search" query.
• Using the supabase client, which you can get with the hook "useSupabase", fetch the posts from the table "posts" where the "title" equals the search query value and order it by the most recent to the oldest post.
• display the images in a grid. take how it is done in the src/app/(site)/app/profile/[username]/page.tsx as an example.

• Remove post options, post owner, etc. only leave the picture alone.
• Make the feed a new component in a separate file
• Move the post component to a separate file

• create a column on the DB to save the image width
• Create a column on the DB to save the image height
• add width and height info to the post request when posting a new image (Cloudinary response returns it)
• when displaying images, take that height and width to calculate the new image size on the grid layout and set that size for the image skeleton

the aside icons are not adapting to light mode when hovered
how to reproduce? go to app/settings/section/account

• Change the icon hover color to be a hundred less intense.
  

When you attempt to log in and the request fails, the loading status remains active, preventing the user from making new login attempts.

• get the grid container width
• calculate each item grid based in the container width
• calculate the size of the image rendered with that width
• set the height to the skeleton

when updating your profile or header picture, it doesn't delete the previous picture from Cloudinary
there is an endpoint on api/images/delete to delete images from Cloudinary.

• delete the previous picture when updating profile picture success
• refresh the page once the profile update request has succed

• after deleting a post, redirect the user to the last page, or to '/app' if it has no last page on history.

Build a class for the frontend routes, so when we want to redirect the user, we have the routes centralized in a class, and if we have for some reason to change them, we can do it in just one place.

remember to put the service on the "models/routing" folder!

Build a class for the api routes, so when we want to redirect the user, we have the routes centralized in a class, and if we have for some reason to change them, we can do it in just one place.

remember to put the service on the "services/routing" folder!

Add e2e tests with Playwright

• Add option to share it on Twitter
• Add option to share it on Linkedin
• Add option to copy the link to the clipboard

to reproduce, go to '/app' and look at the aside nav. it resizes after loading.

the page app/settings is missing a link to manage the account

• Add a link that redirects to app/settings/section/account
• Set the name of the link to "Account Options"
• Set the link icon to user-round-cog

• set the max length to 12 characters
• set the minimum length to 1 character

now we are managing the loading state of the button "log in" on src/app/(site)/(guest)/auth/log-in/page.tsx, but it is not reflecting correctly if it is loading or not, so we must

• create a use state to handle the loading state
• set loading true at the beginning of submitting the form
• set loading false at the end of submitting the form
• migrate the old loading state to the new use state (button loading and disabled state)