Merge remote-tracking branch 'origin/develop' into react-router-5

.gitlab-ci.yml

@@ -26,6 +26,9 @@ lint-js:
   only:
     changes:
       - "**/*.js"
+      - "**/*.jsx"
+      - "**/*.ts"
+      - "**/*.tsx"
       - ".eslintignore"
       - ".eslintrc.js"
 

.stylelintrc.json

@@ -10,6 +10,6 @@
     "font-family-no-missing-generic-family-keyword": [true, { "ignoreFontFamilies": ["ForkAwesome", "Font Awesome 5 Free", "OpenDyslexic", "soapbox"] }],
     "no-descending-specificity": null,
     "no-duplicate-selectors": null,
-    "scss/at-rule-no-unknown": true
+    "scss/at-rule-no-unknown": [true, { "ignoreAtRules": ["/tailwind/"]}]
   }
 }

app/soapbox/__mocks__/api.ts

@@ -0,0 +1,28 @@
+import { jest } from '@jest/globals';
+import { AxiosInstance } from 'axios';
+import MockAdapter from 'axios-mock-adapter';
+
+const api = jest.requireActual('../api') as Record<string, Function>;
+let mocks: Array<Function> = [];
+
+export const __stub = (func: Function) => mocks.push(func);
+export const __clear = (): Function[] => mocks = [];
+
+const setupMock = (axios: AxiosInstance) => {
+  const mock = new MockAdapter(axios);
+  mocks.map(func => func(mock));
+};
+
+export const staticClient = api.staticClient;
+
+export const baseClient = (...params: any[]) => {
+  const axios = api.baseClient(...params);
+  setupMock(axios);
+  return axios;
+};
+
+export default (...params: any[]) => {
+  const axios = api.default(...params);
+  setupMock(axios);
+  return axios;
+};

app/soapbox/hooks/index.ts

@@ -0,0 +1 @@
+export { useAppSelector } from './useAppSelector';

app/soapbox/hooks/useAppSelector.ts

@@ -0,0 +1,5 @@
+import { TypedUseSelectorHook, useSelector } from 'react-redux';
+
+import { RootState } from 'soapbox/store';
+
+export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;

app/soapbox/normalizers/account.ts

