406 home page redesign

[OlenaReukova]

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review on my code
• I have made corresponding changes to the documentation (if any were needed)
• My changes generate no new warnings or errors
• I have added tests that prove my fix is effective or that my feature works
• New and previously existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules

Description

**Relates #406 and #405 OR Closes #406 and #405 **
Include here a short description of what behaviour this Pull Request introduces.
Outline any new dependencies introduced.

Files changed

Include one to two lines on the necessary changes to each file.

UI changes

If this PR includes changes to the UI include a screengrab of the alterations in review.

Changes to Documentation

Include an outline of why Documentation needed to be updated with this PR

Tests

Include a description of any tests added - if none have been added explain why.

[netlify]

👷 Deploy request for cool-creponne-3e1272 pending review.

Visit the deploys page to approve it

Name	Link
🔨 Latest commit	ca70ede

[OlenaReukova]

At the moment, I am building this section.

this is Figma design:

My question addresses an issue where the page displays only 4 item images instead of the 5 latest ones as required. The current Supabase settings limit the number of fetched items to 4. This was due to the previous functionality, but the problem arises when items are reserved or given away; they are not displayed, which should be changed.

CREATE OR REPLACE FUNCTION "public"."fetch_recently_added_items"() RETURNS TABLE("id" bigint, "created_at" timestamp with time zone, "item_name" "text", "imageSrc" "text")
    LANGUAGE "plpgsql"
    AS $$BEGIN
    RETURN QUERY 
    SELECT  
        items.id, 
        items.created_at, 
        items.item_name, 
        items."imageSrc"
    FROM 
        items
    WHERE
        items.given_away_to IS NULL
    AND
        items.is_reserved IS false
    ORDER BY 
        items.created_at DESC
    **LIMIT 4**;
END;$$;

To resolve this, the following updates are needed:

• Change the item fetching limitation from 4 to 5 items.
• Add logic to exclude items that are either reserved or given away.
• Modify the Supabase query to reflect these changes.

The updated SQL for the fetch_recently_added_items function:

CREATE OR REPLACE FUNCTION "public"."fetch_recently_added_items"() 
RETURNS TABLE("id" bigint, "created_at" timestamp with time zone, "item_name" "text", "imageSrc" "text")
LANGUAGE "plpgsql"
AS $$
BEGIN
  RETURN QUERY 
  SELECT  
      items.id, 
      items.created_at, 
      items.item_name, 
      items."imageSrc"
  FROM 
      items
  WHERE
      items.given_away_to IS NULL
  AND
      items.is_reserved IS false
  ORDER BY 
      items.created_at DESC
  LIMIT 5;
END;
$$;

We have two options:

1. Let's keep the current query and display three cards, or
2. Change the query limitation to 5.

I'll ask the UI/UX designers if it is essential to have 5 cards on the screen.
@nichgalzin @camelPhonso

[camelPhonso]

Hey @OlenaReukova

I think your solution looks really sensible. I don't really see a need to push back on the design, this is just a database query and should be very easily swapped for any new format we need.

I'd say just go ahead a create a new migration file with the updated script you've written and our automated workflows will take care it :)

[OlenaReukova]

@camelPhonso I’ve been a little busy recently, so I didn’t have the opportunity to continue working on the ticket. Thank you for your comment — I’ve now taken it into account and will continue from there. 😊