Skip to content

Upstream #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 17 commits into from
May 14, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 1 addition & 5 deletions .eslintrc
Original file line number Diff line number Diff line change
@@ -1,13 +1,9 @@
{
"extends": "react-app",
"rules": {
"quotes": [
"error",
"single"
],
"no-unused-vars": "error"
},
"globals": {
"Raven": true
}
}
}
2 changes: 1 addition & 1 deletion .github/workflows/docker-publish.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
4 changes: 2 additions & 2 deletions .tool-versions
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
nodejs 16.1.0
yarn 1.22.11
nodejs 18
yarn 1.22
15 changes: 6 additions & 9 deletions ABOUT.md
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down Expand Up @@ -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
Expand Down Expand Up @@ -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">-->

Expand All @@ -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">
Expand Down Expand Up @@ -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

Expand Down
26 changes: 26 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down
7 changes: 4 additions & 3 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -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

Expand All @@ -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:

Expand Down
1 change: 0 additions & 1 deletion Dockerfile
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
83 changes: 21 additions & 62 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand All @@ -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

Expand All @@ -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

Expand Down
87 changes: 0 additions & 87 deletions config-overrides.js

This file was deleted.

Loading