WIP: reducer typescript

2022-03-15 08:48:18 -05:00 · 2022-03-15 08:48:18 -05:00 · 27564dd360
commit 27564dd360
parent 16266f7cb4
9 changed files with 73 additions and 172 deletions
--- a/app/soapbox/actions/instance.ts
+++ b/app/soapbox/actions/instance.ts
@ -1,9 +1,12 @@
 import { get } from 'lodash';
+import { AnyAction } from 'redux';
+import { ThunkAction } from 'redux-thunk'
+import { AxiosResponse } from 'axios';

 import KVStore from 'soapbox/storage/kv_store';
+import { AppDispatch, RootState } from 'soapbox/store';
 import { getAuthUserUrl } from 'soapbox/utils/auth';
 import { parseVersion } from 'soapbox/utils/features';
-
 import api from '../api';

 export const INSTANCE_FETCH_REQUEST = 'INSTANCE_FETCH_REQUEST';
@ -18,13 +21,13 @@ export const NODEINFO_FETCH_REQUEST = 'NODEINFO_FETCH_REQUEST';
 export const NODEINFO_FETCH_SUCCESS = 'NODEINFO_FETCH_SUCCESS';
 export const NODEINFO_FETCH_FAIL    = 'NODEINFO_FETCH_FAIL';

