refactor(web): remove typescript

packages/web/src/pages/UserInterface/index.jsx

@@ -6,7 +6,6 @@ import Stack from '@mui/material/Stack';
 import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
 import merge from 'lodash/merge';
 import * as React from 'react';
-
 import ColorInput from 'components/ColorInput';
 import Container from 'components/Container';
 import Form from 'components/Form';
@@ -22,33 +21,16 @@ import {
   primaryLightColor,
   primaryMainColor,
 } from 'styles/theme';
-
-type UserInterface = {
-  palette: {
-    primary: {
-      dark: string;
-      light: string;
-      main: string;
-    };
-  };
-  title: string;
-  logo: {
-    svgData: string;
-  };
-};
-
-const getPrimaryMainColor = (color?: string) => color || primaryMainColor;
-const getPrimaryDarkColor = (color?: string) => color || primaryDarkColor;
-const getPrimaryLightColor = (color?: string) => color || primaryLightColor;
-
+const getPrimaryMainColor = (color) => color || primaryMainColor;
+const getPrimaryDarkColor = (color) => color || primaryDarkColor;
+const getPrimaryLightColor = (color) => color || primaryLightColor;
 const defaultValues = {
   title: 'Automatisch',
   'palette.primary.main': primaryMainColor,
   'palette.primary.dark': primaryDarkColor,
   'palette.primary.light': primaryLightColor,
 };
-
-export default function UserInterface(): React.ReactElement {
+export default function UserInterface() {
   const formatMessage = useFormatMessage();
   const [updateConfig, { loading }] = useMutation(UPDATE_CONFIG);
   const { config, loading: configLoading } = useConfig([
@@ -59,28 +41,22 @@ export default function UserInterface(): React.ReactElement {
     'logo.svgData',
   ]);
   const enqueueSnackbar = useEnqueueSnackbar();
-  const configWithDefaults = merge(
-    {},
-    defaultValues,
-    nestObject<UserInterface>(config)
-  );
-
-  const handleUserInterfaceUpdate = async (uiData: Partial<UserInterface>) => {
+  const configWithDefaults = merge({}, defaultValues, nestObject(config));
+  const handleUserInterfaceUpdate = async (uiData) => {
     try {
       const input = {
         title: uiData?.title,
         'palette.primary.main': getPrimaryMainColor(
-          uiData?.palette?.primary.main
+          uiData?.palette?.primary.main,
         ),
         'palette.primary.dark': getPrimaryDarkColor(
-          uiData?.palette?.primary.dark
+          uiData?.palette?.primary.dark,
         ),
         'palette.primary.light': getPrimaryLightColor(
-          uiData?.palette?.primary.light
+          uiData?.palette?.primary.light,
         ),
         'logo.svgData': uiData?.logo?.svgData,
       };
-
       await updateConfig({
         variables: {
           input,
@@ -90,14 +66,12 @@ export default function UserInterface(): React.ReactElement {
         },
         update: async function (cache, { data: { updateConfig } }) {
           const newConfigWithDefaults = merge({}, defaultValues, updateConfig);
-
           cache.writeQuery({
             query: GET_CONFIG,
             data: {
               getConfig: newConfigWithDefaults,
             },
           });
-
           cache.writeQuery({
             query: GET_CONFIG,
             data: {
@@ -107,7 +81,6 @@ export default function UserInterface(): React.ReactElement {
               keys: ['logo.svgData'],
             },
           });
-
           cache.writeQuery({
             query: GET_CONFIG,
             data: {
@@ -125,18 +98,16 @@ export default function UserInterface(): React.ReactElement {
           });
         },
       });
-
       enqueueSnackbar(formatMessage('userInterfacePage.successfullyUpdated'), {
         variant: 'success',
         SnackbarProps: {
-          'data-test': 'snackbar-update-user-interface-success'
-        }
+          'data-test': 'snackbar-update-user-interface-success',
+        },
       });
     } catch (error) {
       throw new Error('Failed while updating!');
     }
   };
-
   return (
     <Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
       <Grid container item xs={12} sm={10} md={9}>
@@ -169,7 +140,7 @@ export default function UserInterface(): React.ReactElement {
                 <ColorInput
                   name="palette.primary.main"
                   label={formatMessage(
-                    'userInterfacePage.primaryMainColorFieldLabel'
+                    'userInterfacePage.primaryMainColorFieldLabel',
                   )}
                   fullWidth
                   data-test="primary-main-color-input"
@@ -178,7 +149,7 @@ export default function UserInterface(): React.ReactElement {
                 <ColorInput
                   name="palette.primary.dark"
                   label={formatMessage(
-                    'userInterfacePage.primaryDarkColorFieldLabel'
+                    'userInterfacePage.primaryDarkColorFieldLabel',
                   )}
                   fullWidth
                   data-test="primary-dark-color-input"
@@ -187,7 +158,7 @@ export default function UserInterface(): React.ReactElement {
                 <ColorInput
                   name="palette.primary.light"
                   label={formatMessage(
-                    'userInterfacePage.primaryLightColorFieldLabel'
+                    'userInterfacePage.primaryLightColorFieldLabel',
                   )}
                   fullWidth
                   data-test="primary-light-color-input"