Nikolas/feature/603 implement directus to gallery page

[bhi049]

📄 Pull Request Overview

Closes #603

This PR implements dynamic Gallery data fetching from Directus CMS.

🔧 Changes Made

1. Directus integration for Gallery

• Fetches photo_object, photo_version, and category data from Directus using existing API infrastructure.
• Includes all required relations and translation fields (translations, category.translations, preview/full.translations).

2. Translation handling

• Added support for translated title, author, and description on photo_object.
• Language selection is handled via getLanguageCode and centralized translation helpers.

3. Post-fetch typing

• Gallery data is mapped and typed after retrieval in useGetDirectusGalleryImages, following existing project conventions for Directus relations.

4. Picture Gallery page update

• Replaced mock/static gallery data with Directus-driven content.

5. Content validation

• Added test content in Directus to verify correct rendering in the frontend.

---

✅ Checklist Before Submission

• Functionality: I have tested my code, and it works as expected.
• JSDoc: I have added or updated JSDoc comments for all relevant code.
• Debugging: No console.log() or other debugging statements are left.
• Clean Code: Removed commented-out or unnecessary code.
• Tests: Added new tests or updated existing ones for the changes made.
• Documentation: Documentation has been updated (if applicable).

---

📝 Additional Information

Provide any additional context or information that reviewers may need to know:

• Screenshots:

• Dependencies: None
• Known Issues: None at this time

[Rutjake]

Good Work!
I suggest optimizing the search to prevent unnecessary backend load. By implementing a simple Debounce using e.g. useEffect and setTimeout, we ensure that the API request is only fired after the user has stopped typing for a brief moment (e.g., 500ms). This significantly reduces the number of requests sent to Directus while typing."

Something has happened to the size of the SectionGallery block:

it should remain the same as what was done to the frontend before:

[bhi049]

@Rutjake I checked the current implementation and, as far as I can see, the search only performs client-side filtering on already fetched data. It doesn’t trigger additional Directus requests while typing.

[Skoivumaki]

Everything good 👍

[Skoivumaki]

@Rutjake I checked the current implementation and, as far as I can see, the search only performs client-side filtering on already fetched data. It doesn’t trigger additional Directus requests while typing.

This seems correct. However the idea is a must if Directus were to have hundreds of images and would have to be optimized by limiting query size. For now, I don't find this issue severe enough for it to require further optimization.