Implement logic to render 'shared cards' and 'my invitations' on settings page

[qisforq]

Objective:

Implement the logic to render the "Shared Cards" and "My Invitations" sections on the settings page, allowing users to view and manage their shared cards and invitations.

Sub-tasks:

1. Design the UI for the Shared Cards and My Invitations sections

   • [ ] Create wireframes or mockups for the Shared Cards and My Invitations sections on the settings page
   • [ ] Define the layout, card styles, and action buttons (e.g., "Revoke Access," "Accept," "Decline") for each section
   • [ ] Obtain approval from stakeholders on the design

2. Fetch shared cards and invitations data

   • [ ] Implement API endpoints in the backend to retrieve the list of shared cards and invitations for the authenticated user
   • [ ] Use appropriate query parameters or request payloads to filter the data based on the user's ID or other relevant criteria
   • [ ] Handle pagination or lazy loading if the datasets are large

3. Render the Shared Cards section

   • [ ] Create a new component or modify an existing one to display the list of shared cards
   • [ ] Iterate over the fetched shared cards data and render each card with the relevant details (e.g., card owner, card name)
   • [ ] Include action buttons (e.g., "Revoke Access") for each shared card, allowing the user to manage access permissions

4. Render the My Invitations section

   • [ ] Create a new component or modify an existing one to display the list of invitations received by the user
   • [ ] Iterate over the fetched invitations data and render each invitation with the relevant details (e.g., inviter's name, card name)
   • [ ] Include action buttons (e.g., "Accept," "Decline") for each invitation, allowing the user to respond to the invitations

5. Implement action button functionality

   • [ ] Create event handlers for the action buttons in both the Shared Cards and My Invitations sections
   • [ ] Implement the necessary API calls or state updates to perform the corresponding actions (e.g., revoking access, accepting/declining invitations)
   • [ ] Update the UI to reflect the changes made by the user's actions

6. Test and optimize

   • [ ] Conduct thorough testing of the Shared Cards and My Invitations sections, ensuring the data is rendered correctly and the action buttons function as expected
   • [ ] Optimize the performance by implementing caching, lazy loading, or pagination as needed
   • [ ] Gather user feedback and iterate on the design and functionality based on the feedback received

[qisforq]

Shared cards will use the same endpoint that #290 uses.

[chef-louis]

See #297 for reference of the API endpoint for a user's "owned" and "guest" cards

[qisforq]

Done - in branch referralsDataLogic - PR upcoming - type bug still being worked on