Session Page

[SelinaBuff]

Title: Implementation of "Sessions" Area with Session Cards

Description:
Implement the "Sessions" area where all saved sessions of logged-in users (via Google or Microsoft login) are stored. Anonymous users will not have sessions saved; instead, they will be informed through a small info text accompanied by an "Info" icon. No immediate call to action for quick login will be implemented for now; users must log out and log in again via the new login screen with their Google or Microsoft profiles.

The structure remains mostly the same, with the header menu switch labeled as "Saved Sessions" instead of "Templates". Additionally, there is a different visual of Stan on the right side of the screen.

Requirements:

1. Session Card Structure:

   • General Structure:
     • Session Cards are elongated and occupy almost the entire section area, in contrast to the Template or Recommendation Cards.
     • Each Session Card must have a title. If the title is missing, a toast error message should appear.
     • Sessions can be favorited, with favorites always displayed at the top (Hierarchy: the most recently favorited session appears at the very top).
     • Sessions can be protected similarly to My Templates:
       1. Public (unprotected) - Icon: open
       2. Password protected - Icon: key
       3. Access by confirmation - Icon: closed lock
     • The description is optional.
   • Menu (top right) Options:
     • Edit
     • Share
     • Export
     • Delete
   • Information Areas:
     • Number of Columns & Column Titles (similar to Template Cards)
     • Date or Time of the session
     • Number of Participants
   • Primary Button:
     • Button labeled "Go to Session" for accessing the session.

2. User Interaction:

   • Session Editing:
     • Users can edit their sessions within the editing mask.
   • Share/Export Actions:
     • Clicking on "Share" or "Export" opens the Settings Dialog Window with a restricted menu selection where the respective action can be executed.

3. Design Specifications:

   • The design can be found in the Figma file under the "Template-/Sessionpage" section under Sessions -> Cards:
     • Available in light and dark mode.
     • Desktop and mobile versions.
     • With German translation (components in desktop light mode or as a comment).