Skip to content
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

Heatmap Reduced List #269

Open
wants to merge 20 commits into
base: develop
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 16 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
1 change: 1 addition & 0 deletions frontend/.eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ module.exports = {
rules: {
'jest/expect-expect': [
'warn',

Copy link
Collaborator

Choose a reason for hiding this comment

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

Probably left over form other modifications but is unnecessary.

Suggested change

{
// ensure, that react tests are recognized as assertions
assertFunctionNames: [
Expand Down
2 changes: 1 addition & 1 deletion frontend/Dockerfile
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ COPY . .
COPY ./.env.docker ./.env

#Run command npm install to install packages
RUN npm ci
RUN npm install
Copy link
Collaborator

Choose a reason for hiding this comment

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

Not part of this PR.
We want to use ci to install with a clean slate and go based off of the package-lock file for our automated builds.

Suggested change
RUN npm install
RUN npm ci


#create a react production build
RUN npm run build
Expand Down
45 changes: 30 additions & 15 deletions frontend/package-lock.json
Copy link
Collaborator

Choose a reason for hiding this comment

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

This is probably fine but generate a new package-lock.json file after making the changes to the package.json by running npm install (and maybe npm audit fix if necessary).

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 1 addition & 2 deletions frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -92,9 +92,8 @@
"react-markdown": "^6.0.3",
"react-redux": "^7.2.3",
"react-scroll-sync": "^0.11.0",
"redux": "^4.0.5",
"redux-persist": "^6.0.0",
"rooks": "^5.7.3"
"rooks": "^7.14.1"
Comment on lines 93 to +95
Copy link
Collaborator

Choose a reason for hiding this comment

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

Not sure why redux is removed from the packages.
Maybe another mistake when develop was merged into the branch?

Suggested change
"react-scroll-sync": "^0.11.0",
"redux": "^4.0.5",
"redux-persist": "^6.0.0",
"rooks": "^5.7.3"
"rooks": "^7.14.1"
"react-scroll-sync": "^0.11.0",
"redux": "^4.0.5",
"redux-persist": "^6.0.0",
"rooks": "^7.14.1"

},
"devDependencies": {
"@babel/preset-react": "^7.12.13",
Expand Down
2 changes: 1 addition & 1 deletion frontend/public/assets/third-party-attributions.json

Large diffs are not rendered by default.

7 changes: 7 additions & 0 deletions frontend/public/locales/de/global.json5
Original file line number Diff line number Diff line change
Expand Up @@ -35,11 +35,14 @@
deactivate: 'Scenario deaktivieren',
'manage-groups': 'Filter',
'simulation-start-day': 'Simulationsstart',
add_button: 'Fächer',
},
'group-filters': {
title: 'Gruppen Verwalten',
'title-manage-compartment': 'Fächer verwalten',
'nothing-selected': 'Wählen Sie eine Gruppe aus um diese zu bearbeiten oder erstellen Sie eine neue Gruppe.',
'add-group': 'Neue Gruppe Erstellen',
'add-group-compartment': 'Fächer',
name: 'Name',
Copy link
Collaborator

Choose a reason for hiding this comment

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

These seem to belong to a different PR (#58)

Suggested change
'simulation-start-day': 'Simulationsstart',
add_button: 'Fächer',
},
'group-filters': {
title: 'Gruppen Verwalten',
'title-manage-compartment': 'Fächer verwalten',
'nothing-selected': 'Wählen Sie eine Gruppe aus um diese zu bearbeiten oder erstellen Sie eine neue Gruppe.',
'add-group': 'Neue Gruppe Erstellen',
'add-group-compartment': 'Fächer',
name: 'Name',
'simulation-start-day': 'Simulationsstart',
},
'group-filters': {
title: 'Gruppen Verwalten',
'nothing-selected': 'Wählen Sie eine Gruppe aus um diese zu bearbeiten oder erstellen Sie eine neue Gruppe.',
'add-group': 'Neue Gruppe Erstellen',
name: 'Name',

close: 'Abbrechen',
apply: 'Anwenden',
Expand All @@ -57,6 +60,10 @@
lock: 'Maximalwert feststellen',
select: 'Farblegende auswählen',
},

haetmapchart: {
textshow: 'Zeig mehr',
},
Copy link
Collaborator

Choose a reason for hiding this comment

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

There's a typo here preventing the german translation to be used

Suggested change
haetmapchart: {
textshow: 'Zeig mehr',
},
heatmapchart: {
textshow: 'Mehr anzeigen',
},

today: 'Heute',
more: 'Mehr',
less: 'Weniger',
Expand Down
4 changes: 4 additions & 0 deletions frontend/public/locales/en/global.json5
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
accessibility: 'Accessibility',
attribution: 'Attribution',
changelog: 'Changelog',
'changelog-path': 'locales/en/changelog-en.md',
Copy link
Collaborator

Choose a reason for hiding this comment

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

This is a leftover from a merge conflict. PR#294 removed the changelog-path property.

Suggested change
'changelog-path': 'locales/en/changelog-en.md',

},
},
'icon-bar': {
Expand Down Expand Up @@ -66,6 +67,9 @@
lock: 'Lock maximum value',
select: 'Select heatmap preset',
},
heatmapchart: {
textshow: 'show more',
},
Copy link
Collaborator

Choose a reason for hiding this comment

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

All texts should start with a capital letter unless there is a good reason for it not to.

Suggested change
heatmapchart: {
textshow: 'show more',
},
heatmapchart: {
textshow: 'Show more',
},

today: 'Today',
more: 'More',
less: 'Less',
Expand Down
112 changes: 111 additions & 1 deletion frontend/src/__tests__/store/UserPreferenceSlice.test.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,10 @@
import reducer, {selectHeatmapLegend, UserPreference} from '../../store/UserPreferenceSlice';
import reducer, {
selectDefaultLegend,
selectHeatmapLegend,
setDefaultLegends,
setHeatmapLegends,
UserPreference,
} from '../../store/UserPreferenceSlice';
import {HeatmapLegend} from '../../types/heatmapLegend';

describe('DataSelectionSlice', () => {
Expand All @@ -11,7 +17,35 @@ describe('DataSelectionSlice', () => {
{color: 'rgb(255,255,255)', value: 1},
],
},
heatmaps: [],
defaultHeatmaps: [],
};
const defaultHeatmaps: HeatmapLegend[] = [
{
name: 'Default',
isNormalized: true,
steps: [
{color: 'rgb(255,255,255)', value: 0},
{color: 'rgb(255,0,0)', value: 1},
],
},
{
name: 'Default',
isNormalized: true,
steps: [
{color: 'rgb(255,255,255)', value: 0},
{color: 'rgb(0,255,0)', value: 1},
],
},
{
name: 'Default',
isNormalized: true,
steps: [
{color: 'rgb(255,255,255)', value: 0},
{color: 'rgb(0,0,255)', value: 1},
],
},
];

test('Initial State', () => {
expect(reducer(undefined, {type: null})).toEqual(initialState);
Expand All @@ -28,6 +62,82 @@ describe('DataSelectionSlice', () => {
};
expect(reducer(initialState, selectHeatmapLegend({legend: legend}))).toEqual({
selectedHeatmap: legend,
heatmaps: [],
defaultHeatmaps: [],
});
});

test('Set Heatmap Legends', () => {
const legends: HeatmapLegend[] = [
{
name: 'test 1',
isNormalized: true,
steps: [
{color: 'rgb(255,255,255)', value: 0},
{color: 'rgb(204,11,234)', value: 1},
],
},
{
name: 'test 2',
isNormalized: false,
steps: [
{color: 'rgb(94,254,76)', value: 0},
{color: 'rgb(225,199,18)', value: 150},
{color: 'rgb(194,96,14)', value: 500},
{color: 'rgb(164,25,42)', value: 2000},
],
},
];

expect(reducer(initialState, setHeatmapLegends({legends: legends}))).toEqual({
selectedHeatmap: {
name: 'uninitialized',
isNormalized: true,
steps: [
{color: 'rgb(255,255,255)', value: 0},
{color: 'rgb(255,255,255)', value: 1},
],
},
heatmaps: legends,
defaultHeatmaps: [],
});
});
test('Set Default Legends', () => {
expect(reducer(initialState, setDefaultLegends({legends: defaultHeatmaps}))).toEqual({
selectedHeatmap: {
name: 'uninitialized',
isNormalized: true,
steps: [
{color: 'rgb(255,255,255)', value: 0},
{color: 'rgb(255,255,255)', value: 1},
],
},
heatmaps: [],
defaultHeatmaps: defaultHeatmaps,
});
});
test('Change Scenario while Default Legend is selected', () => {
const state: UserPreference = {
selectedHeatmap: defaultHeatmaps[0],
heatmaps: [defaultHeatmaps[0]],
defaultHeatmaps: defaultHeatmaps,
};
expect(reducer(state, selectDefaultLegend({selectedScenario: 1}))).toEqual({
selectedHeatmap: defaultHeatmaps[1],
heatmaps: [defaultHeatmaps[1]],
defaultHeatmaps: defaultHeatmaps,
});
});
test('Change Scenario while Default Legend is not Selected', () => {
const state: UserPreference = {
selectedHeatmap: initialState.selectedHeatmap,
heatmaps: [defaultHeatmaps[0]],
defaultHeatmaps: defaultHeatmaps,
};
expect(reducer(state, selectDefaultLegend({selectedScenario: 1}))).toEqual({
selectedHeatmap: initialState.selectedHeatmap,
heatmaps: [defaultHeatmaps[1]],
defaultHeatmaps: defaultHeatmaps,
});
});
});
6 changes: 3 additions & 3 deletions frontend/src/components/IconBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,10 @@ export default function IconBar(): JSX.Element {
const maxDate = useAppSelector((state) => state.dataSelection.maxDate);

const toggleFullscreen = () => {
if (fsApi?.isFullscreen) {
void fsApi?.exit();
if (fsApi?.isFullscreenEnabled) {
void fsApi?.disableFullscreen();
} else {
void fsApi?.request();
void fsApi?.enableFullscreen();
}
Copy link
Collaborator

Choose a reason for hiding this comment

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

This isn't part of the PR and shouldn't be changed.
Or is this because of the version upgrade of rooks in the package lock?
From what I could see rooks isn't used in the core code/changes of this PR so we'd probably downgrade rooks back to the version used previously to get this to work again and put the rooks upgrade into it's own issue if an upgrade is necessary.

Suggested change
if (fsApi?.isFullscreenEnabled) {
void fsApi?.disableFullscreen();
} else {
void fsApi?.request();
void fsApi?.enableFullscreen();
}
if (fsApi?.isFullscreen) {
void fsApi?.exit();
} else {
void fsApi?.request();
}

};

Expand Down
1 change: 1 addition & 0 deletions frontend/src/components/Sidebar/DistrictMap.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,7 @@ export default function DistrictMap(): JSX.Element {

// fetch geojson
useEffect(() => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
Copy link
Collaborator

Choose a reason for hiding this comment

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

Why is this added?
since it's missing in develop it should run fine without?

fetch(mapData, {
headers: {
'Content-Type': 'application/json',
Expand Down
Loading