Merge pull request #3 from OpenHistoricalMap/upstream

Upstream

Author: Rub21

.eslintrc

@@ -1,13 +1,9 @@
 {
     "extends": "react-app",
     "rules": {
-        "quotes": [
-            "error",
-            "single"
-        ],
         "no-unused-vars": "error"
     },
     "globals": {
         "Raven": true
     }
-}
+}

.github/workflows/docker-publish.yaml

@@ -2,7 +2,7 @@ name: Build Docker Image, Push to GHCR
 
 on:
   push:
-    branches: ['main', 'staging', 'develop']
+    branches: ['main', 'staging', 'upstream']
 
 env:
   REGISTRY: ghcr.io

.tool-versions

@@ -1,2 +1,2 @@
-nodejs 16.1.0
-yarn 1.22.11
+nodejs 18
+yarn   1.22

ABOUT.md

@@ -11,7 +11,6 @@
 - [Usage](#usage)
   - [How to review a changeset?](#how-to-review-a-changeset)
     - [Changeset and Mapper details](#changeset-and-mapper-details)
-    - [Using Changeset-map](#using-changeset-map)
     - [Reviewing changesets in OSMCha from OpenStreetMap](#reviewing-changesets-in-osmcha-from-openstreetmap)
   - [Filters](#filters)
     - [Basic filters](#basic-filters)
@@ -136,7 +135,7 @@ It is important that the reviewer has the necessary information about the
 changeset and understand the diff of modifications in the OSM data.
 
 For this purpose, OSMCha offers an interface similar to OpenStreetMap but with
-additional tools such as [changeset-map](https://github.com/osmlab/changeset-map) to visualise the edits, information about
+additional tools to visualise the edits, information about
 the mapper, other information related to the changeset and OSM user history that
 can help the reviewer identify a problematic edits on OSM. For a deep-dive into
 what a problematic edit is on OSM, please refer to our guide on
@@ -179,9 +178,9 @@ what a problematic edit is on OSM, please refer to our guide on
 
 * More details on the mapper can be found under the `User tab`. This gives more context to the reviewer about the user history and their pattern of contribution to OpenStreetMap.
 
-### Using Changeset-map
+### Using the map view
 
-* Changeset-map is a changeset visualiser for OSM. It helps the reviewer understand the edits of a changeset both in terms of geometry and feature properties.
+* One of OSMCha's core features is the ability to visualize a changeset on a map. Every map element that the changeset touched is shown, colored to indicate whether the element was created, modified, or deleted. Clicking on a map element reveals additional details about what was changed (for example, which OSM tags were modified). The map view helps you understand the complete effect of a changeset.
 
 <!--<img width="600" alt="osmcha-changesetmap" src="https://d2mxuefqeaa7sj.cloudfront.net/s_97A29C4444FB7626533E7DD42C06D768BD5A4FA0D1B3C76327F305F832774967_1497443481288_image.png">-->
 
@@ -191,7 +190,7 @@ what a problematic edit is on OSM, please refer to our guide on
 
 <img width="300" alt="osmcha-mapcontrols" src="https://user-images.githubusercontent.com/8921295/35940114-236f8314-0c1c-11e8-9649-47c1f077ab02.png">
 
-* The reviewer can also change the background map on the changeset-map by
+* The reviewer can also change the background map by
   toggling through the map style in `Map controls` tab.
 
 <img width="300" alt="osmcha-flagged" src="https://user-images.githubusercontent.com/8921295/35940146-333e3d94-0c1c-11e8-8036-5adbbfea35be.png">
@@ -460,10 +459,8 @@ This is raised when someone tries to remove tags in a changeset that are added b
 
 # Feedback
 
-* To file bugs, feature requests on OSMCha - please file issues at
-  https://github.com/osmcha/osmcha-frontend/issues
-* To file bugs, feature requests on Changeset map - please file issues at
-  https://github.com/osmlab/changeset-map/issues
+To file bugs, feature requests on OSMCha - please file issues at
+https://github.com/osmcha/osmcha-frontend/issues
 
 # Donate
 

CHANGELOG.md

@@ -2,6 +2,32 @@
 
 Log of changes since the 2.0 version
 
+### 1.2.1
+
+- Upgrade to maplibre-adiff-viewer 1.3.0, which contains tweaks to improve
+  the visibility of elements on the map.
+- Fix some filter input bugs (#779)
+- Preserve order of relation members in the element info table (#780)
+
+### 1.2.0
+
+- Switch from using s3://real-changesets JSONs to using adiffs.osmcha.org
+  augmented diffs (XML) for visualizing changesets on the map
+- Remove dependency on changeset-map; add dependencies on
+  @osmcha/maplibre-adiff-viewer and @osmcha/osm-adiff-parser
+- Map rendering now uses MapLibre GL JS v5.1.0 (we were previously using
+  Mapbox GL JS v1.13, via changeset-map)
+- Clicking on a map element reveals a new details panel (the old one was part
+  of changeset-map)
+- New bounding box input for filtering, implemented using Terra Draw
+
+More detailed description of the above changes available here:
+https://github.com/OSMCha/osmcha-frontend/pull/772
+
+### 1.1.1
+
+- Fix display order of RTL tag values in Tag Changes view (#766)
+
 ### 1.1.0
 
 - Fix Chinese text input in location search bar (#671)

CONTRIBUTING.md

@@ -1,8 +1,8 @@
 # Contributing to OSMCha
 
 The current OSMCHA is broken into two repositories. You can file bug in any of these repositories.
-1. [osmcha-django](https://github.com/willemarcel/osmcha-django) Handles the backend of the OSMCha.
-2. [osmcha-frontend](https://github.com/mapbox/osmcha-frontend) Is the frontend application.
+1. [osmcha-django](https://github.com/OSMCha/osmcha-django) Handles the backend of the OSMCha.
+2. [osmcha-frontend](https://github.com/OSMCha/osmcha-frontend) Is the frontend application.
 
 ## Code of Conduct
 
@@ -14,7 +14,8 @@ Please read the project
 We'd love to hear what you think about OSMCha, about any specific problems or
 concerns you have. Here's a quick list of things to consider:
 
-Please [search for your issue before filing it: many bugs and improvements have already been reported](https://github.com/search?l=&q=repo%3Amapbox%2Fosmcha-frontend&type=Issues)
+Please [search for your issue](https://github.com/search?l=&q=repo%3AOSMCha%2Fosmcha-frontend&type=Issues)
+before filing it; many bugs and improvements have already been reported.
 
 To report a bug:
 

Dockerfile

@@ -8,7 +8,6 @@ WORKDIR /app
 COPY package.json yarn.lock /app/
 RUN yarn set version stable
 RUN yarn install
-RUN sed -i "s|mapbox://styles/[^\"']*|https://www.openhistoricalmap.org/map-styles/historical/historical.json|g" node_modules/changeset-map/dist/*.js
 
 COPY src/ /app/src
 COPY public/ /app/public

README.md

@@ -7,11 +7,9 @@ easier to monitor and validate the changes in OpenStreetMap. [Learn more …](AB
 - Test instance: http://osmcha-django-staging.tilestream.net/
 
 This repository contains the frontend code. Other repositories are:
-* [OSMCha backend code](https://github.com/willemarcel/osmcha-django)
-* [OSMCha python library](https://github.com/willemarcel/osmcha) is used to analyse the OSM changesets
-* [OSM Compare](https://github.com/mapbox/osm-compare) is used to analyse OSM features
-* [OSM Changeset Viewer](https://github.com/osmlab/changeset-map) is used to display the changeset on the main map
-
+* [`osmcha-django`](https://github.com/OSMCha/osmcha-django) - the backend Django application
+* [`osmcha` (python library)](https://github.com/OSMCha/osmcha) - used by the backend to analyse OSM changesets
+* [`maplibre-adiff-viewer`](https://github.com/OSMCha/maplibre-adiff-viewer) - used to display the changeset on the main map
 
 ## Setting up editor
 
@@ -30,27 +28,21 @@ This repository uses [prettier](https://github.com/prettier/prettier) to keep th
 ### Local development
 
 1. `yarn start`
-1. Open [https://localhost:3000?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222020-04-01%22%2C%22value%22%3A%222020-04-01%22%7D%5D%7D](https://localhost:3000?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222020-04-01%22%2C%22value%22%3A%222020-04-01%22%7D%5D%7D) of e.g. [changeset#91638199](https://localhost:3000/changesets/91638199?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222020-04-01%22%2C%22value%22%3A%222020-04-01%22%7D%5D%7D)
-    - The app runs with https; Firefox is recommended since it allows self signed certificates.
-    - The staging database does not have all the changesets that production has, therefore the filter is needed.
-
-**To also edit the part of the UI that is provided by the OSM Changeset Viewer**
-
-Checkout https://github.com/osmlab/changeset-map in a sibling folder.
-
-_In `./changeset-map`:_
-
-1. `yarn link`
-1. `yarn build --watch`
-
-_In `./osmcha-frontend`_
-
-1. `yarn link "changeset-map"`
-1. `yarn start`
-
-Edits in both projects will result in a rebuild and reload the browser.
-
-When finished, reset "osmcha-frontend" back to the npm version of "changeset-map" with `yarn add changeset-map@latest`
+1. Open [http://127.0.0.1:3000](http://127.0.0.1:3000)
+
+Note: if you are running the frontend against the production backend (the
+default), you won't be able to use OAuth to log in through the UI. Instead
+you can copy your auth token from the DevTools console on the production
+website (`localStorage.getItem("token")`) and then paste it into the console
+on the development site (`localStorage.setItem("token", <value>)`). Refresh
+the page and you should now be logged in.
+
+If you are running your own local copy of the
+[`osmcha-django`](https://github.com/OSMCha/osmcha-django) backend, you'll
+need to register your own OAuth app on openstreetmap.org, configure the backend
+to use that secret key, and then point this frontend at your local backend by
+setting the `REACT_APP_PRODUCTION_API_URL` environment variable. After that,
+normal OAuth login through the frontend UI should work.
 
 ### Local testing
 
@@ -60,44 +52,11 @@ Test the application before commiting any changes. If you encounter any error ma
 yarn test
 ```
 
-## Deploy/Release
-
-- There are three stacks to deploy to
-- ~~`yarn deploy:dev` deploys it to `mapbox.github.io`~~ (currently broken)
-- `yarn deploy:staging` deploys it to `staging.osmcha.org`
-- `yarn deploy:prod` deploys it to `osmcha.org`
-
-1. Run the tests with `yarn test`
-
-2. (optional) before deploy, you might want to increment the version number of application.
-    * We use `minor` for all non-drastic changes.
-    * The `patch` is reserved for minor changes.
-    * We try to stick to sem-ver.
-    ```bash
-    npm version minor
-    ```
-
-3. Then build the app with the following command.
-    ```bash
-    yarn build:<stack>
-    ```
-    * here stack could be `dev`, `staging`, `prod`. Refer to package.json for more info.
-
-4. The next step involves deploying the `build` folder to github. If you get an error like this `error: failed to push some refs to 'git'` while doing the deploy step. Run `rm -rf node_modules/gh-pages/.cache/`.
-    ```
-    yarn deploy:<stack>
-    ```
-    * here stack could be `dev`, `staging`, `prod`. Refer to package.json for more info.
-    * `oh-pages` branch handles the build for `staging`, `prod` stacks.
-    * `gh-pages` branch handles the build for `dev` stack.
-
+## Releasing and Deployment
 
-5. (optional) If you want to see the new changes on a `staging` or `prod` stack. You will need to draft a new github release. The convention is to append `-staging` or `-production` or just `-server` to the current version tag for the server to consume the build and separate concerns.
-    * for eg. if the version npm module version was `v0.16.3`.
-    * draft a github release with a tag `v0.16.3-staging`. (Note the name spacing)
-    * supply this version tag to the server.
-    * Refer to githubs [article](https://help.github.com/articles/creating-releases/) for creating releases.
+Deployment of the [osmcha.org](https://osmcha.org) instance is managed in the [`osmcha-deploy`](https://github.com/OSMCha/osmcha-deploy). Tags pushed to this repo are automatically built into container images. Modifying the code in `osmcha-deploy` to change the pinned image version will automatically redeploy the production website.
 
+When tagging a new release, be sure to also update the [CHANGELOG](./CHANGELOG.md) file to describe what's changed.
 
 ## Issues and feature requests