codersforcauses · KKatariah · Feb 14, 2026 · Copilot · Feb 14, 2026 · Copilot
diff --git a/client/documentation/admin-dashboard.md b/client/documentation/admin-dashboard.md
@@ -0,0 +1,63 @@
+# Admin Dashboard Documentation
+
+for admin dashboard docco pages:
-for admin dashboard docco pages:
+For admin dashboard documentation pages:
-for admin dashboard docco pages:
+For admin dashboard documentation pages:
+
+- each page should contain a list of the fields that need to be filled out to create a new entry and a short explanation of each
+- explain any noteworthy cases where filling out a field a certain way causes a major difference on the frontend. e.g. rendering an itch widget vs a non itch widget
+- for fields that need information to be filled from itch.io, a description of where to get this information from should be included
+- the process for adding, managing, and removing admin accounts who can access the admin site
+
+## Events
+
+The events section of the admin dashboard allows administrators to create and manage events that will be displayed on the frontend.
+Existing events will be listed in a table, and administrators can click on an event to edit its details or delete it if it is no longer relevant.
+To create a new event, administrators can click on the "Add Event" button in the top right, which will take them to a form where they can fill out the necessary information about the event.
+
+When creating a new event, there are several fields that need to be filled out.
+
+### Name
+
+Required
+
+**Name:** The name of the event. This is what will be displayed on the frontend and should be descriptive enough to give users an idea of what the event is about.
+
+### Date and Time
+
+Required
+
+**Date:** The date and time of the event. It has two fields, **Date** and **Time**.
+The **Date** field should be given in DD/MM/YYYY format, while the **Time** field should be given in HH:MM:SS format. This information is crucial for users to know when the event is taking place.
+
+### Description
+
+**Description:** A brief description of the event. This should provide users with more information about what to expect from the event and why they should attend, or alternatively what happened at the event if it is a past event.
+
+### Publication Date
+
+Required
+
+**Publication Date:** The date when the event was published on the frontend. This is important for users to know when the event was announced and can help them plan accordingly.
+
+### Cover Image
+
+Required
+
+**Cover Image:** An image that represents the event. This should be visually appealing and relevant to the event to attract users' attention. It will be displayed on the frontend alongside the event details.
+
+### Location
+
+Required
+
+**Location:** The location of the event. This can be a physical location or an online platform where the event will take place. Providing this information is essential for users to know where they need to go to attend the event.
+
+## Members
+
-
+
+The members section of the admin dashboard allows administrators to create and manage individual member profiles that appear on the frontend (for example, on an "Our Team" or "Members" page). When creating or editing a member, you will be asked to fill out the following fields.
+
+### Name
+
+Required
+
+**Name:** The member's full name as it should appear on the site. This is the primary identifier for the member and is displayed anywhere the member is shown on the frontend.
+
+### Active
+
+Required
+
+**Active:** A boolean toggle that controls whether this member is visible on the frontend.  
+- **Enabled (true):** The member will appear anywhere members are listed or featured on the site.  
+- **Disabled (false):** The member entry is kept in the system but is hidden from all public views.
+
+Use this field to temporarily hide members without deleting their profiles.
+
+### Profile Picture
+
+Optional (recommended)
+
+**Profile Picture:** An image representing the member (typically a headshot). This image is shown alongside the member’s name and other details on the frontend.
+
+- Use a clear, high‑quality image where the member’s face is visible.
+- A square or near‑square aspect ratio works best to avoid unexpected cropping.
+- If no image is provided, the frontend may display a default avatar or placeholder.
+
+### About
+
+Optional
+
+**About:** A short biography or description of the member. This text helps users understand who the member is and what they do.
+
+- Keep this reasonably concise so layouts are not broken by extremely long text.
+- You can use plain text; if richer formatting (links, line breaks) is supported, follow your content guidelines.
+
+### Pronouns
+
+Optional
+
+**Pronouns:** The pronouns the member uses (for example, `she/her`, `he/him`, `they/them`, or another set). These pronouns may be displayed next to the member’s name or in their profile.
+
+- Leave this blank only if the member prefers not to list pronouns publicly.
+- Enter exactly how the member wants their pronouns shown.
+
+### Social Media Links
+
+Optional (each field)
+
+**Social Media Links:** One or more URLs to the member’s social or personal profiles. Common fields include:
+
+- **Website:** The member’s personal site or portfolio (e.g., `https://example.com`).
+- **Twitter / X:** Link to the member’s Twitter/X profile (e.g., `https://twitter.com/username`).
+- **Instagram:** Link to the member’s Instagram profile.
+- **Twitch / YouTube / Other platforms:** Links to streaming or video channels.
+
+Notes:
+
+- Enter full URLs (including `https://`) so the links work correctly.
+- Only the social fields that are filled in will be displayed on the frontend. Empty fields are ignored.
+- The frontend may render these as icons; make sure each URL points to the correct profile.
-
+
+The members section of the admin dashboard allows administrators to create and manage individual member profiles that appear on the frontend (for example, on an "Our Team" or "Members" page). When creating or editing a member, you will be asked to fill out the following fields.
+
+### Name
+
+Required
+
+**Name:** The member's full name as it should appear on the site. This is the primary identifier for the member and is displayed anywhere the member is shown on the frontend.
+
+### Active
+
+Required
+
+**Active:** A boolean toggle that controls whether this member is visible on the frontend.  
+- **Enabled (true):** The member will appear anywhere members are listed or featured on the site.  
+- **Disabled (false):** The member entry is kept in the system but is hidden from all public views.
+
+Use this field to temporarily hide members without deleting their profiles.
+
+### Profile Picture
+
+Optional (recommended)
+
+**Profile Picture:** An image representing the member (typically a headshot). This image is shown alongside the member’s name and other details on the frontend.
+
+- Use a clear, high‑quality image where the member’s face is visible.
+- A square or near‑square aspect ratio works best to avoid unexpected cropping.
+- If no image is provided, the frontend may display a default avatar or placeholder.
+
+### About
+
+Optional
+
+**About:** A short biography or description of the member. This text helps users understand who the member is and what they do.
+
+- Keep this reasonably concise so layouts are not broken by extremely long text.
+- You can use plain text; if richer formatting (links, line breaks) is supported, follow your content guidelines.
+
+### Pronouns
+
+Optional
+
+**Pronouns:** The pronouns the member uses (for example, `she/her`, `he/him`, `they/them`, or another set). These pronouns may be displayed next to the member’s name or in their profile.
+
+- Leave this blank only if the member prefers not to list pronouns publicly.
+- Enter exactly how the member wants their pronouns shown.
+
+### Social Media Links
+
+Optional (each field)
+
+**Social Media Links:** One or more URLs to the member’s social or personal profiles. Common fields include:
+
+- **Website:** The member’s personal site or portfolio (e.g., `https://example.com`).
+- **Twitter / X:** Link to the member’s Twitter/X profile (e.g., `https://twitter.com/username`).
+- **Instagram:** Link to the member’s Instagram profile.
+- **Twitch / YouTube / Other platforms:** Links to streaming or video channels.
+
+Notes:
+
+- Enter full URLs (including `https://`) so the links work correctly.
+- Only the social fields that are filled in will be displayed on the frontend. Empty fields are ignored.
+- The frontend may render these as icons; make sure each URL points to the correct profile.
+## Committees
+
-
+
+The Committees section of the admin dashboard allows administrators to manage the list of committee members and the roles they hold in the club. Each committee entry links an existing member to a specific committee role so that the frontend can display the current committee correctly.
+
+When creating a new committee entry, there are two fields that need to be filled out.
+
+### Member ID
+
+Required
+
+**Member ID:** The unique identifier of the member who will hold this committee position. This should correspond to an existing entry in the **Members** section. Typically, you will either select the member from a dropdown list or enter their ID exactly as it appears in the Members table. If the person is not yet in the Members list, create a member entry first before assigning them a committee role.
+
+### Role
+
+Required
+
+**Role:** The position that the selected member holds on the committee. This determines how the member is labeled and ordered on the frontend. Only the following roles are supported:
+
+- **President:** The primary leader of the club; usually displayed first in the committee list.
+- **Vice-President:** Supports the President and may act as a deputy leader.
+- **Secretary:** Responsible for administration, minutes, and general club records.
+- **Treasurer:** Manages the club’s finances and budgeting information.
+- **Marketing:** Handles promotion, social media, and general publicity for the club.
+- **Events OCM:** Organising Committee Member focused on planning and running events.
+- **Projects OCM:** Organising Committee Member focused on long-term or technical projects.
+- **Fresher Rep:** Represents first-year members and helps communicate their needs to the committee.
+
+Administrators should choose the role value exactly from this list to ensure the frontend recognises and displays the committee member correctly.
-
+
+The Committees section of the admin dashboard allows administrators to manage the list of committee members and the roles they hold in the club. Each committee entry links an existing member to a specific committee role so that the frontend can display the current committee correctly.
+
+When creating a new committee entry, there are two fields that need to be filled out.
+
+### Member ID
+
+Required
+
+**Member ID:** The unique identifier of the member who will hold this committee position. This should correspond to an existing entry in the **Members** section. Typically, you will either select the member from a dropdown list or enter their ID exactly as it appears in the Members table. If the person is not yet in the Members list, create a member entry first before assigning them a committee role.
+
+### Role
+
+Required
+
+**Role:** The position that the selected member holds on the committee. This determines how the member is labeled and ordered on the frontend. Only the following roles are supported:
+
+- **President:** The primary leader of the club; usually displayed first in the committee list.
+- **Vice-President:** Supports the President and may act as a deputy leader.
+- **Secretary:** Responsible for administration, minutes, and general club records.
+- **Treasurer:** Manages the club’s finances and budgeting information.
+- **Marketing:** Handles promotion, social media, and general publicity for the club.
+- **Events OCM:** Organising Committee Member focused on planning and running events.
+- **Projects OCM:** Organising Committee Member focused on long-term or technical projects.
+- **Fresher Rep:** Represents first-year members and helps communicate their needs to the committee.
+
+Administrators should choose the role value exactly from this list to ensure the frontend recognises and displays the committee member correctly.
+## Game Contributors
+
-
+
+The **Game Contributors** section lets administrators link members to specific games and record what role they played in each game. These links are used on the frontend to display accurate credits for each game.
+
+When creating or editing a game contributor entry, the following fields must be filled out:
+
+### Game
+
+Required
+
+**Game:** The game this contribution belongs to. This is usually a dropdown or searchable list of existing games in the system. Select the game that the member worked on. If the game does not yet exist, you must first create it in the **Games** section before you can add contributors for it.
+
+### Member
+
+Required
+
+**Member:** The person who contributed to the selected game. This is typically a dropdown or searchable list of existing members. Select the member you want to credit. If the member is not listed, create them first in the **Members** section.
+
+### Role
+
+Required
+
+**Role:** A short text field describing how this member contributed to the game. Examples include "Programmer", "Artist", "Composer", "Designer", "Producer", or "QA". This value is shown on the frontend next to the member's name for that game.
+
+### Linking Members to Games
+
+To link a member to a game:
+
+- Go to the **Game Contributors** section in the admin dashboard.
+- Click the button to add a new game contributor.
+- Select the **Game** the contribution belongs to.
+- Select the **Member** you want to credit.
+- Enter the **Role** that describes their contribution.
+- Save the entry.
+
+You can repeat this process multiple times to add several contributors to the same game (for example, multiple artists or programmers). To change or remove a contributor, edit or delete the corresponding game contributor entry from the list.
-
+
+The **Game Contributors** section lets administrators link members to specific games and record what role they played in each game. These links are used on the frontend to display accurate credits for each game.
+
+When creating or editing a game contributor entry, the following fields must be filled out:
+
+### Game
+
+Required
+
+**Game:** The game this contribution belongs to. This is usually a dropdown or searchable list of existing games in the system. Select the game that the member worked on. If the game does not yet exist, you must first create it in the **Games** section before you can add contributors for it.
+
+### Member
+
+Required
+
+**Member:** The person who contributed to the selected game. This is typically a dropdown or searchable list of existing members. Select the member you want to credit. If the member is not listed, create them first in the **Members** section.
+
+### Role
+
+Required
+
+**Role:** A short text field describing how this member contributed to the game. Examples include "Programmer", "Artist", "Composer", "Designer", "Producer", or "QA". This value is shown on the frontend next to the member's name for that game.
+
+### Linking Members to Games
+
+To link a member to a game:
+
+- Go to the **Game Contributors** section in the admin dashboard.
+- Click the button to add a new game contributor.
+- Select the **Game** the contribution belongs to.
+- Select the **Member** you want to credit.
+- Enter the **Role** that describes their contribution.
+- Save the entry.
+
+You can repeat this process multiple times to add several contributors to the same game (for example, multiple artists or programmers). To change or remove a contributor, edit or delete the corresponding game contributor entry from the list.
+## Games
+
-
+
+The games section of the admin dashboard allows administrators to create and manage games that will be displayed on the frontend (for example on game listings or showcase pages).
+Existing games will be listed in a table, and administrators can click on a game to edit its details or delete it if it should no longer appear on the site.
+To create a new game, administrators can click on the "Add Game" button, which opens a form where all of the game fields below can be filled in.
+
+When creating or editing a game, the following fields are available:
+
+### Name
+
+Required
+
+**Name:** The display name of the game. This is shown on the frontend anywhere the game is listed or featured, so it should be clear and recognizable.
+
+### Description
+
+**Description:** A short description of the game. This is shown on the game’s detail card or page and should briefly explain what the game is, its genre, and any notable features. Aim for one or two short paragraphs.
+
+### Completion Status
+
+**Completion Status:** Indicates how finished the game is (for example: *Prototype*, *In Development*, *Complete*). This value may be displayed as a badge or label on the frontend, and can also be used to filter or group games. Choose the value that best reflects the current state of the project.
+
+### Active Status
+
+Required
+
+**Active:** A boolean flag (e.g. a checkbox or toggle) that controls whether the game is visible on the public site. When **Active** is enabled, the game can appear in lists and showcases. When it is disabled, the game remains in the admin dashboard but is hidden on the frontend.
+
+### Host URL
+
+**hostURL:** The main URL where the game can be played or downloaded. This is typically:
+
+- An itch.io game URL (for example: `https://your-name.itch.io/your-game`), or
+- Another hosting platform or custom website (for example: `https://example.com/your-game`).
+
+On the frontend, this URL may be used as:
+
+- The link that players click to open the game, and/or
+- A fallback when no embed widget is available (for non-itch games).
+
+Make sure the URL is publicly accessible and points directly to the game or its landing page.
+
+### Itch Embed ID
+
+**itchEmbedID:** This field is used only for games hosted on itch.io and enables the frontend to render an embedded itch widget (usually inside an `<iframe>`) instead of just a simple link.
+
+When **itchEmbedID** is provided:
+
+- The frontend can render the interactive itch.io widget for the game.
+- Players can see and sometimes play or download the game directly from the site without leaving the page.
+
+When **itchEmbedID** is **not** provided:
+
+- The frontend falls back to rendering a non-itch widget, which is typically a static card with a thumbnail, text, and a button or link using **hostURL**.
+- This is the expected behavior for games that are not on itch.io or for itch games where embedding is not desired.
+
+#### Where to find the itchEmbedID on itch.io
+
+1. Open the game’s page on itch.io in your browser (for example: `https://your-name.itch.io/your-game`).
+2. Look for the "Embed" or "Embed game" option on the page (this is usually available to the game owner in the itch.io dashboard).
+3. Itch.io will show you an HTML `<iframe>` embed code that looks similar to:
+
+   ```html
+   <iframe src="https://itch.io/embed/1234567?linkback=true" width="552" height="167"></iframe>
-
+
+The games section of the admin dashboard allows administrators to create and manage games that will be displayed on the frontend (for example on game listings or showcase pages).
+Existing games will be listed in a table, and administrators can click on a game to edit its details or delete it if it should no longer appear on the site.
+To create a new game, administrators can click on the "Add Game" button, which opens a form where all of the game fields below can be filled in.
+
+When creating or editing a game, the following fields are available:
+
+### Name
+
+Required
+
+**Name:** The display name of the game. This is shown on the frontend anywhere the game is listed or featured, so it should be clear and recognizable.
+
+### Description
+
+**Description:** A short description of the game. This is shown on the game’s detail card or page and should briefly explain what the game is, its genre, and any notable features. Aim for one or two short paragraphs.
+
+### Completion Status
+
+**Completion Status:** Indicates how finished the game is (for example: *Prototype*, *In Development*, *Complete*). This value may be displayed as a badge or label on the frontend, and can also be used to filter or group games. Choose the value that best reflects the current state of the project.
+
+### Active Status
+
+Required
+
+**Active:** A boolean flag (e.g. a checkbox or toggle) that controls whether the game is visible on the public site. When **Active** is enabled, the game can appear in lists and showcases. When it is disabled, the game remains in the admin dashboard but is hidden on the frontend.
+
+### Host URL
+
+**hostURL:** The main URL where the game can be played or downloaded. This is typically:
+
+- An itch.io game URL (for example: `https://your-name.itch.io/your-game`), or
+- Another hosting platform or custom website (for example: `https://example.com/your-game`).
+
+On the frontend, this URL may be used as:
+
+- The link that players click to open the game, and/or
+- A fallback when no embed widget is available (for non-itch games).
+
+Make sure the URL is publicly accessible and points directly to the game or its landing page.
+
+### Itch Embed ID
+
+**itchEmbedID:** This field is used only for games hosted on itch.io and enables the frontend to render an embedded itch widget (usually inside an `<iframe>`) instead of just a simple link.
+
+When **itchEmbedID** is provided:
+
+- The frontend can render the interactive itch.io widget for the game.
+- Players can see and sometimes play or download the game directly from the site without leaving the page.
+
+When **itchEmbedID** is **not** provided:
+
+- The frontend falls back to rendering a non-itch widget, which is typically a static card with a thumbnail, text, and a button or link using **hostURL**.
+- This is the expected behavior for games that are not on itch.io or for itch games where embedding is not desired.
+
+#### Where to find the itchEmbedID on itch.io
+
+1. Open the game’s page on itch.io in your browser (for example: `https://your-name.itch.io/your-game`).
+2. Look for the "Embed" or "Embed game" option on the page (this is usually available to the game owner in the itch.io dashboard).
+3. Itch.io will show you an HTML `<iframe>` embed code that looks similar to:
+
+   ```html
+   <iframe src="https://itch.io/embed/1234567?linkback=true" width="552" height="167"></iframe>
+## Art
+
+## Game Showcases
-## Game Showcases
+## Game Showcases
+
+The Game Showcases section of the admin dashboard allows administrators to create and manage entries that highlight individual games on the frontend.
+Each showcase entry is typically displayed in a list or grid of featured games, along with a short piece of descriptive text.
+
+When creating a new game showcase entry, the following fields need to be filled out.
+
+### Game
+
+Required
+
+**Game:** The title or identifier of the game being showcased.
+This should match the name used for the game on the frontend (and, if applicable, on external platforms such as itch.io) so that users can easily recognize it.
+Depending on how the admin UI is implemented, this may be a free-text field or a selection from existing games; in either case, choose the game that you want to appear in the showcase.
+
+### Description
+
+Required
+
+**Description:** A short paragraph or blurb describing the showcased game.
+This text is shown alongside the game on the frontend to explain what the game is about, why it is being featured, and any key details you want users to notice.
+Keep this description concise and user-facing; avoid internal notes or admin-only comments, as this content is rendered directly to visitors.
-## Game Showcases
+## Game Showcases
+
+The Game Showcases section of the admin dashboard allows administrators to create and manage entries that highlight individual games on the frontend.
+Each showcase entry is typically displayed in a list or grid of featured games, along with a short piece of descriptive text.
+
+When creating a new game showcase entry, the following fields need to be filled out.
+
+### Game
+
+Required
+
+**Game:** The title or identifier of the game being showcased.
+This should match the name used for the game on the frontend (and, if applicable, on external platforms such as itch.io) so that users can easily recognize it.
+Depending on how the admin UI is implemented, this may be a free-text field or a selection from existing games; in either case, choose the game that you want to appear in the showcase.
+
+### Description
+
+Required
+
+**Description:** A short paragraph or blurb describing the showcased game.
+This text is shown alongside the game on the frontend to explain what the game is about, why it is being featured, and any key details you want users to notice.
+Keep this description concise and user-facing; avoid internal notes or admin-only comments, as this content is rendered directly to visitors.