-const getMeUrl = state => {
-  const me = state.get('me');
-  return state.getIn(['accounts', me, 'url']);
+const getMeUrl = (state: RootState) => {
+  const me = state.me;
+  return state.accounts.getIn([me, 'url']);
 };

 // Figure out the appropriate instance to fetch depending on the state
-export const getHost = state => {
+export const getHost = (state: RootState) => {
  const accountUrl = getMeUrl(state) || getAuthUserUrl(state);

  try {
@ -34,28 +37,28 @@ export const getHost = state => {
  }
 };

-export function rememberInstance(host) {
-  return (dispatch, getState) => {
+export function rememberInstance(host: string) {
+  return (dispatch: AppDispatch, _getState: () => RootState) => {
    dispatch({ type: INSTANCE_REMEMBER_REQUEST, host });
-    return KVStore.getItemOrError(`instance:${host}`).then(instance => {
+    return KVStore.getItemOrError(`instance:${host}`).then((instance: Record<string, any>) => {
      dispatch({ type: INSTANCE_REMEMBER_SUCCESS, host, instance });
      return instance;
-    }).catch(error => {
+    }).catch((error: Error) => {
      dispatch({ type: INSTANCE_REMEMBER_FAIL, host, error, skipAlert: true });
    });
  };
 }

 // We may need to fetch nodeinfo on Pleroma < 2.1
-const needsNodeinfo = instance => {
+const needsNodeinfo = (instance: Record<string, any>): boolean => {
  const v = parseVersion(get(instance, 'version'));
  return v.software === 'Pleroma' && !get(instance, ['pleroma', 'metadata']);
 };

-export function fetchInstance() {
+export function fetchInstance(): ThunkAction<AxiosResponse, RootState, unknown, AnyAction> {
  return (dispatch, getState) => {
    dispatch({ type: INSTANCE_FETCH_REQUEST });
-    return api(getState).get('/api/v1/instance').then(({ data: instance }) => {
+    return api(getState).get('/api/v1/instance').then(({ data: instance }: { data: Record<string, any> }) => {
      dispatch({ type: INSTANCE_FETCH_SUCCESS, instance });
      if (needsNodeinfo(instance)) {
        dispatch(fetchNodeinfo()); // Pleroma < 2.1 backwards compatibility
@ -69,7 +72,7 @@ export function fetchInstance() {

 // Tries to remember the instance from browser storage before fetching it
 export function loadInstance() {
-  return (dispatch, getState) => {
+  return (dispatch: AppDispatch, getState: () => RootState) => {
    const host = getHost(getState());

    return dispatch(rememberInstance(host)).finally(() => {
@ -79,12 +82,12 @@ export function loadInstance() {
 }

 export function fetchNodeinfo() {
-  return (dispatch, getState) => {
+  return (dispatch: AppDispatch, getState: () => RootState) => {
    dispatch({ type: NODEINFO_FETCH_REQUEST });
-    api(getState).get('/nodeinfo/2.1.json').then(({ data: nodeinfo }) => {
-      dispatch({ type: NODEINFO_FETCH_SUCCESS, nodeinfo });
-    }).catch(error => {
-      dispatch({ type: NODEINFO_FETCH_FAIL, error, skipAlert: true });
+    return api(getState).get('/nodeinfo/2.1.json').then(({ data: nodeinfo }) => {
+      return dispatch({ type: NODEINFO_FETCH_SUCCESS, nodeinfo });
+    }).catch((error: Error) => {
+      return dispatch({ type: NODEINFO_FETCH_FAIL, error, skipAlert: true });
    });
  };
 }
--- a/app/soapbox/components/badge.tsx
+++ b/app/soapbox/components/badge.tsx
@ -1,9 +1,15 @@
 import PropTypes from 'prop-types';
 import React from 'react';

-const Badge = (props: any) => (
-  <span className={'badge badge--' + props.slug}>{props.title}</span>
-);
+import { useAppSelector } from 'soapbox/hooks';
+
+const Badge = (props: any) => {
+  const title = useAppSelector(state => state.instance.titles);
+
+  return (
+    <span title={title} className={'badge badge--' + props.slug}>{props.title}</span>
+  );
+};

 Badge.propTypes = {
  title: PropTypes.string.isRequired,
--- a/app/soapbox/reducers/index.ts
+++ b/app/soapbox/reducers/index.ts
@ -117,7 +117,7 @@ const reducers = {

 // Build a default state from all reducers: it has the key and `undefined`
 const StateRecord = ImmutableRecord(
-  Object.keys(reducers).reduce((params, reducer) => {
+  Object.keys(reducers).reduce((params: Record<string, any>, reducer) => {
    params[reducer] = undefined;
    return params;
  }, {}),
@ -126,18 +126,18 @@ const StateRecord = ImmutableRecord(
 const appReducer = combineReducers(reducers, StateRecord);

 // Clear the state (mostly) when the user logs out
-const logOut = (state = StateRecord()) => {
-  const whitelist = ['instance', 'soapbox', 'custom_emojis', 'auth'];
+const logOut = (state: any = StateRecord()): ReturnType<typeof appReducer> => {
+  const whitelist: string[] = ['instance', 'soapbox', 'custom_emojis', 'auth'];

  return StateRecord(
-    whitelist.reduce((acc, curr) => {
+    whitelist.reduce((acc: Record<string, any>, curr) => {
      acc[curr] = state.get(curr);
      return acc;
    }, {}),
-  );
+  ) as unknown as ReturnType<typeof appReducer>;
 };

-const rootReducer = (state, action) => {
+const rootReducer: typeof appReducer = (state, action) => {
  switch(action.type) {
  case AUTH_LOGGED_OUT:
    return appReducer(logOut(state), action);
--- a/app/soapbox/reducers/instance.js
+++ b/app/soapbox/reducers/instance.js
@ -1,132 +0,0 @@
-import { Map as ImmutableMap, List as ImmutableList, fromJS } from 'immutable';
-
-import { ADMIN_CONFIG_UPDATE_REQUEST, ADMIN_CONFIG_UPDATE_SUCCESS } from 'soapbox/actions/admin';
-import { PLEROMA_PRELOAD_IMPORT } from 'soapbox/actions/preload';
-import { normalizeInstance } from 'soapbox/normalizers/instance';
-import KVStore from 'soapbox/storage/kv_store';
-import { ConfigDB } from 'soapbox/utils/config_db';
-
-import {
-  INSTANCE_REMEMBER_SUCCESS,
-  INSTANCE_FETCH_SUCCESS,
-  INSTANCE_FETCH_FAIL,
-  NODEINFO_FETCH_SUCCESS,
-} from '../actions/instance';
-
-const initialState = normalizeInstance(ImmutableMap());
-
-const nodeinfoToInstance = nodeinfo => {
-  // Match Pleroma's develop branch
-  return ImmutableMap({
-    pleroma: ImmutableMap({
-      metadata: ImmutableMap({
-        account_activation_required: nodeinfo.getIn(['metadata', 'accountActivationRequired']),
-        features: nodeinfo.getIn(['metadata', 'features']),
-        federation: nodeinfo.getIn(['metadata', 'federation']),
-        fields_limits: ImmutableMap({
-          max_fields: nodeinfo.getIn(['metadata', 'fieldsLimits', 'maxFields']),
-        }),
-      }),
-    }),
-  });
-};
-
-const importInstance = (state, instance) => {
-  return normalizeInstance(instance);
-};
-
-const importNodeinfo = (state, nodeinfo) => {
-  return nodeinfoToInstance(nodeinfo).mergeDeep(state);
-};
-
-const preloadImport = (state, action, path) => {
-  const instance = action.data[path];
-  return instance ? importInstance(state, fromJS(instance)) : state;
-};
-
-const getConfigValue = (instanceConfig, key) => {
-  const v = instanceConfig
-    .find(value => value.getIn(['tuple', 0]) === key);
-
-  return v ? v.getIn(['tuple', 1]) : undefined;
-};
-
-const importConfigs = (state, configs) => {
-  // FIXME: This is pretty hacked together. Need to make a cleaner map.
-  const config = ConfigDB.find(configs, ':pleroma', ':instance');
-  const simplePolicy = ConfigDB.toSimplePolicy(configs);
-
-  if (!config && !simplePolicy) return state;
-
-  return state.withMutations(state => {
-    if (config) {
-      const value = config.get('value', ImmutableList());
-      const registrationsOpen = getConfigValue(value, ':registrations_open');
-      const approvalRequired = getConfigValue(value, ':account_approval_required');
-
-      state.update('registrations', c => typeof registrationsOpen === 'boolean' ? registrationsOpen : c);
-      state.update('approval_required', c => typeof approvalRequired === 'boolean' ? approvalRequired : c);
-    }
-
-    if (simplePolicy) {
-      state.setIn(['pleroma', 'metadata', 'federation', 'mrf_simple'], simplePolicy);
-    }
-  });
-};
-
-const handleAuthFetch = state => {
-  // Authenticated fetch is enabled, so make the instance appear censored
-  return ImmutableMap({
-    title: '██████',
-    description: '████████████',
-  }).merge(state);
-};
-
-const getHost = instance => {
-  try {
-    return new URL(instance.uri).host;
-  } catch {
-    try {
-      return new URL(`https://${instance.uri}`).host;
-    } catch {
-      return null;
-    }
-  }
-};
-
-const persistInstance = instance => {
-  const host = getHost(instance);
-
-  if (host) {
-    KVStore.setItem(`instance:${host}`, instance).catch(console.error);
-  }
-};
-
-const handleInstanceFetchFail = (state, error) => {
-  if (error.response?.status === 401) {
-    return handleAuthFetch(state);
-  } else {
-    return state;
-  }
-};
-
-export default function instance(state = initialState, action) {
-  switch(action.type) {
-  case PLEROMA_PRELOAD_IMPORT:
-    return preloadImport(state, action, '/api/v1/instance');
-  case INSTANCE_REMEMBER_SUCCESS:
-    return importInstance(state, fromJS(action.instance));
-  case INSTANCE_FETCH_SUCCESS:
-    persistInstance(action.instance);
-    return importInstance(state, fromJS(action.instance));
-  case INSTANCE_FETCH_FAIL:
-    return handleInstanceFetchFail(state, action.error);
-  case NODEINFO_FETCH_SUCCESS:
-    return importNodeinfo(state, fromJS(action.nodeinfo));
-  case ADMIN_CONFIG_UPDATE_REQUEST:
-  case ADMIN_CONFIG_UPDATE_SUCCESS:
-    return importConfigs(state, fromJS(action.configs));
-  default:
-    return state;
-  }
-}
--- a/app/soapbox/storage/kv_store.ts
+++ b/app/soapbox/storage/kv_store.ts
@ -11,7 +11,7 @@ export const KVStore = localforage.createInstance({

 // localForage returns 'null' when a key isn't found.
 // In the Redux action flow, we want it to fail harder.
-KVStore.getItemOrError = key => {
+KVStore.getItemOrError = (key: string) => {
  return KVStore.getItem(key).then(value => {
    if (value === null) {
      throw new Error(`KVStore: null value for key ${key}`);
--- a/package.json
+++ b/package.json
@ -60,7 +60,8 @@
    "@sentry/tracing": "^6.12.0",
    "@tabler/icons": "^1.53.0",
    "@types/escape-html": "^1.0.1",
-    "@types/redux-immutable": "^4.0.2",
+    "@types/http-link-header": "^1.0.3",
+    "@types/lodash": "^4.14.180",
    "array-includes": "^3.0.3",
    "autoprefixer": "^10.0.0",
    "axios": "^0.21.4",
--- a/tsconfig.json
+++ b/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"]
 }
--- a/types/redux-immutable/index.d.ts
+++ b/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 { ReducersMapObject, Reducer, Action } from 'redux';
+  import { Collection, Record as ImmutableRecord } from 'immutable';
+
+  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>(reducers: ReducersMapObject<S, any>, getDefaultState?: () => ImmutableRecord<any>): Reducer<S>;
+}
--- a/yarn.lock
+++ b/yarn.lock
@ -1814,6 +1814,13 @@
  resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-5.1.2.tgz#693b316ad323ea97eed6b38ed1a3cc02b1672b57"
  integrity sha512-h4lTMgMJctJybDp8CQrxTUiiYmedihHWkjnF/8Pxseu2S6Nlfcy8kwboQ8yejh456rP2yWoEVm1sS/FVsfM48w==

+"@types/http-link-header@^1.0.3":
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/@types/http-link-header/-/http-link-header-1.0.3.tgz#899adf1d8d2036074514f3dbd148fb901ceff920"
+  integrity sha512-y8HkoD/vyid+5MrJ3aas0FvU3/BVBGcyG9kgxL0Zn4JwstA8CglFPnrR0RuzOjRCXwqzL5uxWC2IO7Ub0rMU2A==
+  dependencies:
+    "@types/node" "*"
+
 "@types/http-proxy@^1.17.5":
  version "1.17.7"
  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.7.tgz#30ea85cc2c868368352a37f0d0d3581e24834c6f"
@ -1850,6 +1857,11 @@
  resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
  integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=

+"@types/lodash@^4.14.180":
+  version "4.14.180"
+  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.180.tgz#4ab7c9ddfc92ec4a887886483bc14c79fb380670"
+  integrity sha512-XOKXa1KIxtNXgASAnwj7cnttJxS4fksBRywK/9LzRV5YxrF80BXZIGeQSuoESQ/VkUj30Ae0+YcuHc15wJCB2g==
+
 "@types/mdast@^3.0.0":
  version "3.0.10"
  resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.10.tgz#4724244a82a4598884cbbe9bcfd73dff927ee8af"
@ -1911,14 +1923,6 @@
    "@types/scheduler" "*"
    csstype "^3.0.2"

-"@types/redux-immutable@^4.0.2":
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/@types/redux-immutable/-/redux-immutable-4.0.2.tgz#8c3c666c33130c6794280bc3dc7726bfa0cfacc7"
-  integrity sha512-nlnhJn9B+NtIemWnnNWO9arUioeHLNvYCADSSa+48c81y8VwutgHH3WHobX711KKrfhlMlEz3+Q9SYX3sxrYPg==
-  dependencies:
-    immutable "^4.0.0-rc.1"
-    redux "^4.0.0"
-
 "@types/retry@^0.12.0":
  version "0.12.1"
  resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.1.tgz#d8f1c0d0dc23afad6dc16a9e993a0865774b4065"
@ -5163,7 +5167,7 @@ immediate@~3.0.5:
  resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
  integrity sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=

-immutable@^4.0.0, immutable@^4.0.0-rc.1:
+immutable@^4.0.0:
  version "4.0.0"
  resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.0.0.tgz#b86f78de6adef3608395efb269a91462797e2c23"
  integrity sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==