prettier

2026-04-21 23:25:59 +00:00 · 2021-01-23 07:22:09 +01:00
parent 37cc86f8d2
commit 451af5d09f
141 changed files with 763 additions and 787 deletions
--- a/packages/web/src/utility/FormArgumentList.js
+++ b/packages/web/src/utility/FormArgumentList.js
@@ -17,7 +17,7 @@ function FormArgument({ arg, namePrefix }) {
  if (arg.type == 'select') {
    return (
      <FormSelectField label={arg.label} name={name}>
-        {arg.options.map((opt) =>
+        {arg.options.map(opt =>
          _.isString(opt) ? <option value={opt}>{opt}</option> : <option value={opt.value}>{opt.name}</option>
        )}
      </FormSelectField>
@@ -34,7 +34,7 @@ export default function FormArgumentList({ args, onChangeValues = undefined, nam
  return (
    <FormArgumentsWrapper>
      {' '}
-      {args.map((arg) => (
+      {args.map(arg => (
        <FormArgument arg={arg} key={arg.name} namePrefix={namePrefix} />
      ))}
    </FormArgumentsWrapper>
--- a/packages/web/src/utility/FormProvider.js
+++ b/packages/web/src/utility/FormProvider.js
@@ -17,7 +17,7 @@ export function FormProvider({ children, initialValues = {}, template = FormFiel
 export function FormProviderCore({ children, values, setValues, template = FormFieldTemplateDefault }) {
  const [submitAction, setSubmitAction] = React.useState(null);
  const handleEnter = React.useCallback(
-    (e) => {
+    e => {
      if (e.keyCode == keycodes.enter && submitAction && submitAction.action) {
        e.preventDefault();
        submitAction.action(values);
@@ -33,7 +33,7 @@ export function FormProviderCore({ children, values, setValues, template = FormF
  }, [handleEnter]);
  const setFieldValue = React.useCallback(
    (field, value) =>
-      setValues((v) => ({
+      setValues(v => ({
        ...v,
        [field]: value,
      })),
--- a/packages/web/src/utility/ObjectListControl.js
+++ b/packages/web/src/utility/ObjectListControl.js
@@ -9,7 +9,7 @@ const ObjectListWrapper = styled.div`
 `;

 const ObjectListHeader = styled.div`
-  background-color: ${(props) => props.theme.gridheader_background};
+  background-color: ${props => props.theme.gridheader_background};
  padding: 5px;
 `;

@@ -36,7 +36,7 @@ export default function ObjectListControl({ collection = [], title, showIfEmpty
      </ObjectListHeader>
      <ObjectListBody>
        <TableControl rows={collection}>
-          <TableColumn fieldName="displayName" header="Name" formatter={(data) => <NameComponent data={data} />} />
+          <TableColumn fieldName="displayName" header="Name" formatter={data => <NameComponent data={data} />} />
          {children}
        </TableControl>
      </ObjectListBody>
--- a/packages/web/src/utility/SocketProvider.js
+++ b/packages/web/src/utility/SocketProvider.js
@@ -11,7 +11,7 @@ export function SocketProvider({ children }) {
    // const newSocket = io('http://localhost:3000', { transports: ['websocket'] });
    const newSocket = io(resolveApi());
    setSocket(newSocket);
-    newSocket.on('clean-cache', (reloadTrigger) => cacheClean(reloadTrigger));
+    newSocket.on('clean-cache', reloadTrigger => cacheClean(reloadTrigger));
  }, []);
  return <SocketContext.Provider value={socket}>{children}</SocketContext.Provider>;
 }
--- a/packages/web/src/utility/TableControl.js
+++ b/packages/web/src/utility/TableControl.js
@@ -7,7 +7,7 @@ import useTheme from '../theme/useTheme';
 const Table = styled.table`
  border-collapse: collapse;
  width: 100%;
-  user-select: ${(props) =>
+  user-select: ${props =>
    // @ts-ignore
    props.focusable ? 'none' : ''};
  // outline: none;
@@ -16,17 +16,17 @@ const TableHead = styled.thead``;
 const TableBody = styled.tbody``;
 const TableHeaderRow = styled.tr``;
 const TableBodyRow = styled.tr`
-  background-color: ${(props) =>
+  background-color: ${props =>
    // @ts-ignore
    props.isSelected ? props.theme.gridbody_background_blue[1] : props.theme.gridbody_background};
 `;
 const TableHeaderCell = styled.td`
-  border: 1px solid ${(props) => props.theme.gridheader_background};
-  background-color: ${(props) => props.theme.gridheader_background};
+  border: 1px solid ${props => props.theme.gridheader_background};
+  background-color: ${props => props.theme.gridheader_background};
  padding: 5px;
 `;
 const TableBodyCell = styled.td`
-  border: 1px solid ${(props) => props.theme.gridbody_background2};
+  border: 1px solid ${props => props.theme.gridbody_background2};
  padding: 5px;
 `;

@@ -51,8 +51,8 @@ export default function TableControl({
  tableRef = undefined,
 }) {
  const columns = (children instanceof Array ? _.flatten(children) : [children])
-    .filter((child) => child && child.props && child.props.fieldName)
-    .map((child) => child.props);
+    .filter(child => child && child.props && child.props.fieldName)
+    .map(child => child.props);

  const myTableRef = React.useRef(null);
  const currentTableRef = tableRef || myTableRef;
@@ -65,12 +65,12 @@ export default function TableControl({
  }, []);

  const handleKeyDown = React.useCallback(
-    (event) => {
+    event => {
      if (event.keyCode == keycodes.downArrow) {
-        setSelectedIndex((i) => Math.min(i + 1, rows.length - 1));
+        setSelectedIndex(i => Math.min(i + 1, rows.length - 1));
      }
      if (event.keyCode == keycodes.upArrow) {
-        setSelectedIndex((i) => Math.max(0, i - 1));
+        setSelectedIndex(i => Math.max(0, i - 1));
      }
      if (onKeyDown) onKeyDown(event);
    },
@@ -87,7 +87,7 @@ export default function TableControl({
    >
      <TableHead>
        <TableHeaderRow>
-          {columns.map((x) => (
+          {columns.map(x => (
            <TableHeaderCell key={x.fieldName} theme={theme}>
              {x.header}
            </TableHeaderCell>
@@ -110,8 +110,10 @@ export default function TableControl({
                : undefined
            }
          >
-            {columns.map((col) => (
-              <TableBodyCell key={col.fieldName} theme={theme}>{format(row, col)}</TableBodyCell>
+            {columns.map(col => (
+              <TableBodyCell key={col.fieldName} theme={theme}>
+                {format(row, col)}
+              </TableBodyCell>
            ))}
          </TableBodyRow>
        ))}
--- a/packages/web/src/utility/UploadButton.js
+++ b/packages/web/src/utility/UploadButton.js
@@ -11,7 +11,7 @@ const Wrapper = styled.div`
 export default function UploadButton() {
  const theme = useTheme();
  const uploadFiles = useUploadFiles();
-  const handleChange = (e) => {
+  const handleChange = e => {
    const files = [...e.target.files];
    uploadFiles(files);
  };
--- a/packages/web/src/utility/UploadsProvider.js
+++ b/packages/web/src/utility/UploadsProvider.js
@@ -23,8 +23,8 @@ export function useUploadFiles() {
  const extensions = useExtensions();

  const handleUploadFiles = React.useCallback(
-    (files) => {
-      files.forEach(async (file) => {
+    files => {
+      files.forEach(async file => {
        if (parseInt(file.size, 10) >= 4 * 1024 * 1024) {
          // to big file
          return;
@@ -56,7 +56,7 @@ export function useUploadFiles() {
          uploadListener(fileData);
        } else {
          if (findFileFormat(extensions, fileData.storageType)) {
-            showModal((modalState) => (
+            showModal(modalState => (
              <ImportExportModal
                uploadedFile={fileData}
                modalState={modalState}
--- a/packages/web/src/utility/common.js
+++ b/packages/web/src/utility/common.js
@@ -1,4 +1,3 @@
-
 export class LoadingToken {
  constructor() {
    this.isCanceled = false;
@@ -10,9 +9,9 @@ export class LoadingToken {
 }

 export function sleep(milliseconds) {
-  return new Promise((resolve) => window.setTimeout(() => resolve(null), milliseconds));
+  return new Promise(resolve => window.setTimeout(() => resolve(null), milliseconds));
 }

 export function changeTab(tabid, setOpenedTabs, changeFunc) {
-  setOpenedTabs((files) => files.map((tab) => (tab.tabid == tabid ? changeFunc(tab) : tab)));
+  setOpenedTabs(files => files.map(tab => (tab.tabid == tabid ? changeFunc(tab) : tab)));
 }
--- a/packages/web/src/utility/fileformats.js
+++ b/packages/web/src/utility/fileformats.js
@@ -8,7 +8,7 @@ const jsonlFormat = {

 /** @returns {import('dbgate-types').FileFormatDefinition[]} */
 export function buildFileFormats(plugins) {
-  const res = [ jsonlFormat];
+  const res = [jsonlFormat];
  for (const { content } of plugins) {
    const { fileFormats } = content;
    if (fileFormats) res.push(...fileFormats);
@@ -17,7 +17,7 @@ export function buildFileFormats(plugins) {
 }

 export function findFileFormat(extensions, storageType) {
-  return extensions.fileFormats.find((x) => x.storageType == storageType);
+  return extensions.fileFormats.find(x => x.storageType == storageType);
 }

 export function getFileFormatDirections(format) {
@@ -29,5 +29,5 @@ export function getFileFormatDirections(format) {
 }

 export function getDefaultFileFormat(extensions) {
-  return extensions.fileFormats.find((x) => x.storageType == 'csv') || jsonlFormat;
+  return extensions.fileFormats.find(x => x.storageType == 'csv') || jsonlFormat;
 }
--- a/packages/web/src/utility/formStyle.js
+++ b/packages/web/src/utility/formStyle.js
@@ -28,7 +28,7 @@ export const FormRowTiny = styled.div`
 `;

 export const FormLabelTiny = styled.div`
-  color: ${(props) => props.theme.manager_font3};
+  color: ${props => props.theme.manager_font3};
 `;

 export const FormValueTiny = styled.div`
--- a/packages/web/src/utility/forms.js
+++ b/packages/web/src/utility/forms.js
@@ -33,7 +33,7 @@ export function FormCondition({ condition, children }) {

 export function FormTextFieldRaw({ name, focused = false, ...other }) {
  const { values, setFieldValue } = useForm();
-  const handleChange = (event) => {
+  const handleChange = event => {
    setFieldValue(name, event.target.value);
  };
  const textFieldRef = React.useRef(null);
@@ -47,7 +47,7 @@ export function FormTextFieldRaw({ name, focused = false, ...other }) {
 export function FormPasswordFieldRaw({ name, focused = false, ...other }) {
  const { values, setFieldValue } = useForm();
  const [showPassword, setShowPassword] = React.useState(false);
-  const handleChange = (event) => {
+  const handleChange = event => {
    setFieldValue(name, event.target.value);
  };
  const textFieldRef = React.useRef(null);
@@ -68,7 +68,7 @@ export function FormPasswordFieldRaw({ name, focused = false, ...other }) {
        type={isCrypted || showPassword ? 'text' : 'password'}
      />

-      {!isCrypted && <FontIcon icon="icon eye" onClick={() => setShowPassword((x) => !x)} />}
+      {!isCrypted && <FontIcon icon="icon eye" onClick={() => setShowPassword(x => !x)} />}
    </>
  );
 }
@@ -93,7 +93,7 @@ export function FormPasswordField({ name, label, focused = false, ...other }) {

 export function FormCheckboxFieldRaw({ name = undefined, defaultValue = undefined, ...other }) {
  const { values, setFieldValue } = useForm();
-  const handleChange = (event) => {
+  const handleChange = event => {
    setFieldValue(name, event.target.checked);
  };
  let isChecked = values[name];
@@ -113,7 +113,7 @@ export function FormCheckboxField({ label, ...other }) {

 export function FormSelectFieldRaw({ children, name, ...other }) {
  const { values, setFieldValue } = useForm();
-  const handleChange = (event) => {
+  const handleChange = event => {
    setFieldValue(name, event.target.value);
  };
  return (
@@ -169,7 +169,7 @@ export function FormReactSelect({ options, name, isMulti = false, Component = Se

  return (
    <Component
-      theme={(t) => ({
+      theme={t => ({
        ...t,
        colors: {
          ...t.colors,
@@ -194,12 +194,10 @@ export function FormReactSelect({ options, name, isMulti = false, Component = Se
      options={options}
      value={
        isMulti
-          ? options.filter((x) => values[name] && values[name].includes(x.value))
-          : options.find((x) => x.value == values[name])
-      }
-      onChange={(item) =>
-        setFieldValue(name, isMulti ? getAsArray(item).map((x) => x.value) : item ? item.value : null)
+          ? options.filter(x => values[name] && values[name].includes(x.value))
+          : options.find(x => x.value == values[name])
      }
+      onChange={item => setFieldValue(name, isMulti ? getAsArray(item).map(x => x.value) : item ? item.value : null)}
      menuPortalTarget={document.body}
      isMulti={isMulti}
      closeMenuOnSelect={!isMulti}
@@ -212,7 +210,7 @@ export function FormConnectionSelect({ name }) {
  const connections = useConnectionList();
  const connectionOptions = React.useMemo(
    () =>
-      (connections || []).map((conn) => ({
+      (connections || []).map(conn => ({
        value: conn._id,
        label: conn.displayName || conn.server,
      })),
@@ -228,7 +226,7 @@ export function FormDatabaseSelect({ conidName, name }) {
  const databases = useDatabaseList({ conid: values[conidName] });
  const databaseOptions = React.useMemo(
    () =>
-      (databases || []).map((db) => ({
+      (databases || []).map(db => ({
        value: db.name,
        label: db.name,
      })),
@@ -244,7 +242,7 @@ export function FormSchemaSelect({ conidName, databaseName, name }) {
  const dbinfo = useDatabaseInfo({ conid: values[conidName], database: values[databaseName] });
  const schemaOptions = React.useMemo(
    () =>
-      ((dbinfo && dbinfo.schemas) || []).map((schema) => ({
+      ((dbinfo && dbinfo.schemas) || []).map(schema => ({
        value: schema.schemaName,
        label: schema.schemaName,
      })),
@@ -261,8 +259,8 @@ export function FormTablesSelect({ conidName, databaseName, schemaName, name })
  const tablesOptions = React.useMemo(
    () =>
      [...((dbinfo && dbinfo.tables) || []), ...((dbinfo && dbinfo.views) || [])]
-        .filter((x) => !values[schemaName] || x.schemaName == values[schemaName])
-        .map((x) => ({
+        .filter(x => !values[schemaName] || x.schemaName == values[schemaName])
+        .map(x => ({
          value: x.pureName,
          label: x.pureName,
        })),
@@ -278,7 +276,7 @@ export function FormArchiveFilesSelect({ folderName, name }) {
  const files = useArchiveFiles({ folder: folderName });
  const filesOptions = React.useMemo(
    () =>
-      (files || []).map((x) => ({
+      (files || []).map(x => ({
        value: x.name,
        label: x.name,
      })),
@@ -294,13 +292,13 @@ export function FormArchiveFolderSelect({ name, additionalFolders = [], ...other
  const folders = useArchiveFolders();
  const folderOptions = React.useMemo(
    () => [
-      ...(folders || []).map((folder) => ({
+      ...(folders || []).map(folder => ({
        value: folder.name,
        label: folder.name,
      })),
      ...additionalFolders
-        .filter((x) => !(folders || []).find((y) => y.name == x))
-        .map((folder) => ({
+        .filter(x => !(folders || []).find(y => y.name == x))
+        .map(folder => ({
          value: folder,
          label: folder,
        })),
@@ -308,7 +306,7 @@ export function FormArchiveFolderSelect({ name, additionalFolders = [], ...other
    [folders]
  );

-  const handleCreateOption = (folder) => {
+  const handleCreateOption = folder => {
    axios.post('archive/create-folder', { folder });
    setFieldValue(name, folder);
  };
--- a/packages/web/src/utility/globalState.js
+++ b/packages/web/src/utility/globalState.js
@@ -53,7 +53,7 @@ const [CurrentDatabaseProvider, useCurrentDatabaseCore, useSetCurrentDatabaseCor
 function useSetCurrentDatabase() {
  const setDb = useSetCurrentDatabaseCore();
  const db = useCurrentDatabaseCore();
-  return (value) => {
+  return value => {
    if (_.get(db, 'name') !== _.get(value, 'name') || _.get(db, 'connection._id') != _.get(value, 'connection._id')) {
      setDb(value);
    }
--- a/packages/web/src/utility/inputs.js
+++ b/packages/web/src/utility/inputs.js
@@ -8,7 +8,7 @@ export function SelectField({ children = null, options = [], ...other }) {
  return (
    <select {...other}>
      {children}
-      {options.map((x) => (
+      {options.map(x => (
        <option value={x.value} key={x.value}>
          {x.label}
        </option>
--- a/packages/web/src/utility/localStorageGarbageCollector.js
+++ b/packages/web/src/utility/localStorageGarbageCollector.js
@@ -7,13 +7,13 @@ export default async function localStorageGarbageCollector() {

  const closeLimit = moment().add(-7, 'day').valueOf();

-  openedTabs = openedTabs.filter((x) => !x.closedTime || x.closedTime > closeLimit);
+  openedTabs = openedTabs.filter(x => !x.closedTime || x.closedTime > closeLimit);
  localStorage.setItem('openedTabs', JSON.stringify(openedTabs));

  const toRemove = [];
  for (const key in localStorage) {
    if (!key.startsWith('tabdata_')) continue;
-    if (openedTabs.find((x) => key.endsWith('_' + x.tabid))) continue;
+    if (openedTabs.find(x => key.endsWith('_' + x.tabid))) continue;
    toRemove.push(key);
  }

@@ -25,7 +25,7 @@ export default async function localStorageGarbageCollector() {
  const toRemoveForage = [];
  for (const key in keysForage) {
    if (!key.startsWith('tabdata_')) continue;
-    if (openedTabs.find((x) => key.endsWith('_' + x.tabid))) continue;
+    if (openedTabs.find(x => key.endsWith('_' + x.tabid))) continue;
    toRemoveForage.push(key);
  }

--- a/packages/web/src/utility/metadataLoaders.js
+++ b/packages/web/src/utility/metadataLoaders.js
@@ -8,14 +8,14 @@ const databaseInfoLoader = ({ conid, database }) => ({
  url: 'database-connections/structure',
  params: { conid, database },
  reloadTrigger: `database-structure-changed-${conid}-${database}`,
-  transform: (db) => {
-    const allForeignKeys = _.flatten(db.tables.map((x) => x.foreignKeys));
+  transform: db => {
+    const allForeignKeys = _.flatten(db.tables.map(x => x.foreignKeys));
    return {
      ...db,
-      tables: db.tables.map((table) => ({
+      tables: db.tables.map(table => ({
        ...table,
        dependencies: allForeignKeys.filter(
-          (x) => x.refSchemaName == table.schemaName && x.refTableName == table.pureName
+          x => x.refSchemaName == table.schemaName && x.refTableName == table.pureName
        ),
      })),
    };
@@ -121,7 +121,7 @@ async function getCore(loader, args) {
      url,
      params,
    });
-    return (transform || ((x) => x))(resp.data);
+    return (transform || (x => x))(resp.data);
  }

  const fromCache = cacheGet(key);
@@ -161,7 +161,7 @@ export async function getDbCore(args, objectTypeField = undefined) {
  const db = await getDatabaseInfo(args);
  if (!db) return null;
  return db[objectTypeField || args.objectTypeField].find(
-    (x) => x.pureName == args.pureName && x.schemaName == args.schemaName
+    x => x.pureName == args.pureName && x.schemaName == args.schemaName
  );
 }

@@ -169,7 +169,7 @@ export function useDbCore(args, objectTypeField = undefined) {
  const db = useDatabaseInfo(args);
  if (!db) return null;
  return db[objectTypeField || args.objectTypeField].find(
-    (x) => x.pureName == args.pureName && x.schemaName == args.schemaName
+    x => x.pureName == args.pureName && x.schemaName == args.schemaName
  );
 }

--- a/packages/web/src/utility/useDimensions.js
+++ b/packages/web/src/utility/useDimensions.js
@@ -51,7 +51,7 @@ import ResizeObserver from 'resize-observer-polyfill';
 // Export hook
 export default function useDimensions(dependencies = []) {
  const [node, setNode] = useState(null);
-  const ref = useCallback((newNode) => {
+  const ref = useCallback(newNode => {
    setNode(newNode);
  }, []);

@@ -68,7 +68,7 @@ export default function useDimensions(dependencies = []) {
  });

  // Define measure function
-  const measure = useCallback((innerNode) => {
+  const measure = useCallback(innerNode => {
    const rect = innerNode.getBoundingClientRect();
    setDimensions({
      x: rect.left,
--- a/packages/web/src/utility/useDocumentClick.js
+++ b/packages/web/src/utility/useDocumentClick.js
@@ -1,11 +1,11 @@
 import React from 'react';

 export default function useDocumentClick(callback) {
-  const mouseUpListener = React.useCallback((e) => {
+  const mouseUpListener = React.useCallback(e => {
    callback();
    document.removeEventListener('mouseup', mouseUpListener, true);
  }, []);
-  const mouseDownListener = React.useCallback((e) => {
+  const mouseDownListener = React.useCallback(e => {
    document.addEventListener('mouseup', mouseUpListener, true);
    document.removeEventListener('mousedown', mouseDownListener, true);
  }, []);
--- a/packages/web/src/utility/useEditorData.js
+++ b/packages/web/src/utility/useEditorData.js
@@ -36,7 +36,7 @@ export default function useEditorData({ tabid, reloadToken = 0, loadFromArgs = n
    if (loadFromArgs) {
      try {
        const init = await loadFromArgs();
-        changeTab(tabid, setOpenedTabs, (tab) => ({
+        changeTab(tabid, setOpenedTabs, tab => ({
          ...tab,
          props: _.omit(tab.props, ['initialArgs']),
        }));
@@ -93,7 +93,7 @@ export default function useEditorData({ tabid, reloadToken = 0, loadFromArgs = n

  const saveToStorageDebounced = React.useMemo(() => _.debounce(saveToStorage, 5000), [saveToStorage]);

-  const handleChange = (newValue) => {
+  const handleChange = newValue => {
    if (_.isFunction(newValue)) {
      valueRef.current = newValue(valueRef.current);
    } else {
--- a/packages/web/src/utility/useFetch.js
+++ b/packages/web/src/utility/useFetch.js
@@ -13,7 +13,7 @@ export default function useFetch({
  defaultValue = undefined,
  reloadTrigger = undefined,
  cacheKey = undefined,
-  transform = (x) => x,
+  transform = x => x,
  ...config
 }) {
  const [value, setValue] = React.useState([defaultValue, []]);
@@ -21,7 +21,7 @@ export default function useFetch({
  const socket = useSocket();

  const handleReload = React.useCallback(() => {
-    setLoadCounter((counter) => counter + 1);
+    setLoadCounter(counter => counter + 1);
  }, []);

  const indicators = [url, stableStringify(data), stableStringify(params), loadCounter];
--- a/packages/web/src/utility/useGridConfig.js
+++ b/packages/web/src/utility/useGridConfig.js
@@ -1,7 +1,7 @@
 import { createGridConfig } from 'dbgate-datalib';
 import React from 'react';

-const loadGridConfigFunc = (tabid) => () => {
+const loadGridConfigFunc = tabid => () => {
  const existing = localStorage.getItem(`tabdata_grid_${tabid}`);
  if (existing) {
    return {
--- a/packages/web/src/utility/useHasPermission.js
+++ b/packages/web/src/utility/useHasPermission.js
@@ -5,6 +5,6 @@ import { compilePermissions, testPermission } from 'dbgate-tools';
 export default function useHasPermission() {
  const config = useConfig();
  const compiled = React.useMemo(() => compilePermissions(config.permissions), [config]);
-  const hasPermission = (tested) => testPermission(tested, compiled);
+  const hasPermission = tested => testPermission(tested, compiled);
  return hasPermission;
 }
--- a/packages/web/src/utility/useOpenNewTab.js
+++ b/packages/web/src/utility/useOpenNewTab.js
@@ -17,7 +17,7 @@ export default function useOpenNewTab() {
      const { savedFile } = newTab.props || {};
      if (savedFile) {
        existing = openedTabs.find(
-          (x) =>
+          x =>
            x.props && x.tabComponent == newTab.tabComponent && x.closedTime == null && x.props.savedFile == savedFile
        );
      }
@@ -28,7 +28,7 @@ export default function useOpenNewTab() {
      if (!existing && !forceNewTab && component && component.matchingProps) {
        const testString = stableStringify(_.pick(newTab.props || {}, component.matchingProps));
        existing = openedTabs.find(
-          (x) =>
+          x =>
            x.props &&
            x.tabComponent == newTab.tabComponent &&
            x.closedTime == null &&
@@ -37,8 +37,8 @@ export default function useOpenNewTab() {
      }

      if (existing) {
-        setOpenedTabs((tabs) =>
-          tabs.map((x) => ({
+        setOpenedTabs(tabs =>
+          tabs.map(x => ({
            ...x,
            selected: x.tabid == existing.tabid,
          }))
@@ -56,8 +56,8 @@ export default function useOpenNewTab() {
          }
        }
      }
-      setOpenedTabs((files) => [
-        ...(files || []).map((x) => ({ ...x, selected: false })),
+      setOpenedTabs(files => [
+        ...(files || []).map(x => ({ ...x, selected: false })),
        {
          tabid,
          selected: true,
--- a/packages/web/src/utility/useStorage.js
+++ b/packages/web/src/utility/useStorage.js
@@ -18,7 +18,7 @@ export default function useStorage(key, storageObject, initialValue) {

  // Return a wrapped version of useState's setter function that ...
  // ... persists the new value to localStorage.
-  const setValue = (value) => {
+  const setValue = value => {
    try {
      // Allow value to be a function so we have same API as useState
      const valueToStore = value instanceof Function ? value(storedValue) : value;
--- a/packages/web/src/utility/useUndoReducer.js
+++ b/packages/web/src/utility/useUndoReducer.js
@@ -1,7 +1,7 @@
 import _ from 'lodash';
 import React from 'react';

-const reducer = (options) => (state, action) => {
+const reducer = options => (state, action) => {
  const { mergeNearActions } = options || {};

  const useMerge =