Skip to content

Commit acbf179

Browse files
100xmanas100xmanas
committed
Merge branch 'improve-banner-styling-language' of https://github.com/100xmanas/p5.js-web-editor into improve-banner-styling-language
2 parents ef2205f + bc2f98d commit acbf179

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

59 files changed

+3081
-613
lines changed

‎.storybook/preview.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@ import React from 'react';
22
import { Provider } from 'react-redux';
33
import { MemoryRouter } from 'react-router';
44

5-
import configureStore from '../client/store';
5+
import { setupStore } from '../client/store';
66
import '../client/i18n-test';
7-
import '../client/styles/storybook.css'
7+
import '../client/styles/storybook.css';
88
import { withThemeProvider, themeToolbarItem } from './decorator-theme';
99

1010
const initialState = window.__INITIAL_STATE__;
1111

12-
const store = configureStore(initialState);
12+
const store = setupStore(initialState);
1313

1414
export const decorators = [
1515
(Story) => (

‎client/custom.d.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,18 @@ declare module '*.svg' {
44
const ReactComponent: React.FunctionComponent<
55
React.SVGProps<SVGSVGElement> & { title?: string }
66
>;
7+
// eslint-disable-next-line import/no-default-export
78
export default ReactComponent;
89
}
10+
11+
// Extend window for Redux DevTools
12+
interface Window {
13+
__REDUX_DEVTOOLS_EXTENSION__?: () => any;
14+
}
15+
16+
// Extend NodeModule for hot reloading
17+
interface NodeModule {
18+
hot?: {
19+
accept(path?: string, callback?: () => void): void;
20+
};
21+
}

‎client/index.integration.test.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ import React from 'react';
44
import Routing from './routes';
55

66
import { reduxRender, act, waitFor, screen, within } from './test-utils';
7-
import configureStore from './store';
7+
import { setupStore } from './store';
88
import * as Actions from './modules/User/actions';
99
import { userResponse } from './testData/testServerResponses';
1010

1111
// setup for the app
1212
const initialState = window.__INITIAL_STATE__;
13-
const store = configureStore(initialState);
13+
const store = setupStore(initialState);
1414

1515
// need to mock this file or it'll throw ERRCONNECTED
1616
jest.mock('./i18n');

‎client/index.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { Router } from 'react-router-dom';
55

66
import { useTranslation } from 'react-i18next';
77
import browserHistory from './browserHistory';
8-
import configureStore from './store';
8+
import { setupStore } from './store';
99
import Routing from './routes';
1010
import ThemeProvider from './modules/App/components/ThemeProvider';
1111
import Loader from './modules/App/components/loader';
@@ -19,7 +19,7 @@ require('./images/p5js-square-logo.png');
1919

2020
const initialState = window.__INITIAL_STATE__;
2121

22-
const store = configureStore(initialState);
22+
const store = setupStore(initialState);
2323

2424
const DONATE_LOGO_IMAGE_URL = 'https://donorbox.org/images/white_logo.svg';
2525

‎client/modules/About/pages/About.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ const About = () => {
9595
))}
9696

9797
<Contact>
98-
<h2>{t('Contact')}</h2>
98+
<h2>{t('About.Contact')}</h2>
9999
<div>
100100
<ContactTitle>{t('About.Email')}</ContactTitle>
101101
<ContactHandles>

‎client/modules/IDE/actions/preferences.js‎ renamed to ‎client/modules/IDE/actions/preferences.ts‎

Lines changed: 55 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,30 @@
11
import i18next from 'i18next';
2+
import { UpdatePreferencesRequestBody } from '../../../../common/types';
23
import { apiClient } from '../../../utils/apiClient';
34
import * as ActionTypes from '../../../constants';
5+
import type {
6+
UpdatePreferencesDispatch,
7+
SetPreferencesTabValue,
8+
SetFontSizeValue,
9+
GetRootState,
10+
SetLineNumbersValue,
11+
SetAutocloseBracketsQuotesValue,
12+
SetAutocompleteHinterValue,
13+
SetAutosaveValue,
14+
SetLinewrapValue,
15+
SetLintWarningValue,
16+
SetTextOutputValue,
17+
SetAllAccessibleOutputValue,
18+
SetAutorefreshValue,
19+
SetGridOutputValue,
20+
SetLanguageValue,
21+
SetThemeValue
22+
} from './preferences.types';
423

5-
function updatePreferences(formParams, dispatch) {
24+
function updatePreferences(
25+
formParams: UpdatePreferencesRequestBody,
26+
dispatch: UpdatePreferencesDispatch
27+
) {
628
apiClient
729
.put('/preferences', formParams)
830
.then(() => {})
@@ -14,15 +36,15 @@ function updatePreferences(formParams, dispatch) {
1436
});
1537
}
1638

17-
export function setPreferencesTab(value) {
39+
export function setPreferencesTab(value: SetPreferencesTabValue) {
1840
return {
1941
type: ActionTypes.SET_PREFERENCES_TAB,
2042
value
2143
};
2244
}
2345

24-
export function setFontSize(value) {
25-
return (dispatch, getState) => {
46+
export function setFontSize(value: SetFontSizeValue) {
47+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
2648
// eslint-disable-line
2749
dispatch({
2850
type: ActionTypes.SET_FONT_SIZE,
@@ -40,8 +62,8 @@ export function setFontSize(value) {
4062
};
4163
}
4264

43-
export function setLineNumbers(value) {
44-
return (dispatch, getState) => {
65+
export function setLineNumbers(value: SetLineNumbersValue) {
66+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
4567
dispatch({
4668
type: ActionTypes.SET_LINE_NUMBERS,
4769
value
@@ -58,8 +80,10 @@ export function setLineNumbers(value) {
5880
};
5981
}
6082

61-
export function setAutocloseBracketsQuotes(value) {
62-
return (dispatch, getState) => {
83+
export function setAutocloseBracketsQuotes(
84+
value: SetAutocloseBracketsQuotesValue
85+
) {
86+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
6387
dispatch({
6488
type: ActionTypes.SET_AUTOCLOSE_BRACKETS_QUOTES,
6589
value
@@ -76,8 +100,8 @@ export function setAutocloseBracketsQuotes(value) {
76100
};
77101
}
78102

79-
export function setAutocompleteHinter(value) {
80-
return (dispatch, getState) => {
103+
export function setAutocompleteHinter(value: SetAutocompleteHinterValue) {
104+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
81105
dispatch({
82106
type: ActionTypes.SET_AUTOCOMPLETE_HINTER,
83107
value
@@ -94,8 +118,8 @@ export function setAutocompleteHinter(value) {
94118
};
95119
}
96120

97-
export function setAutosave(value) {
98-
return (dispatch, getState) => {
121+
export function setAutosave(value: SetAutosaveValue) {
122+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
99123
dispatch({
100124
type: ActionTypes.SET_AUTOSAVE,
101125
value
@@ -112,8 +136,8 @@ export function setAutosave(value) {
112136
};
113137
}
114138

115-
export function setLinewrap(value) {
116-
return (dispatch, getState) => {
139+
export function setLinewrap(value: SetLinewrapValue) {
140+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
117141
dispatch({
118142
type: ActionTypes.SET_LINEWRAP,
119143
value
@@ -130,8 +154,8 @@ export function setLinewrap(value) {
130154
};
131155
}
132156

133-
export function setLintWarning(value) {
134-
return (dispatch, getState) => {
157+
export function setLintWarning(value: SetLintWarningValue) {
158+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
135159
dispatch({
136160
type: ActionTypes.SET_LINT_WARNING,
137161
value
@@ -148,8 +172,8 @@ export function setLintWarning(value) {
148172
};
149173
}
150174

151-
export function setTextOutput(value) {
152-
return (dispatch, getState) => {
175+
export function setTextOutput(value: SetTextOutputValue) {
176+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
153177
dispatch({
154178
type: ActionTypes.SET_TEXT_OUTPUT,
155179
value
@@ -166,8 +190,8 @@ export function setTextOutput(value) {
166190
};
167191
}
168192

169-
export function setGridOutput(value) {
170-
return (dispatch, getState) => {
193+
export function setGridOutput(value: SetGridOutputValue) {
194+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
171195
dispatch({
172196
type: ActionTypes.SET_GRID_OUTPUT,
173197
value
@@ -184,12 +208,8 @@ export function setGridOutput(value) {
184208
};
185209
}
186210

187-
export function setTheme(value) {
188-
// return {
189-
// type: ActionTypes.SET_THEME,
190-
// value
191-
// };
192-
return (dispatch, getState) => {
211+
export function setTheme(value: SetThemeValue) {
212+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
193213
dispatch({
194214
type: ActionTypes.SET_THEME,
195215
value
@@ -206,12 +226,8 @@ export function setTheme(value) {
206226
};
207227
}
208228

209-
export function setAutorefresh(value) {
210-
// return {
211-
// type: ActionTypes.SET_AUTOREFRESH,
212-
// value
213-
// };
214-
return (dispatch, getState) => {
229+
export function setAutorefresh(value: SetAutorefreshValue) {
230+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
215231
dispatch({
216232
type: ActionTypes.SET_AUTOREFRESH,
217233
value
@@ -228,15 +244,18 @@ export function setAutorefresh(value) {
228244
};
229245
}
230246

231-
export function setAllAccessibleOutput(value) {
232-
return (dispatch) => {
247+
export function setAllAccessibleOutput(value: SetAllAccessibleOutputValue) {
248+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
233249
dispatch(setTextOutput(value));
234250
dispatch(setGridOutput(value));
235251
};
236252
}
237253

238-
export function setLanguage(value, { persistPreference = true } = {}) {
239-
return (dispatch, getState) => {
254+
export function setLanguage(
255+
value: SetLanguageValue,
256+
{ persistPreference = true } = {}
257+
) {
258+
return (dispatch: UpdatePreferencesDispatch, getState: GetRootState) => {
240259
i18next.changeLanguage(value);
241260
dispatch({
242261
type: ActionTypes.SET_LANGUAGE,

‎client/modules/IDE/actions/preferences.types.ts‎

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
import * as ActionTypes from '../../../constants';
2+
import type { PreferencesState } from '../reducers/preferences';
3+
import type { RootState } from '../../../reducers';
4+
5+
// Value Definitions:
6+
export type SetPreferencesTabValue = PreferencesState['tabIndex'];
7+
export type SetFontSizeValue = PreferencesState['fontSize'];
8+
export type SetLineNumbersValue = PreferencesState['lineNumbers'];
9+
export type SetAutocloseBracketsQuotesValue = PreferencesState['autocloseBracketsQuotes'];
10+
export type SetAutocompleteHinterValue = PreferencesState['autocompleteHinter'];
11+
export type SetAutosaveValue = PreferencesState['autosave'];
12+
export type SetLinewrapValue = PreferencesState['linewrap'];
13+
export type SetLintWarningValue = PreferencesState['lintWarning'];
14+
export type SetTextOutputValue = PreferencesState['textOutput'];
15+
export type SetGridOutputValue = PreferencesState['gridOutput'];
16+
export type SetThemeValue = PreferencesState['theme'];
17+
export type SetAutorefreshValue = PreferencesState['autorefresh'];
18+
export type SetLanguageValue = PreferencesState['language'];
19+
export type SetAllAccessibleOutputValue =
20+
| SetTextOutputValue
21+
| SetGridOutputValue;
22+
23+
// Action Definitions:
24+
export type OpenPreferencesAction = {
25+
type: typeof ActionTypes.OPEN_PREFERENCES;
26+
};
27+
export type SetPreferencesAction = {
28+
type: typeof ActionTypes.SET_PREFERENCES;
29+
preferences: PreferencesState;
30+
};
31+
export type SetErrorAction = {
32+
type: typeof ActionTypes.ERROR;
33+
error: unknown;
34+
};
35+
36+
export type SetPreferencesTabAction = {
37+
type: typeof ActionTypes.SET_PREFERENCES_TAB;
38+
value: SetPreferencesTabValue;
39+
};
40+
export type SetFontSizeAction = {
41+
type: typeof ActionTypes.SET_FONT_SIZE;
42+
value: SetFontSizeValue;
43+
};
44+
export type SetLineNumbersAction = {
45+
type: typeof ActionTypes.SET_LINE_NUMBERS;
46+
value: SetLineNumbersValue;
47+
};
48+
export type SetAutocloseBracketsQuotesAction = {
49+
type: typeof ActionTypes.SET_AUTOCLOSE_BRACKETS_QUOTES;
50+
value: SetAutocloseBracketsQuotesValue;
51+
};
52+
export type SetAutocompleteHinterAction = {
53+
type: typeof ActionTypes.SET_AUTOCOMPLETE_HINTER;
54+
value: SetAutocompleteHinterValue;
55+
};
56+
export type SetAutosaveAction = {
57+
type: typeof ActionTypes.SET_AUTOSAVE;
58+
value: SetAutosaveValue;
59+
};
60+
export type SetLinewrapAction = {
61+
type: typeof ActionTypes.SET_LINEWRAP;
62+
value: SetLinewrapValue;
63+
};
64+
export type SetLintWarningAction = {
65+
type: typeof ActionTypes.SET_LINT_WARNING;
66+
value: SetLintWarningValue;
67+
};
68+
export type SetTextOutputAction = {
69+
type: typeof ActionTypes.SET_TEXT_OUTPUT;
70+
value: SetTextOutputValue;
71+
};
72+
export type SetGridOutputAction = {
73+
type: typeof ActionTypes.SET_GRID_OUTPUT;
74+
value: SetGridOutputValue;
75+
};
76+
export type SetThemeAction = {
77+
type: typeof ActionTypes.SET_THEME;
78+
value: SetThemeValue;
79+
};
80+
export type SetAutorefreshAction = {
81+
type: typeof ActionTypes.SET_AUTOREFRESH;
82+
value: SetAutorefreshValue;
83+
};
84+
export type SetLanguageAction = {
85+
type: typeof ActionTypes.SET_LANGUAGE;
86+
language: SetLanguageValue;
87+
};
88+
89+
export type PreferencesAction =
90+
| OpenPreferencesAction
91+
| SetPreferencesAction
92+
| SetErrorAction
93+
| SetPreferencesTabAction
94+
| SetFontSizeAction
95+
| SetLineNumbersAction
96+
| SetAutocloseBracketsQuotesAction
97+
| SetAutocompleteHinterAction
98+
| SetAutosaveAction
99+
| SetLinewrapAction
100+
| SetLintWarningAction
101+
| SetTextOutputAction
102+
| SetGridOutputAction
103+
| SetThemeAction
104+
| SetAutorefreshAction
105+
| SetLanguageAction;
106+
107+
export type UpdatePreferencesDispatch = (
108+
action: PreferencesAction | PreferencesThunk
109+
) => void;
110+
111+
export type PreferencesThunk = (
112+
dispatch: UpdatePreferencesDispatch,
113+
getState: GetRootState
114+
) => void;
115+
116+
export type GetRootState = () => RootState;

‎client/modules/IDE/components/Header/MobileNav.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -455,7 +455,7 @@ const MoreMenu = () => {
455455
<MobileMenuItem href="https://p5js.org/reference/">
456456
{t('Nav.Help.Reference')}
457457
</MobileMenuItem>
458-
<MobileMenuItem href="/about">{t('Nav.Help.About')}</MobileMenuItem>
458+
<MobileMenuItem href="/about">{t('About.Title')}</MobileMenuItem>
459459
</ParentMenuContext.Provider>
460460
</ul>
461461
</div>

0 commit comments

Comments
 (0)