yarn start
yarn build
yarn manage:translations
to get the translation status. Most of the used strings are now located in src/translations/extractedMessages.json
and can be translated.You can find and edit the languages files in src/translations/locales
.
Also translate all Views in src/views/
as well as their names in views.json
.
The main branch of the repository will be automatically compiled and pushed to https://wikidaheim.at
To run on another server:
yarn build
build/
-Folder to the root of a webserver.The WikiDaheim App
The frontend is mainly built with the help of the following libraries:
react-mapbox-gl
src/api/wikidaheim.js
.The map layer is managed by Mapbox Studio. To update the map layer, open the Mapbox Studio and edit the style. After saving the changes, the style can be published. The new style will be available after a few minutes.
The wikidaheim API returns WikiData IDs for each municipality (name of the municipality, WikiData ID, Gemeindekennzahl). To map these IDs to the corresponding Mapbox-ID, the src/config/boundaries_mapped.json
file is used. This file combines the WikiData Index File (src/config/wikidata-gkz.json
) with the Mapbox Boundary Index File (src/config/boundaries.json
). Data are matched by the Gemeindekennzahl, which is used as unit_code in the Mapbox Boundary Index File. To merge the files automatically, run yarn check:boundaries
. This will start a CLI tool that will try to merge the files. If the match can't be made automatically, the user will be asked to enter the correct match.
Updated mapbox boundary files have to be directly aquired from Mapbox. Currently the app uses Mapbox Boundaries v3.
The latest wikidata-gkz list can be downloaded from the Wikidaheim API.
For new item Categories to appear in the app, they have to be added to src/components/Global/CategoryName.jsx
. Please note that the category name has to be the same as the one used in the Wikidaheim API. Also do not forget to add the new category to the translation files.
New categories won't appear in the app if they are not provided by the Wikidaheim API as well. The category color and icon will be provided by the API.
Most icons are in tangram style and were provided by Letitia Lehner, mooi-design.com and are located in Category:Logos of WikiDaheim.
The main entry point is src/index.js
. The main components are located in src/components/
and the static pages, accessible via the menu, in src/views/
. The entrypoint for the Dashboard is src/components/Dashboard/index.jsx
.
The Dasboard is split into the following components:
src/components/Dashboard/Map/index.jsx
)src/components/Dashboard/Sidebar/index.jsx
)The styles are located in src/scss/
and are written in SCSS.
The main state is located in src/redux/reducers/index.js
. The state is split into the following parts:
app
: Contains the current state of the map, the loaded municipality and the currently selected list itemlocale
: Contains the currently selected localemenu
: Contains the current state of the menuChanges to the state can be made by dispatching actions. The actions are located in src/redux/actions/
. The reducers are located in src/redux/reducers/
.
The GPX Exporter ist implemented as React Hook located in src/hooks/useDownloadGpx.js
. It provides a useDownloadGpx
function which converts the location list (provided to the hook as argument) to a gpx file and triggers a download. The locations are converted using the gpx-builder
library.
Static pages are located in src/views/
. The create a new page, simply create a HTML file with the slug name of the static page (slug = the permalink of the page), suffixed with the language of the page (e.g. pagename_en.html). Afterwards register the page by its slug in views.json. When the option "in_menu" is enabled, the page will show up in the hamburger menu.
These proposed changes are ideas for future technical improvements. The code base is from 2017 and therefore not up to date with the latest React standards. The following changes would improve the code base:
src/components/Dashboard/Map/index.jsx
file.zustand.js
.