@@ -13,7 +13,6 @@ import {
 
 import emojify from 'soapbox/features/emoji/emoji';
 import { normalizeEmoji } from 'soapbox/normalizers/emoji';
-import { IAccount } from 'soapbox/types';
 import { acctFull } from 'soapbox/utils/accounts';
 import { unescapeHTML } from 'soapbox/utils/html';
 import { mergeDefined, makeEmojiMap } from 'soapbox/utils/normalizers';
@@ -200,7 +199,7 @@ const normalizeFqn = (account: ImmutableMap<string, any>) => {
   return account.set('fqn', acctFull(account));
 };
 
-export const normalizeAccount = (account: Record<string, any>): IAccount => {
+export const normalizeAccount = (account: Record<string, any>) => {
   return AccountRecord(
     ImmutableMap(fromJS(account)).withMutations(account => {
       normalizePleromaLegacyFields(account);

app/soapbox/normalizers/status.ts

@@ -15,7 +15,6 @@ import { normalizeCard } from 'soapbox/normalizers/card';
 import { normalizeEmoji } from 'soapbox/normalizers/emoji';
 import { normalizeMention } from 'soapbox/normalizers/mention';
 import { normalizePoll } from 'soapbox/normalizers/poll';
-import { IStatus } from 'soapbox/types';
 
 // https://docs.joinmastodon.org/entities/status/
 export const StatusRecord = ImmutableRecord({
@@ -136,7 +135,7 @@ const fixQuote = (status: ImmutableMap<string, any>) => {
   });
 };
 
-export const normalizeStatus = (status: Record<string, any>): IStatus => {
+export const normalizeStatus = (status: Record<string, any>) => {
   return StatusRecord(
     ImmutableMap(fromJS(status)).withMutations(status => {
       normalizeAttachments(status);

app/soapbox/store.ts

@@ -0,0 +1,23 @@
+import { composeWithDevTools } from '@redux-devtools/extension';
+import { createStore, applyMiddleware, AnyAction } from 'redux';
+import thunk, { ThunkDispatch } from 'redux-thunk';
+
+import errorsMiddleware from './middleware/errors';
+import soundsMiddleware from './middleware/sounds';
+import appReducer from './reducers';
+
+export const store = createStore(
+  appReducer,
+  composeWithDevTools(
+    applyMiddleware(
+      thunk,
+      errorsMiddleware(),
+      soundsMiddleware(),
+    ),
+  ),
+);
+
+// Infer the `RootState` and `AppDispatch` types from the store itself
+// https://redux.js.org/usage/usage-with-typescript
+export type RootState = ReturnType<typeof store.getState>;
+export type AppDispatch = ThunkDispatch<{}, {}, AnyAction>;

package.json

@@ -54,13 +54,18 @@
     "@gamestdio/websocket": "^0.3.2",
     "@lcdp/offline-plugin": "^5.1.0",
     "@popperjs/core": "^2.4.4",
+    "@redux-devtools/extension": "^3.2.2",
     "@sentry/browser": "^6.12.0",
     "@sentry/react": "^6.12.0",
     "@sentry/tracing": "^6.12.0",
     "@tabler/icons": "^1.53.0",
+    "@tailwindcss/forms": "^0.4.0",
+    "@tailwindcss/typography": "^0.5.1",
     "@types/escape-html": "^1.0.1",
+    "@types/http-link-header": "^1.0.3",
+    "@types/lodash": "^4.14.180",
     "array-includes": "^3.0.3",
-    "autoprefixer": "^10.0.0",
+    "autoprefixer": "^10.4.2",
     "axios": "^0.21.4",
     "babel-loader": "^8.2.2",
     "babel-plugin-lodash": "^3.3.4",
@@ -109,12 +114,11 @@
     "mark-loader": "^0.1.6",
     "marky": "^1.2.1",
     "mini-css-extract-plugin": "^1.6.2",
-    "msw": "^0.39.2",
     "object-assign": "^4.1.1",
     "object-fit-images": "^3.2.3",
     "object.values": "^1.1.0",
     "path-browserify": "^1.0.1",
-    "postcss": "^8.1.1",
+    "postcss": "^8.4.5",
     "postcss-loader": "^4.0.3",
     "postcss-object-fit-images": "^1.1.2",
     "process": "^0.11.10",
@@ -156,7 +160,6 @@
     "substring-trie": "^1.0.2",
     "terser-webpack-plugin": "^5.2.3",
     "tiny-queue": "^0.2.1",
-    "ts-jest": "^27.0.5",
     "ts-loader": "^9.2.6",
     "tslib": "^2.3.1",
     "twemoji": "https://github.com/twitter/twemoji#v13.0.2",
@@ -171,6 +174,9 @@
     "wicg-inert": "^3.1.1"
   },
   "devDependencies": {
+    "@jest/globals": "^27.5.1",
+    "@typescript-eslint/eslint-plugin": "^5.15.0",
+    "@typescript-eslint/parser": "^5.15.0",
     "axios-mock-adapter": "^1.18.1",
     "babel-eslint": "^10.1.0",
     "babel-jest": "^27.1.0",
@@ -192,6 +198,8 @@
     "stylelint": "^13.7.2",
     "stylelint-config-standard": "^22.0.0",
     "stylelint-scss": "^3.18.0",
+    "tailwindcss": "^3.0.15",
+    "ts-jest": "^27.0.5",
     "webpack-dev-server": "^4.1.0",
     "yargs": "^16.0.3"
   }

tsconfig.json

@@ -9,6 +9,8 @@
     "allowJs": true,
     "moduleResolution": "node",
     "experimentalDecorators": true,
-    "allowSyntheticDefaultImports": true
-  }
+    "allowSyntheticDefaultImports": true,
+    "typeRoots": [ "./types", "./node_modules/@types"]
+  },
+  "exclude": ["node_modules", "types", "**/*.test.*", "**/__mocks__/*", "**/__tests__/*"]
 }

types/redux-immutable/index.d.ts

@@ -0,0 +1,17 @@
+// Type definitions for redux-immutable v4.0.0
+// Project: https://github.com/gajus/redux-immutable
+// Definitions by: Sebastian Sebald <https://github.com/sebald>
+//                 Gavin Gregory <https://github.com/gavingregory>
+//                 Kanitkorn Sujautra <https://github.com/lukyth>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.3
+
+declare module 'redux-immutable' {
+  import { Collection, Record } from 'immutable';
+  import { ReducersMapObject, Reducer, Action } from 'redux';
+
+  export function combineReducers<S, A extends Action, T>(reducers: ReducersMapObject<S, A>, getDefaultState?: () => Collection.Keyed<T, S>): Reducer<S, A>;
+  export function combineReducers<S, A extends Action>(reducers: ReducersMapObject<S, A>, getDefaultState?: () => Collection.Indexed<S>): Reducer<S, A>;
+  export function combineReducers<S>(reducers: ReducersMapObject<S, any>, getDefaultState?: () => Collection.Indexed<S>): Reducer<S>;
+  export function combineReducers<S, T extends object>(reducers: ReducersMapObject<S, any>, getDefaultState?: Record.Factory<T>): Reducer<S>;
+}