Skip to content

Implemented InfoCard, ItemCard and SearchResultCard components - #194

Merged
jkrumboe merged 1 commit into
dev-uifrom
dev-ui-simon
Dec 14, 2025
Merged

Implemented InfoCard, ItemCard and SearchResultCard components#194
jkrumboe merged 1 commit into
dev-uifrom
dev-ui-simon

Conversation

@simonImf

Copy link
Copy Markdown
Contributor

Few things to mention:

  • in the mock-up the license was shown as a tag underneath the description on the SearchResultCard. I changed the postiotion of the license badge to be on the top right of the card.
  • I capitalized the 'label' string of the InfoCard as a minor design choice, can be changed but I thought it looked good.

@simonImf
simonImf requested a review from jkrumboe December 14, 2025 15:37
@simonImf simonImf added UI enhancement New feature or request labels Dec 14, 2025

@jkrumboe jkrumboe left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good

@jkrumboe
jkrumboe merged commit 3af15c9 into dev-ui Dec 14, 2025
RobinGummels pushed a commit that referenced this pull request Feb 3, 2026
* feat: initialize Vue 3 project with Vite and packages

* feat: Added project folder structure

* feat, styling: css vars, base, reset

* feat: Add README, project structure, and styling guide documentation

* UI component structure (#182)

* feat: initialize Vue 3 project with Vite and packages

* feat: Added project folder structure

* feat, styling: css vars, base, reset

* feat: Add README, project structure, and styling guide documentation

* feat: lucide icons

* feat: removed the default HelloWorld component

* feat: filter, navbar, search result component and search section

* feat: box-shadow for the section divider
style: cleaned up some artifacts from the logo

* feat: changed title and package name to STAC Atlas

* chore: removed vite.svg

* chore: removed vue.svg

* feat: Implement InfoCard, ItemCard and SearchResultCard components (#194)

Cards for the display of the Search Result and also for the collection/ catalog page

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* UI | Mockup recreated: Collections page, little adjuments to style base etc (#198)

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* feat: update button styles and add contact popover in CollectionDetail view

* style: fixed witdh of the apply filter button

* style: map button, apply button behave like the others now

* UI | Style fixes, Copy element for contact (#199)

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* feat: update button styles and add contact popover in CollectionDetail view

* style: fixed witdh of the apply filter button

* style: map button, apply button behave like the others now

* chore: removed mockup data

* feat: route gitignore

* feat: showing the collections from /collections in the result list

* feat: enhance filter section layout and improve search result card tag display

* style: refine search result card layout and improve text overflow handling

* feat: implement pagination for collections in Home.vue and adjust max-height in search results

* style: remove fixed height from card header and add styles for first button in card footer

* style: enhance active pagination button styles for better visibility

* feat: implement loading and error states in CollectionDetail.vue, enhance API integration for fetching collection data

* style: width problem collection page, scolll items

* chore: switched to the apis collections/:id in the ui

* style: calender icon response to dark & light mode

* chroe: removed svg for language button
style: slightly thicker border for nav-buttons

* style: added a slight highlight to input/ interaction buttons

* style: update dark mode colors for text and adjust tag background

* style: smaller vertical padding for select options

* feat: source and contact are shown when clicked

* feat: search functionality

* style: centered the paging icon
chore: view css folder to seperate style and content

* feat: removed the unnecessary Filter Header

* feat: add bounding box drawing functionality and integrate with filter section

* API integrated in the UI (#206)

* feat(api): initialize STAC Atlas API with collections, conformance, and queryables routes

- Added package.json for project dependencies and scripts.
- Implemented GET endpoint for collections.
- Created conformance endpoint to list supported conformance classes.
- Developed landing page for the API with links to collections and documentation.
- Added queryables endpoint to return queryable properties for collections. (If i'm correct this can be removed)

* Added all Remarks to the bid and finished it (#74)

* changed Texts 1,2 and 8 according to the remarks of the customer

* Did my fixes to 4. and 10.3

* added remark why we want to save every catalog

* deleted keywords for catalog

* changed everything related to the database component

* Updated 3.1, 3.3, 3,4 (References to Lastenheft/small other changes)

* Added small Graph to 3. Produktumgebung

* Update bid.md 7.3STAC-Validator

added the handling of collections that cannot be validated automatically.

* Update bid.md 7.3STAC-API-Validator

changed the way we validate the collection search extension.

* Update bid.md 9.3.2Endpunkte

small fix collection search extension.

* added Skizze for 3, and updated 6.1, 10.1

* Updated 3. Produktumgebung

* Update bid.md 7.Qualitätsanforderungen

minor fixes

* Update 6.4.2 added remark about loading feedback

* Minor change to Table in "11 Zeitplan". A collum was missing in the head, therefore the table wasn't rendering correctly..

* fix(api): enhance STAC API landing page and conformance links
- Overhaul of first idea landing page
- Added some more tests for the required elements in the landingpage-Catalog

* feat(api): implement shared conformance URIs and add tests for conformance endpoint
- implemented condormance endpoint

* Implemented 2.3 and 2.4 (#111)

* Temporary mock data for testing and frontend development

* Added API middleware layer for error handling and validation

* TODOs ready? pls review

* Added API utilities for query parsing, validation, and response formatting

* Added swagger and openapi.yaml

* Update queryables.js

Refactor queryables endpoint into /collections/queryables

* Renamed the collections.js file to mocks-collections.js to better reflect its purpose and improve project clarity

* changed README "Projektstruktur"

* restart from dev-api 22.11..2025

* API: 2.3 Implement Collections List Endpoint done (added explanations as comments in the code)

* API: 2.4 Implement Single Collection Endpoint (added explanations as comments in the code)

* Update api/routes/collections.js

* Changed some of the code with the comments on Github (i will finish  it tomorrow morning)

* Implement most of the feedback and comments (need to talk about some other changes)

* Update api/routes/index.js

Changed wording from `/collections/queryables` to `/collections-queryables`

* Update api/README.md

Changed wording from `/collections/queryables` to `/collections-queryables`

* Update api/README.md

Removed missing folder

* Update api/routes/collections.js

Removed TODOs from wrong lines

* Update api/routes/collections.js

Added TODOs

* Update api/routes/queryables.js

Changed wording from `/collections/queryables` to `/collections-queryables`

* Update api/routes/queryables.js

Changed wording from `/collections/queryables` to `/collections-queryables`

* feat(api): add collection search parameters and validation middleware (#159)

* feat(api): add collection search parameters and validation middleware

* Added unit-test for validator-functions and integration-tests for `GET /collections`-Querys.
- Also minor bugfix, because the validator accepted deecimals as tokens.

* API: 3 Database Integration first version (#161)

* database connection in implementated. The parameters for the connection have to added in the .env-file.
Also there is test-file for testing and console messages

(installed `pg`)

* support for spatial queries via postgis + error handling for datatbase operations

changed language to english

* error handling

* added DATABASE_URL

There is an issue with the distance query. Changed the error handling and testing, the console messages are now way better structured

* found the Problem with the distance query. The layer are so big, that they reach over the 180° long (PostgGIS can't handel that). Now the calc is done by degree and not meters.

* The two files `test-data-retrieval.js` and `verify-schema.js` have been added.

`test-data-retrieval` (theoretical, checks against the spezification):
```
Discovers all tables and columns and validates against expected schema.
```

The second files `verify-schema.js` (practical, checks against the real data):
```
Discovers all tables and columns, validates against expected schema
```

* pooling error hanling and log imporoved.
renamed tests files to actual test-files

* standalone node tests were convertad into JEST

* write file `validateRequest.js`. Validates every incoming API request, whether the request is valid and logical.

* commented `stac_id` from the tests, it is not in both databases, so the tests for `stac_id` will always fail
Added explanation to the `.env.example`, which port is which database

* added example pattern for API - database connection.

* deleted `validateRequest` cause it's already implemented by @RobinGummels

* Added a CI/CD Pipeline to prevent pull-requests without functioning tests and proper linting.

* fixed errors suggested by the linter.
- Some lines used tab and spaces...

* Implemented Collection Search extension including a DB-Connection (#165)

* added SQLQuery-builder with these parameters: q,bbox,datetime,sortby,limit and token

* finalised bbox and datetime

* adapted to DB, QueryBuilder and added helperfunction runQuery

* added question-TODOs

* added bbox+datetime to the Query-Builder from Jonas

* added tests for Query-Builder from Jonas

* added tests from George

* added falsely deleted TODOs again

* fixed collumn names to match our DB and adjusted full text search to match 05_indexes.sql correctly

* Used a formatter and linter on `buildCollectionSearchQuery.js

* Did some major and minor fixes to the collection search.

- Updated `buildCollectionSearchQuery` to support pagination and improved text search with English language settings.
- Modified tests in `buildCollectionsSearchQuery.basic.test.js`, `collections-pagination.test.js`, and `collections-sort.test.js` to reflect new query behavior and validation logic.
- Enhanced sort validation in `validators.test.js` and `collectionSearchParams.js` to map API fields to database column names.
- Implemented total count retrieval for matched results in `collections.js`.

* Added a internal .env creation in the CI/CD Pipeline. It utilzes GitHub Repository Secrets to not publish any private Logins and stuff.

* Forgot that the second Job of the CI/CD pipeline runs seperatly and needs a internal .env file too.

* Enhance documentation for buildCollectionSearchQuery

Updated the documentation for:
- the buildCollectionSearchQuery function
- the fulltextsearch

* Refactor buildCollectionSearchQuery and updated SELECT part

Changed the SELECT part to match our bid and the database shema. Updated comments and for clarity. Changed full-text search to use 'simple' configuration instead of 'english'.

* Update api/routes/collections.js

small typo

* Remove sorting TODO from collections route

Removed TODO comment about sorting based on sortby parameter.

* Explicitly return undefined for normalized in validateSortby

Update validateSortby function to explicitly return undefined for normalized when sortby is not provided.

* small fix in buildCollectionSearch.fulltext.test.js

Change plainto_tsquery language from 'english' to 'simple'

* Fix duplicate SELECT keyword in query

Remove duplicate 'SELECT' keyword in SQL query.

* Fix missing newline at end of collectionSearchParams.js

* Fixed missing bracket in collectionSearchParams.js

* Refactor validateSortby for optional parameter handling

Refactor validateSortby function to handle optional sortby parameter and improve validation logic.

* Stabilize API test pipeline by running Jest in-band with extended timeout

Run Jest in CI with --runInBand and a higher default --testTimeout to stabilize database-backed integration tests.

Multiple Jest workers were competing for the same PostgreSQL connection pool and some long-running /collections queries exceeded the default 5s timeout, causing failures in existing test suites (e.g. collectionSearch and DBconnection).

* Fixed leaking tests that blocked CI/CD-Pipeline.
- Added a global Teardown for jest and force-exited the tests to prevent leaking.
- Made a change to db_APIconnection to only log the pool-(dis)connection if it isn't run in a test enviroment.

* Did a minimum amount of Formatting to the discription

* Used `npm audit fix --force` to fix all vulnerabilties in our used packages.

* Fixed curious doublechecking for empty Strings for the sortby-Parameter.
- Now we only check once for a empty sortby
- And added a test which distinguish between `sortby=""` and `sortby="+"`

* Update api/routes/collections.js

Removed the TODO about switching from mock-data to the real db

* Removed globalTeardown as i brought up some problems corresponding to long db-queries (for example BBOX). Instead i increased the maximal testTimeout.

* Update api/.env.example

* latest database Version  (#187) with `stac_id` and changed definition of `primary Keys`

* added `.env`

* added environment for docker-compose.yml
now every connection-details are inside an `.env`. There is an `example.env` for better understanding which need to be set as connection details

* added description of how to use the `.env` and `example.env` in the `README.md`

* changed a few things
e.g. DB_PORT --> ${DB_PORT}

* now, everthing should be done.

my god, help. sorry

* layout issues fixed

* Fixed Typo/incomplete Sentence in README.md

* added `stac_id` for collections

* all IDs are now written in the newer PostgrSQL standart:

```SQL
id SERIAL PRIMARY KEY,
```
changed to
```SQL
id INTEGER PRIMARY KEY GENERATED ALWAYS AS IDENTITY,
```

* changed `extend` to `extent`.

* Changed language used in `./api/README.md` from german to english.

I wanted to thsi anyway at some point, but this is now more like a Test-commit to see if the CI/CD Pipeline triggers...

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* feat: update button styles and add contact popover in CollectionDetail view

* style: fixed witdh of the apply filter button

* style: map button, apply button behave like the others now

* chore: removed mockup data

* feat: route gitignore

* feat: showing the collections from /collections in the result list

* feat: enhance filter section layout and improve search result card tag display

* style: refine search result card layout and improve text overflow handling

* feat: implement pagination for collections in Home.vue and adjust max-height in search results

* style: remove fixed height from card header and add styles for first button in card footer

* style: enhance active pagination button styles for better visibility

* feat: implement loading and error states in CollectionDetail.vue, enhance API integration for fetching collection data

* style: width problem collection page, scolll items

* Added `GET /collections/{id}`-Endpoint, more Fields in the responses and more Queryables-Parameters (#204)

* Updated Query-Builder to get all necessary fields from all db_tables for collections. Added some tests and fixed some already existing tests, becuase now the tablenames start with the alias `c.`.

* Updated Query-Builder to get all necessary fields from all db_tables for collections. Added some tests and fixed some already existing tests, becuase now the tablenames start with the alias `c.`.

* Added `openapi.yaml` (now http://localhost:3000/api-docs/ is working).
- needed to do some modifying to the app.js

* Added discription on how to use `stac-api-validator`. Currently we are onyl valid to `core`.

* Changed API-Version name to 1.1.0 instead of 1.0.0

* Revert "API is now responding with all necessary fields for each collection" (#195)

Reverts #185
@SonkeHoffmann accidentally didn't squash correctly.

* Revert "Revert "API is now responding with all necessary fields for each collection"" (#185) (#195) (#196)

dev-api: prepare v1.1.0 + API docs + query builder fixes

- Change API version to 1.1.0
- Add OpenAPI spec so /api-docs works locally
- Document stac-api-validator usage
- Update api/.env.example
- Query builder: select required fields for collections across db_tables; adjust tests (alias `c.`)

Commits included:
- 34bf962 Changed API-Version name to 1.1.0 instead of 1.0.0
- b047389 Added description on how to use `stac-api-validator` (currently only valid for `core`)
- b811288 Added `openapi.yaml` (so http://localhost:3000/api-docs/ works); modified app.js accordingly
- 6e5ab3e Merge branch 'dev-api-robin' of github.com:SpatioCore/STAC-Atlas into dev-api-robin
- 70dc043 Updated Query-Builder to get all necessary fields from all db_tables for collections. Added tests and fixed existing tests (table names now start with alias `c.`)
- d83eeb4 Update api/.env.example
- 5a7af5b Updated Query-Builder to get all necessary fields from all db_tables for collections. Added tests and fixed existing tests (table names now start with alias `c.`)

* Implement more Queryable-Fields and add the keywords-field to q fulltext search (#200)

* Add provider and license filters to collection search API

- Updated buildCollectionSearchQuery to include provider and license parameters for filtering collections.
- Enhanced validateCollectionSearchParams middleware to validate provider and license query parameters.
- Modified collections route to handle new provider and license filters in search queries.
- Implemented validation functions for provider and license parameters in collectionSearchParams.

* Add validation tests for provider and license

* Enhance full-text search by including keywords in the tsvector expression and update related tests

* Add provider and license to query parameter extraction in collection search validation

* Revert "Enhance full-text search by including keywords in the tsvector expression and update related tests"

This reverts commit 872443d.

* Implement GET /collections/{id} endpoint with validation and QueryBuilder integration (#186)

* added SQLQuery-builder with these parameters: q,bbox,datetime,sortby,limit and token

* finalised bbox and datetime

* adapted to DB, QueryBuilder and added helperfunction runQuery

* added question-TODOs

* added bbox+datetime to the Query-Builder from Jonas

* added tests for Query-Builder from Jonas

* added tests from George

* added falsely deleted TODOs again

* fixed collumn names to match our DB and adjusted full text search to match 05_indexes.sql correctly

* Used a formatter and linter on `buildCollectionSearchQuery.js

* Did some major and minor fixes to the collection search.

- Updated `buildCollectionSearchQuery` to support pagination and improved text search with English language settings.
- Modified tests in `buildCollectionsSearchQuery.basic.test.js`, `collections-pagination.test.js`, and `collections-sort.test.js` to reflect new query behavior and validation logic.
- Enhanced sort validation in `validators.test.js` and `collectionSearchParams.js` to map API fields to database column names.
- Implemented total count retrieval for matched results in `collections.js`.

* Added a internal .env creation in the CI/CD Pipeline. It utilzes GitHub Repository Secrets to not publish any private Logins and stuff.

* Forgot that the second Job of the CI/CD pipeline runs seperatly and needs a internal .env file too.

* Enhance documentation for buildCollectionSearchQuery

Updated the documentation for:
- the buildCollectionSearchQuery function
- the fulltextsearch

* Refactor buildCollectionSearchQuery and updated SELECT part

Changed the SELECT part to match our bid and the database shema. Updated comments and for clarity. Changed full-text search to use 'simple' configuration instead of 'english'.

* Update api/routes/collections.js

small typo

* Remove sorting TODO from collections route

Removed TODO comment about sorting based on sortby parameter.

* Explicitly return undefined for normalized in validateSortby

Update validateSortby function to explicitly return undefined for normalized when sortby is not provided.

* small fix in buildCollectionSearch.fulltext.test.js

Change plainto_tsquery language from 'english' to 'simple'

* Fix duplicate SELECT keyword in query

Remove duplicate 'SELECT' keyword in SQL query.

* Fix missing newline at end of collectionSearchParams.js

* Fixed missing bracket in collectionSearchParams.js

* Refactor validateSortby for optional parameter handling

Refactor validateSortby function to handle optional sortby parameter and improve validation logic.

* Stabilize API test pipeline by running Jest in-band with extended timeout

Run Jest in CI with --runInBand and a higher default --testTimeout to stabilize database-backed integration tests.

Multiple Jest workers were competing for the same PostgreSQL connection pool and some long-running /collections queries exceeded the default 5s timeout, causing failures in existing test suites (e.g. collectionSearch and DBconnection).

* Fixed leaking tests that blocked CI/CD-Pipeline.
- Added a global Teardown for jest and force-exited the tests to prevent leaking.
- Made a change to db_APIconnection to only log the pool-(dis)connection if it isn't run in a test enviroment.

* Did a minimum amount of Formatting to the discription

* Used `npm audit fix --force` to fix all vulnerabilties in our used packages.

* Fixed curious doublechecking for empty Strings for the sortby-Parameter.
- Now we only check once for a empty sortby
- And added a test which distinguish between `sortby=""` and `sortby="+"`

* Update api/routes/collections.js

Removed the TODO about switching from mock-data to the real db

* Removed globalTeardown as i brought up some problems corresponding to long db-queries (for example BBOX). Instead i increased the maximal testTimeout.

* added validator for collections{id} and correctly implemented collections{id}

* added test for collections{id}

* removed unnecessary parameter

* added id parameter to the Query (temporary fix)

* test-fixes to match our current tests and a fix to the baseURL for collection{id}

* test fix

* fixed problem with tests in api.test.js and adjusted the "invalid-id-test" in the validator.

* Update api/routes/collections.js

- Renamed `collection.id` to `c.collection.id`

* added test for negative ids

* deleted the whole "existing links" part and build base Links

* fixed bug in validateCollectionId.js

* Refactor negative ID test 

i encoded the "-1" value in the negative ID test instead of directly putting it into the path.

* Removed a german comment in `api/routes/collections.js`

* chore: switched to the apis collections/:id in the ui

* style: calender icon response to dark & light mode

* chroe: removed svg for language button
style: slightly thicker border for nav-buttons

* style: added a slight highlight to input/ interaction buttons

* style: update dark mode colors for text and adjust tag background

* style: smaller vertical padding for select options

* feat: source and contact are shown when clicked

* feat: search functionality

* style: centered the paging icon
chore: view css folder to seperate style and content

* feat: removed the unnecessary Filter Header

* feat: add bounding box drawing functionality and integrate with filter section

* style: bigger metadata section, hover state for items
feat: item thumbnail

* feat: routing the home when clicking on the logo and app title

* feat: enhance button states and update provider button in CollectionDetail

* style: scrollbar styling for dark mode

* feat: docker

* feat: enhance collection API integration and UI components with queryables support

* feat: docker dev container hot reload, removed "Page" text in front of pagination-info

* feat: add .vite to .gitignore

* fix: update scrollbar track background to transparent

* feat: add feedback for copy to clipboard action with visual indication

* fix: change justify-content to start for better alignment in collection detail layout

* fix: update favicon

* feat: items in collection page

* feat: add CQL2 filter support in filter section and API integration

* chore: markdown lint, removed vue.svg

* refactor: remove development Dockerfile and associated docker-compose configuration

* feat: add active and API status filters to FilterSection and update filter store

* style: update spacing in filter section and set height for right section in collection detail

* fix: docker start / build

* fix: add missing closing div in FilterSection and clean up imports in CollectionDetail

* Refactor code structure for improved readability and maintainability

* style: bigger search cards

* feat: licences & providers queryables

* fix: update API status labels for clarity

* style: gap in metadata-item for seperation

* fix: update active filter default value and placeholder for clarity

* feat: enhance pagination with input jump and update items per page

* feat: enhance loading and no-results UI with spinner and messages

* style: add ellipsis for overflowing text in source and provider URLs

* style: comment out information button in navbar for future implementation

* feat:  i18n support across components and views, documentation

* feat: enhance pagination with input jump, update items per page, and improve item count display

* docs: update README with comprehensive structure, deployment instructions, and environment variable details

* feat: add loading indicator for items count and additional properties section in CollectionDetail

* feat: implement collapsible additional properties section in CollectionDetail

* feat: update German translations for consistency in Collection terminology

* feat: add selfUrl property to ItemCard and CollectionDetail for external link support

* feat: enhance item fetching to set selfUrl based on resolved URLs

* fix: update German translations for consistency in terminology

* fix: remove max-width constraint from search result card styles

* feat: enhance source link handling to prioritize source_root and open in STAC Browser

---------

Co-authored-by: Simon Benjamin Imfeld <simfeld@uni-muenster.de>
Mammutor added a commit that referenced this pull request Jun 30, 2026
* feat: initialize Vue 3 project with Vite and packages

* feat: Added project folder structure

* feat, styling: css vars, base, reset

* feat: Add README, project structure, and styling guide documentation

* UI component structure (#182)

* feat: initialize Vue 3 project with Vite and packages

* feat: Added project folder structure

* feat, styling: css vars, base, reset

* feat: Add README, project structure, and styling guide documentation

* feat: lucide icons

* feat: removed the default HelloWorld component

* feat: filter, navbar, search result component and search section

* feat: box-shadow for the section divider
style: cleaned up some artifacts from the logo

* feat: changed title and package name to STAC Atlas

* chore: removed vite.svg

* chore: removed vue.svg

* feat: Implement InfoCard, ItemCard and SearchResultCard components (#194)

Cards for the display of the Search Result and also for the collection/ catalog page

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* UI | Mockup recreated: Collections page, little adjuments to style base etc (#198)

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* feat: update button styles and add contact popover in CollectionDetail view

* style: fixed witdh of the apply filter button

* style: map button, apply button behave like the others now

* UI | Style fixes, Copy element for contact (#199)

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* feat: update button styles and add contact popover in CollectionDetail view

* style: fixed witdh of the apply filter button

* style: map button, apply button behave like the others now

* chore: removed mockup data

* feat: route gitignore

* feat: showing the collections from /collections in the result list

* feat: enhance filter section layout and improve search result card tag display

* style: refine search result card layout and improve text overflow handling

* feat: implement pagination for collections in Home.vue and adjust max-height in search results

* style: remove fixed height from card header and add styles for first button in card footer

* style: enhance active pagination button styles for better visibility

* feat: implement loading and error states in CollectionDetail.vue, enhance API integration for fetching collection data

* style: width problem collection page, scolll items

* chore: switched to the apis collections/:id in the ui

* style: calender icon response to dark & light mode

* chroe: removed svg for language button
style: slightly thicker border for nav-buttons

* style: added a slight highlight to input/ interaction buttons

* style: update dark mode colors for text and adjust tag background

* style: smaller vertical padding for select options

* feat: source and contact are shown when clicked

* feat: search functionality

* style: centered the paging icon
chore: view css folder to seperate style and content

* feat: removed the unnecessary Filter Header

* feat: add bounding box drawing functionality and integrate with filter section

* API integrated in the UI (#206)

* feat(api): initialize STAC Atlas API with collections, conformance, and queryables routes

- Added package.json for project dependencies and scripts.
- Implemented GET endpoint for collections.
- Created conformance endpoint to list supported conformance classes.
- Developed landing page for the API with links to collections and documentation.
- Added queryables endpoint to return queryable properties for collections. (If i'm correct this can be removed)

* Added all Remarks to the bid and finished it (#74)

* changed Texts 1,2 and 8 according to the remarks of the customer

* Did my fixes to 4. and 10.3

* added remark why we want to save every catalog

* deleted keywords for catalog

* changed everything related to the database component

* Updated 3.1, 3.3, 3,4 (References to Lastenheft/small other changes)

* Added small Graph to 3. Produktumgebung

* Update bid.md 7.3STAC-Validator

added the handling of collections that cannot be validated automatically.

* Update bid.md 7.3STAC-API-Validator

changed the way we validate the collection search extension.

* Update bid.md 9.3.2Endpunkte

small fix collection search extension.

* added Skizze for 3, and updated 6.1, 10.1

* Updated 3. Produktumgebung

* Update bid.md 7.Qualitätsanforderungen

minor fixes

* Update 6.4.2 added remark about loading feedback

* Minor change to Table in "11 Zeitplan". A collum was missing in the head, therefore the table wasn't rendering correctly..

---------

Co-authored-by: Jakob <vertrox78@gmail.com>
Co-authored-by: Sönke Hoffmann <shoffma5@uni.muenster.de>
Co-authored-by: jklaer <jklaer@uni-muenster.de>
Co-authored-by: VincentKuehn <vkuehn@uni-muenster.de>
Co-authored-by: mammutor <mammutor@gmail.com>
Co-authored-by: Humam <44206081+Mammutor@users.noreply.github.com>
Co-authored-by: Justin K <justinkrumbhmer@yahoo.com>

* fix(api): enhance STAC API landing page and conformance links
- Overhaul of first idea landing page
- Added some more tests for the required elements in the landingpage-Catalog

* feat(api): implement shared conformance URIs and add tests for conformance endpoint
- implemented condormance endpoint

* Implemented 2.3 and 2.4 (#111)

* Temporary mock data for testing and frontend development

* Added API middleware layer for error handling and validation

* TODOs ready? pls review

* Added API utilities for query parsing, validation, and response formatting

* Added swagger and openapi.yaml

* Update queryables.js

Refactor queryables endpoint into /collections/queryables

* Renamed the collections.js file to mocks-collections.js to better reflect its purpose and improve project clarity

* changed README "Projektstruktur"

* restart from dev-api 22.11..2025

* API: 2.3 Implement Collections List Endpoint done (added explanations as comments in the code)

* API: 2.4 Implement Single Collection Endpoint (added explanations as comments in the code)

* Update api/routes/collections.js

Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* Changed some of the code with the comments on Github (i will finish  it tomorrow morning)

* Implement most of the feedback and comments (need to talk about some other changes)

* Update api/routes/index.js

Changed wording from `/collections/queryables` to `/collections-queryables`

* Update api/README.md

Changed wording from `/collections/queryables` to `/collections-queryables`

* Update api/README.md

Removed missing folder

* Update api/routes/collections.js

Removed TODOs from wrong lines

* Update api/routes/collections.js

Added TODOs

* Update api/routes/queryables.js

Changed wording from `/collections/queryables` to `/collections-queryables`

* Update api/routes/queryables.js

Changed wording from `/collections/queryables` to `/collections-queryables`

---------

Co-authored-by: VincentKuehn <vkuehn@uni-muenster.de>
Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* feat(api): add collection search parameters and validation middleware (#159)

* feat(api): add collection search parameters and validation middleware

* Added unit-test for validator-functions and integration-tests for `GET /collections`-Querys.
- Also minor bugfix, because the validator accepted deecimals as tokens.

* API: 3 Database Integration first version (#161)

* database connection in implementated. The parameters for the connection have to added in the .env-file.
Also there is test-file for testing and console messages

(installed `pg`)

* support for spatial queries via postgis + error handling for datatbase operations

changed language to english

* error handling

* added DATABASE_URL

There is an issue with the distance query. Changed the error handling and testing, the console messages are now way better structured

* found the Problem with the distance query. The layer are so big, that they reach over the 180° long (PostgGIS can't handel that). Now the calc is done by degree and not meters.

* The two files `test-data-retrieval.js` and `verify-schema.js` have been added.

`test-data-retrieval` (theoretical, checks against the spezification):
```
Discovers all tables and columns and validates against expected schema.
```

The second files `verify-schema.js` (practical, checks against the real data):
```
Discovers all tables and columns, validates against expected schema
```

* pooling error hanling and log imporoved.
renamed tests files to actual test-files

* standalone node tests were convertad into JEST

* write file `validateRequest.js`. Validates every incoming API request, whether the request is valid and logical.

* commented `stac_id` from the tests, it is not in both databases, so the tests for `stac_id` will always fail
Added explanation to the `.env.example`, which port is which database

* added example pattern for API - database connection.

* deleted `validateRequest` cause it's already implemented by @RobinGummels

---------

Co-authored-by: Sönke Hoffmann <shoffma5@uni.muenster.de>

* Added a CI/CD Pipeline to prevent pull-requests without functioning tests and proper linting.

* fixed errors suggested by the linter.
- Some lines used tab and spaces...

* Implemented Collection Search extension including a DB-Connection (#165)

* added SQLQuery-builder with these parameters: q,bbox,datetime,sortby,limit and token

* finalised bbox and datetime

* adapted to DB, QueryBuilder and added helperfunction runQuery

* added question-TODOs

* added bbox+datetime to the Query-Builder from Jonas

* added tests for Query-Builder from Jonas

* added tests from George

* added falsely deleted TODOs again

* fixed collumn names to match our DB and adjusted full text search to match 05_indexes.sql correctly

* Used a formatter and linter on `buildCollectionSearchQuery.js

* Did some major and minor fixes to the collection search.

- Updated `buildCollectionSearchQuery` to support pagination and improved text search with English language settings.
- Modified tests in `buildCollectionsSearchQuery.basic.test.js`, `collections-pagination.test.js`, and `collections-sort.test.js` to reflect new query behavior and validation logic.
- Enhanced sort validation in `validators.test.js` and `collectionSearchParams.js` to map API fields to database column names.
- Implemented total count retrieval for matched results in `collections.js`.

* Added a internal .env creation in the CI/CD Pipeline. It utilzes GitHub Repository Secrets to not publish any private Logins and stuff.

* Forgot that the second Job of the CI/CD pipeline runs seperatly and needs a internal .env file too.

* Enhance documentation for buildCollectionSearchQuery

Updated the documentation for:
- the buildCollectionSearchQuery function
- the fulltextsearch

* Refactor buildCollectionSearchQuery and updated SELECT part

Changed the SELECT part to match our bid and the database shema. Updated comments and for clarity. Changed full-text search to use 'simple' configuration instead of 'english'.

* Update api/routes/collections.js

small typo

Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* Remove sorting TODO from collections route

Removed TODO comment about sorting based on sortby parameter.

* Explicitly return undefined for normalized in validateSortby

Update validateSortby function to explicitly return undefined for normalized when sortby is not provided.

* small fix in buildCollectionSearch.fulltext.test.js

Change plainto_tsquery language from 'english' to 'simple'

* Fix duplicate SELECT keyword in query

Remove duplicate 'SELECT' keyword in SQL query.

* Fix missing newline at end of collectionSearchParams.js

* Fixed missing bracket in collectionSearchParams.js

* Refactor validateSortby for optional parameter handling

Refactor validateSortby function to handle optional sortby parameter and improve validation logic.

* Stabilize API test pipeline by running Jest in-band with extended timeout

Run Jest in CI with --runInBand and a higher default --testTimeout to stabilize database-backed integration tests.

Multiple Jest workers were competing for the same PostgreSQL connection pool and some long-running /collections queries exceeded the default 5s timeout, causing failures in existing test suites (e.g. collectionSearch and DBconnection).

* Fixed leaking tests that blocked CI/CD-Pipeline.
- Added a global Teardown for jest and force-exited the tests to prevent leaking.
- Made a change to db_APIconnection to only log the pool-(dis)connection if it isn't run in a test enviroment.

* Did a minimum amount of Formatting to the discription

* Used `npm audit fix --force` to fix all vulnerabilties in our used packages.

* Fixed curious doublechecking for empty Strings for the sortby-Parameter.
- Now we only check once for a empty sortby
- And added a test which distinguish between `sortby=""` and `sortby="+"`

* Update api/routes/collections.js

Removed the TODO about switching from mock-data to the real db

* Removed globalTeardown as i brought up some problems corresponding to long db-queries (for example BBOX). Instead i increased the maximal testTimeout.

---------

Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* Update api/.env.example

* latest database Version  (#187) with `stac_id` and changed definition of `primary Keys`

* added `.env`

* added environment for docker-compose.yml
now every connection-details are inside an `.env`. There is an `example.env` for better understanding which need to be set as connection details

* added description of how to use the `.env` and `example.env` in the `README.md`

* changed a few things
e.g. DB_PORT --> ${DB_PORT}

* now, everthing should be done.

my god, help. sorry

* layout issues fixed

* Fixed Typo/incomplete Sentence in README.md

* added `stac_id` for collections

* all IDs are now written in the newer PostgrSQL standart:

```SQL
id SERIAL PRIMARY KEY,
```
changed to
```SQL
id INTEGER PRIMARY KEY GENERATED ALWAYS AS IDENTITY,
```

* changed `extend` to `extent`.

* Changed language used in `./api/README.md` from german to english.

I wanted to thsi anyway at some point, but this is now more like a Test-commit to see if the CI/CD Pipeline triggers...

---------

Co-authored-by: Sönke Hoffmann <shoffma5@uni.muenster.de>
Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* chore: removed Helloworld

* feat: collection page, mockup data for visual feedback
chore: styling corrected, adjusted based on the mockup

* style: removed old css names

* chore: removed the mockup data

* feat: update button styles and add contact popover in CollectionDetail view

* style: fixed witdh of the apply filter button

* style: map button, apply button behave like the others now

* chore: removed mockup data

* feat: route gitignore

* feat: showing the collections from /collections in the result list

* feat: enhance filter section layout and improve search result card tag display

* style: refine search result card layout and improve text overflow handling

* feat: implement pagination for collections in Home.vue and adjust max-height in search results

* style: remove fixed height from card header and add styles for first button in card footer

* style: enhance active pagination button styles for better visibility

* feat: implement loading and error states in CollectionDetail.vue, enhance API integration for fetching collection data

* style: width problem collection page, scolll items

* Added `GET /collections/{id}`-Endpoint, more Fields in the responses and more Queryables-Parameters (#204)

* Updated Query-Builder to get all necessary fields from all db_tables for collections. Added some tests and fixed some already existing tests, becuase now the tablenames start with the alias `c.`.

* Updated Query-Builder to get all necessary fields from all db_tables for collections. Added some tests and fixed some already existing tests, becuase now the tablenames start with the alias `c.`.

* Added `openapi.yaml` (now http://localhost:3000/api-docs/ is working).
- needed to do some modifying to the app.js

* Added discription on how to use `stac-api-validator`. Currently we are onyl valid to `core`.

* Changed API-Version name to 1.1.0 instead of 1.0.0

* Revert "API is now responding with all necessary fields for each collection" (#195)

Reverts #185
@SonkeHoffmann accidentally didn't squash correctly.

* Revert "Revert "API is now responding with all necessary fields for each collection"" (#185) (#195) (#196)

dev-api: prepare v1.1.0 + API docs + query builder fixes

- Change API version to 1.1.0
- Add OpenAPI spec so /api-docs works locally
- Document stac-api-validator usage
- Update api/.env.example
- Query builder: select required fields for collections across db_tables; adjust tests (alias `c.`)

Commits included:
- 34bf962 Changed API-Version name to 1.1.0 instead of 1.0.0
- b047389 Added description on how to use `stac-api-validator` (currently only valid for `core`)
- b811288 Added `openapi.yaml` (so http://localhost:3000/api-docs/ works); modified app.js accordingly
- 6e5ab3e Merge branch 'dev-api-robin' of github.com:SpatioCore/STAC-Atlas into dev-api-robin
- 70dc043 Updated Query-Builder to get all necessary fields from all db_tables for collections. Added tests and fixed existing tests (table names now start with alias `c.`)
- d83eeb4 Update api/.env.example
- 5a7af5b Updated Query-Builder to get all necessary fields from all db_tables for collections. Added tests and fixed existing tests (table names now start with alias `c.`)

Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* Implement more Queryable-Fields and add the keywords-field to q fulltext search (#200)

* Add provider and license filters to collection search API

- Updated buildCollectionSearchQuery to include provider and license parameters for filtering collections.
- Enhanced validateCollectionSearchParams middleware to validate provider and license query parameters.
- Modified collections route to handle new provider and license filters in search queries.
- Implemented validation functions for provider and license parameters in collectionSearchParams.

* Add validation tests for provider and license

* Enhance full-text search by including keywords in the tsvector expression and update related tests

* Add provider and license to query parameter extraction in collection search validation

* Revert "Enhance full-text search by including keywords in the tsvector expression and update related tests"

This reverts commit 872443d.

* Implement GET /collections/{id} endpoint with validation and QueryBuilder integration (#186)

* added SQLQuery-builder with these parameters: q,bbox,datetime,sortby,limit and token

* finalised bbox and datetime

* adapted to DB, QueryBuilder and added helperfunction runQuery

* added question-TODOs

* added bbox+datetime to the Query-Builder from Jonas

* added tests for Query-Builder from Jonas

* added tests from George

* added falsely deleted TODOs again

* fixed collumn names to match our DB and adjusted full text search to match 05_indexes.sql correctly

* Used a formatter and linter on `buildCollectionSearchQuery.js

* Did some major and minor fixes to the collection search.

- Updated `buildCollectionSearchQuery` to support pagination and improved text search with English language settings.
- Modified tests in `buildCollectionsSearchQuery.basic.test.js`, `collections-pagination.test.js`, and `collections-sort.test.js` to reflect new query behavior and validation logic.
- Enhanced sort validation in `validators.test.js` and `collectionSearchParams.js` to map API fields to database column names.
- Implemented total count retrieval for matched results in `collections.js`.

* Added a internal .env creation in the CI/CD Pipeline. It utilzes GitHub Repository Secrets to not publish any private Logins and stuff.

* Forgot that the second Job of the CI/CD pipeline runs seperatly and needs a internal .env file too.

* Enhance documentation for buildCollectionSearchQuery

Updated the documentation for:
- the buildCollectionSearchQuery function
- the fulltextsearch

* Refactor buildCollectionSearchQuery and updated SELECT part

Changed the SELECT part to match our bid and the database shema. Updated comments and for clarity. Changed full-text search to use 'simple' configuration instead of 'english'.

* Update api/routes/collections.js

small typo

Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

* Remove sorting TODO from collections route

Removed TODO comment about sorting based on sortby parameter.

* Explicitly return undefined for normalized in validateSortby

Update validateSortby function to explicitly return undefined for normalized when sortby is not provided.

* small fix in buildCollectionSearch.fulltext.test.js

Change plainto_tsquery language from 'english' to 'simple'

* Fix duplicate SELECT keyword in query

Remove duplicate 'SELECT' keyword in SQL query.

* Fix missing newline at end of collectionSearchParams.js

* Fixed missing bracket in collectionSearchParams.js

* Refactor validateSortby for optional parameter handling

Refactor validateSortby function to handle optional sortby parameter and improve validation logic.

* Stabilize API test pipeline by running Jest in-band with extended timeout

Run Jest in CI with --runInBand and a higher default --testTimeout to stabilize database-backed integration tests.

Multiple Jest workers were competing for the same PostgreSQL connection pool and some long-running /collections queries exceeded the default 5s timeout, causing failures in existing test suites (e.g. collectionSearch and DBconnection).

* Fixed leaking tests that blocked CI/CD-Pipeline.
- Added a global Teardown for jest and force-exited the tests to prevent leaking.
- Made a change to db_APIconnection to only log the pool-(dis)connection if it isn't run in a test enviroment.

* Did a minimum amount of Formatting to the discription

* Used `npm audit fix --force` to fix all vulnerabilties in our used packages.

* Fixed curious doublechecking for empty Strings for the sortby-Parameter.
- Now we only check once for a empty sortby
- And added a test which distinguish between `sortby=""` and `sortby="+"`

* Update api/routes/collections.js

Removed the TODO about switching from mock-data to the real db

* Removed globalTeardown as i brought up some problems corresponding to long db-queries (for example BBOX). Instead i increased the maximal testTimeout.

* added validator for collections{id} and correctly implemented collections{id}

* added test for collections{id}

* removed unnecessary parameter

* added id parameter to the Query (temporary fix)

* test-fixes to match our current tests and a fix to the baseURL for collection{id}

* test fix

* fixed problem with tests in api.test.js and adjusted the "invalid-id-test" in the validator.

* Update api/routes/collections.js

- Renamed `collection.id` to `c.collection.id`

* added test for negative ids

* deleted the whole "existing links" part and build base Links

* fixed bug in validateCollectionId.js

* Refactor negative ID test 

i encoded the "-1" value in the negative ID test instead of directly putting it into the path.

* Removed a german comment in `api/routes/collections.js`

---------

Co-authored-by: Robin Tammo Gummels <github@gummels.eu>

---------

Co-authored-by: Sönke Hoffmann <hoffmann.sonke@gmx.de>
Co-authored-by: JonasK <156602337+BrokeJ@users.noreply.github.com>
Co-authored-by: Vincent Kühn <vkuehn@uni-muenster.de>

* chore: switched to the apis collections/:id in the ui

* style: calender icon response to dark & light mode

* chroe: removed svg for language button
style: slightly thicker border for nav-buttons

* style: added a slight highlight to input/ interaction buttons

* style: update dark mode colors for text and adjust tag background

* style: smaller vertical padding for select options

* feat: source and contact are shown when clicked

* feat: search functionality

* style: centered the paging icon
chore: view css folder to seperate style and content

* feat: removed the unnecessary Filter Header

* feat: add bounding box drawing functionality and integrate with filter section

---------

Co-authored-by: RobinGummels <github@gummels.eu>
Co-authored-by: Jakob <vertrox78@gmail.com>
Co-authored-by: Sönke Hoffmann <shoffma5@uni.muenster.de>
Co-authored-by: jklaer <jklaer@uni-muenster.de>
Co-authored-by: VincentKuehn <vkuehn@uni-muenster.de>
Co-authored-by: mammutor <mammutor@gmail.com>
Co-authored-by: Humam <44206081+Mammutor@users.noreply.github.com>
Co-authored-by: Georgios Voulgaris <gvoulgar@uni-muenster.de>
Co-authored-by: Sönke Hoffmann <hoffmann.sonke@gmx.de>
Co-authored-by: JonasK <156602337+BrokeJ@users.noreply.github.com>

* style: bigger metadata section, hover state for items
feat: item thumbnail

* feat: routing the home when clicking on the logo and app title

* feat: enhance button states and update provider button in CollectionDetail

* style: scrollbar styling for dark mode

* feat: docker

* feat: enhance collection API integration and UI components with queryables support

* feat: docker dev container hot reload, removed "Page" text in front of pagination-info

* feat: add .vite to .gitignore

* fix: update scrollbar track background to transparent

* feat: add feedback for copy to clipboard action with visual indication

* fix: change justify-content to start for better alignment in collection detail layout

* fix: update favicon

* feat: items in collection page

* feat: add CQL2 filter support in filter section and API integration

* chore: markdown lint, removed vue.svg

* refactor: remove development Dockerfile and associated docker-compose configuration

* feat: add active and API status filters to FilterSection and update filter store

* style: update spacing in filter section and set height for right section in collection detail

* fix: docker start / build

* fix: add missing closing div in FilterSection and clean up imports in CollectionDetail

* Refactor code structure for improved readability and maintainability

* style: bigger search cards

* feat: licences & providers queryables

* fix: update API status labels for clarity

* style: gap in metadata-item for seperation

* fix: update active filter default value and placeholder for clarity

* feat: enhance pagination with input jump and update items per page

* feat: enhance loading and no-results UI with spinner and messages

* style: add ellipsis for overflowing text in source and provider URLs

* style: comment out information button in navbar for future implementation

* feat:  i18n support across components and views, documentation

* feat: enhance pagination with input jump, update items per page, and improve item count display

* docs: update README with comprehensive structure, deployment instructions, and environment variable details

* feat: add loading indicator for items count and additional properties section in CollectionDetail

* feat: implement collapsible additional properties section in CollectionDetail

* feat: update German translations for consistency in Collection terminology

* feat: add selfUrl property to ItemCard and CollectionDetail for external link support

* feat: enhance item fetching to set selfUrl based on resolved URLs

* fix: update German translations for consistency in terminology

* fix: remove max-width constraint from search result card styles

* feat: enhance source link handling to prioritize source_root and open in STAC Browser

* Delete api/data/collections.js

* Delete api/examples/README.md

* Readded some Changes to runQuery() in collections.js

Add error handling to runQuery function

* Added one `TAB` to much...

* feat: add bounding box modal styles for improved UI

* refactor: remove unused styles from BoundingBoxModal.vue

* feat: add example.env for environment configuration and update README with testing instructions

* feat: add Playwright E2E tests for accessibility, collection detail, map view, and search functionality

* feat: add empty page message for paginated item lists in CollectionDetail

* fix: change overflow property to enable vertical scrolling for paginated item list

* fix: reset activeFilter to empty string for no filter by default

---------

Co-authored-by: Simon Benjamin Imfeld <simfeld@uni-muenster.de>
Co-authored-by: RobinGummels <github@gummels.eu>
Co-authored-by: Jakob <vertrox78@gmail.com>
Co-authored-by: Sönke Hoffmann <shoffma5@uni.muenster.de>
Co-authored-by: jklaer <jklaer@uni-muenster.de>
Co-authored-by: VincentKuehn <vkuehn@uni-muenster.de>
Co-authored-by: mammutor <mammutor@gmail.com>
Co-authored-by: Humam <44206081+Mammutor@users.noreply.github.com>
Co-authored-by: Georgios Voulgaris <gvoulgar@uni-muenster.de>
Co-authored-by: Sönke Hoffmann <hoffmann.sonke@gmx.de>
Co-authored-by: JonasK <156602337+BrokeJ@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request UI

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants