Fix fe warnings when running yarn start (#2387)

Author: AlinaGoaga

ui-cra/src/components/GitAuth/OAuthCallback.tsx

@@ -51,7 +51,6 @@ function OAuthCallback({
   const { setNotifications } = useNotifications();
   const { gitAuthClient } = React.useContext(GitAuth);
   const params = qs.parse(history.location.search);
-  const errorState = error || paramsError;
 
   React.useEffect(() => {
     if (provider === GitProvider.GitLab) {
@@ -89,7 +88,7 @@ function OAuthCallback({
       history.push(linkResolver(state?.page || ''));
       return;
     }
-  }, [res, history, linkResolver]);
+  }, [res, history, linkResolver, params.error, provider]);
 
   React.useEffect(() => {
     if (error) {

ui-cra/src/components/Pipelines/PipelineDetails/Workloads.tsx

@@ -1,10 +1,9 @@
-import { Button, Flex, formatURL, Link } from '@weaveworks/weave-gitops';
+import { Flex, formatURL, Link } from '@weaveworks/weave-gitops';
 import {
   Pipeline,
   PipelineTargetStatus,
 } from '../../../api/pipelines/types.pb';
 import { ClusterDashboardLink } from '../../Clusters/ClusterDashboardLink';
-
 import { Grid } from '@material-ui/core';
 import { useListConfigContext } from '../../../contexts/ListConfig';
 import {

…ponents/Secrets/Create/PrviewPRModal.tsx …onents/Secrets/Create/PreviewPRModal.tsxui-cra/src/components/Secrets/Create/PrviewPRModal.tsx renamed to ui-cra/src/components/Secrets/Create/PreviewPRModal.tsx ui-cra/src/components/Secrets/Create/PrviewPRModal.tsx renamed to ui-cra/src/components/Secrets/Create/PreviewPRModal.tsx

@@ -5,14 +5,15 @@ import useNotifications from '../../../contexts/Notifications';
 import { SecretPRPreview } from '../../../types/custom';
 import { renderKustomization } from '../../Applications/utils';
 import Preview from '../../Templates/Form/Partials/Preview';
+
 const { small } = theme.spacing;
 const PreviewPRSection = styled.div`
   display: flex;
   justify-content: flex-end;
   padding: ${small};
 `;
 
-export const PrviewPRModal = ({ formData, getClusterAutomations }: any) => {
+export const PreviewPRModal = ({ formData, getClusterAutomations }: any) => {
   const [openPreview, setOpenPreview] = useState(false);
   const [previewLoading, setPreviewLoading] = useState<boolean>(false);
   const [PRPreview, setPRPreview] = useState<SecretPRPreview | null>(null);
@@ -36,7 +37,6 @@ export const PrviewPRModal = ({ formData, getClusterAutomations }: any) => {
       })
       .finally(() => setPreviewLoading(false));
   }, [
-    formData,
     getClusterAutomations,
     setOpenPreview,
     setPRPreview,

ui-cra/src/components/Secrets/Create/index.tsx

@@ -6,7 +6,7 @@ import {
   Link,
   LoadingPage,
   theme,
-  useListSources
+  useListSources,
 } from '@weaveworks/weave-gitops';
 import { PageRoute } from '@weaveworks/weave-gitops/ui/lib/types';
 import { useCallback, useEffect, useMemo, useState } from 'react';
@@ -15,7 +15,7 @@ import styled from 'styled-components';
 import {
   ClusterAutomation,
   ExternalSecretStore,
-  GitopsCluster
+  GitopsCluster,
 } from '../../../cluster-services/cluster_services.pb';
 import CallbackStateContextProvider from '../../../contexts/GitAuth/CallbackStateContext';
 import useNotifications from '../../../contexts/Notifications';
@@ -26,7 +26,7 @@ import { Routes } from '../../../utils/nav';
 import { isUnauthenticated, removeToken } from '../../../utils/request';
 import {
   CreateDeploymentObjects,
-  useClustersWithSources
+  useClustersWithSources,
 } from '../../Applications/utils';
 import { getGitRepos } from '../../Clusters';
 import { clearCallbackState, getProviderToken } from '../../GitAuth/utils';
@@ -36,10 +36,10 @@ import { GitRepositoryEnriched } from '../../Templates/Form';
 import GitOps from '../../Templates/Form/Partials/GitOps';
 import {
   getInitialGitRepo,
-  getRepositoryUrl
+  getRepositoryUrl,
 } from '../../Templates/Form/utils';
 import { SelectSecretStore } from './Form/Partials/SelectSecretStore';
-import { PrviewPRModal } from './PrviewPRModal';
+import { PreviewPRModal } from './PreviewPRModal';
 
 const { medium, large } = theme.spacing;
 const { neutral20, neutral10 } = theme.colors;
@@ -135,7 +135,6 @@ const CreateSecret = () => {
 
   const [showAuthDialog, setShowAuthDialog] = useState<boolean>(false);
   const [formData, setFormData] = useState<any>(initialFormData);
-  const [submitType, setSubmitType] = useState<string>('');
   const [selectedSecretStore, setSelectedSecretStore] =
     useState<ExternalSecretStore>({});
   const [enableCreatePR, setEnableCreatePR] = useState<boolean>(false);
@@ -335,12 +334,7 @@ const CreateSecret = () => {
             <FormWrapper
               noValidate
               onSubmit={event =>
-                validateFormData(
-                  event,
-                  handleCreateSecret,
-                  setFormError,
-                  setSubmitType,
-                )
+                validateFormData(event, handleCreateSecret, setFormError)
               }
             >
               <div className="group-section">
@@ -425,7 +419,7 @@ const CreateSecret = () => {
                   }
                 />
               </div>
-              <PrviewPRModal
+              <PreviewPRModal
                 formData={formData}
                 getClusterAutomations={getClusterAutomations}
               />

ui-cra/src/utils/form.tsx

@@ -220,7 +220,7 @@ export const validateFormData = (
   event: any,
   onSubmit: any,
   setFormError: Dispatch<React.SetStateAction<any>>,
-  setSubmitType: Dispatch<React.SetStateAction<string>>,
+  setSubmitType?: Dispatch<React.SetStateAction<string>>,
 ) => {
   event.preventDefault();
   const requiredButEmptyInputs = Array.from(event.target).filter(
@@ -234,5 +234,5 @@ export const validateFormData = (
     (firstEmpty as HTMLInputElement).focus();
     setFormError((firstEmpty as HTMLInputElement).name);
   }
-  setSubmitType('');
+  setSubmitType && setSubmitType('');
 };