isLoading -> isPending i mutations (#3627)

Author: vebnor

src/client/app/avdelingsleder/behandlingskoerV3/SlettKøModal.tsx

@@ -9,15 +9,15 @@ interface OwnProps {
 }
 
 const SlettKøModal = ({ lukk, id, køTittel }: OwnProps) => {
-	const { mutate, isLoading, isError } = useSlettKøMutation(lukk);
+	const { mutate, isPending, isError } = useSlettKøMutation(lukk);
 	return (
 		<Modal open onClose={lukk} portal>
 			<Modal.Body>
 				<Heading size="medium">Slett kø</Heading>
 				<BodyShort>{`Er du sikker på at du vil slette ${køTittel}?`}</BodyShort>
 				{isError && <ErrorMessage>Noe gikk galt ved oppretting av kø.</ErrorMessage>}
 				<div className="mt-8 flex gap-4">
-					<Button loading={isLoading} onClick={() => mutate(id)}>
+					<Button loading={isPending} onClick={() => mutate(id)}>
 						Slett
 					</Button>
 					<Button variant="secondary" type="button" onClick={lukk}>

src/client/app/avdelingsleder/behandlingskoerV3/components/AksjonspunktVelger.tsx

@@ -6,7 +6,7 @@ import SearchDropdownMedPredefinerteVerdier, {
 import kodeverkTyper from 'kodeverk/kodeverkTyper';
 
 const AksjonspunktVelger: FunctionComponent<
-	SearchDropdownPredefinerteVerdierProps & { skjulValgteVerdierUnderDropdown: boolean }
+	SearchDropdownPredefinerteVerdierProps & { skjulValgteVerdierUnderDropdown?: boolean }
 > = ({ onChange, feltdefinisjon, oppgavefilter, error, skjulValgteVerdierUnderDropdown }) => {
 	const oppgavekoder = useKodeverk(kodeverkTyper.OPPGAVE_KODE);
 	const formaterteOppgavekoder = oppgavekoder

src/client/app/avdelingsleder/bemanning/components/LeggTilSaksbehandlerForm.tsx

@@ -15,7 +15,7 @@ export const LeggTilSaksbehandlerForm: FunctionComponent = () => {
 		isLoading: isLoadingSaksbehandlere,
 		isSuccess: isSuccessSaksbehandlere,
 	} = useHentSaksbehandlereAvdelingsleder();
-	const { mutate: leggTilSaksbehandler, isLoading: isLoadingLeggTil } = useLeggTilSaksbehandler();
+	const { mutate: leggTilSaksbehandler, isPending: isLoadingLeggTil } = useLeggTilSaksbehandler();
 
 	// eslint-disable-next-line @typescript-eslint/no-explicit-any
 	const addSaksbehandler = (epost: string, form: FormApi<any, Partial<any>>, meta: FieldMetaState<any>) => {

src/client/app/avdelingsleder/bemanning/components/SaksbehandlerInfo.tsx

@@ -47,7 +47,7 @@ const SaksbehandlerInfo: FunctionComponent<OwnProps> = ({ saksbehandler }) => {
 		isLoading: isLoadingKøerV3,
 		isSuccess: isSuccessKøerV3,
 	} = useHentAndreSaksbehandleresKøer(saksbehandler.id);
-	const { mutate, isLoading: isLoadingSlett } = useSlettSaksbehandler();
+	const { mutate, isPending: isLoadingSlett } = useSlettSaksbehandler();
 	const slettSaksbehandler = () => mutate({ epost: saksbehandler.epost }, { onSuccess: lukkSlettModal });
 
 	return (

src/client/app/filter/AntallOppgaver.tsx

@@ -14,7 +14,7 @@ export const AntallOppgaver = ({ setQueryError }: OwnProps) => {
 	const { oppgaveQuery } = useContext(FilterContext);
 
 	const [antallOppgaver, setAntallOppgaver] = useState('');
-	const { mutate, isLoading } = useMutation<string, unknown, { url: string; body: OppgaveQuery }>({
+	const { mutate, isPending } = useMutation<string, unknown, { url: string; body: OppgaveQuery }>({
 		onSuccess: (respons) => {
 			if (respons !== undefined) {
 				setAntallOppgaver(respons);
@@ -32,15 +32,15 @@ export const AntallOppgaver = ({ setQueryError }: OwnProps) => {
 	return (
 		<div className="flex flex-col m-auto">
 			<Label size="small">
-				Antall oppgaver: {isLoading ? <Skeleton className="inline-block w-12" /> : antallOppgaver}
+				Antall oppgaver: {isPending ? <Skeleton className="inline-block w-12" /> : antallOppgaver}
 			</Label>
 			<Button
 				variant="tertiary"
 				icon={<ArrowsCirclepathIcon aria-hidden />}
 				size="small"
 				onClick={hentOppgaver}
-				loading={isLoading}
-				disabled={isLoading}
+				loading={isPending}
+				disabled={isPending}
 			>
 				Oppdater antall
 			</Button>

src/client/app/filter/parts/SearchDropdownMedPredefinerteVerdier.tsx

@@ -7,7 +7,7 @@ export interface SearchDropdownPredefinerteVerdierProps extends Partial<SearchWi
 	onChange: (values: string[]) => void;
 	oppgavefilter: FeltverdiOppgavefilter;
 	error?: string;
-	skjulValgteVerdierUnderDropdown: boolean;
+	skjulValgteVerdierUnderDropdown?: boolean;
 }
 
 const SearchDropdownMedPredefinerteVerdier = ({

src/client/app/form/finalFields/CheckboxField.tsx

@@ -48,9 +48,5 @@ const CheckboxField: FunctionComponent<OwnProps> = ({ name, label, validate, rea
 	/>
 );
 
-CheckboxField.defaultProps = {
-	validate: null,
-	readOnly: false,
-};
 
 export default CheckboxField;

src/client/app/form/finalFields/DatepickerField.tsx

@@ -76,12 +76,4 @@ const DatepickerField: FunctionComponent<OwnProps> = ({
 	/>
 );
 
-DatepickerField.defaultProps = {
-	label: '',
-	readOnly: false,
-	isEdited: false,
-	format: (value) => value,
-	parse: (value) => value,
-};
-
 export default DatepickerField;

src/client/app/form/finalFields/RadioOption.tsx

@@ -54,15 +54,6 @@ export const RadioOption: FunctionComponent<OwnProps> = ({
 	);
 };
 
-RadioOption.defaultProps = {
-	name: '',
-	className: '',
-	disabled: false,
-	groupDisabled: false,
-	onChange: () => undefined,
-	manualHideChildren: false,
-};
-
 RadioOption.displayName = 'RadioOption';
 
 export default RadioOption;

src/client/app/form/finalFields/ReadOnlyField.tsx

@@ -32,9 +32,5 @@ export const ReadOnlyField: FunctionComponent<OwnProps> = ({ label, input, isEdi
 	);
 };
 
-ReadOnlyField.defaultProps = {
-	label: undefined,
-	isEdited: false,
-};
 
 export default ReadOnlyField;

src/client/app/form/finalFields/TextAreaField.tsx

@@ -44,9 +44,6 @@ const TextAreaWithBadge: FunctionComponent<TextAreaWithBadgeProps & WrappedCompo
 	</div>
 );
 
-TextAreaWithBadge.defaultProps = {
-	badges: null,
-};
 
 const renderNavTextArea = renderNavField(injectIntl(TextAreaWithBadge));
 

src/client/app/saksbehandler/fagsakSearch/components/FagsakSearch.tsx

@@ -32,7 +32,7 @@ const skalViseListe = (resultat) => {
 const FagsakSearch: FunctionComponent<OwnProps> = ({ setOppgave, goToFagsak }) => {
 	const queryFraURL = queryString.parse(window.location?.search ? window.location.search : '');
 	const erSokViaQueryParams = queryFraURL.sok && !hasValidSaksnummerEllerJournalpostFormat(queryFraURL.sok);
-	const { data: resultat, mutate: sok, isSuccess, isLoading } = useSøk();
+	const { data: resultat, mutate: sok, isSuccess, isPending } = useSøk();
 	useEffect(() => {
 		if (erSokViaQueryParams) {
 			const paramToString = queryFraURL.sok.toString();
@@ -42,7 +42,7 @@ const FagsakSearch: FunctionComponent<OwnProps> = ({ setOppgave, goToFagsak }) =
 
 	return (
 		<div>
-			<SearchForm onSubmit={sok} searchStarted={isLoading} />
+			<SearchForm onSubmit={sok} searchStarted={isPending} />
 			{isSuccess && resultat && resultat.oppgaver.length === 0 && !resultat.ikkeTilgang && (
 				<BodyShort className={styles.label}>
 					<FormattedMessage id="FagsakSearch.ZeroSearchResults" />

src/client/app/saksbehandler/sokeboks/Søkeboks.tsx

@@ -5,11 +5,11 @@ import { SøkResultat } from 'saksbehandler/sokeboks/SøkResultat';
 import VerticalSpacer from 'sharedComponents/VerticalSpacer';
 
 export function Søkeboks() {
-	const { isLoading, mutate: utførSøk, data, reset: nullstillSøk } = useSøkOppgaveV3();
+	const { isPending, mutate: utførSøk, data, reset: nullstillSøk } = useSøkOppgaveV3();
 
 	return (
 		<>
-			<SøkForm utførSøk={utførSøk} loading={isLoading} nullstillSøk={nullstillSøk} />
+			<SøkForm utførSøk={utførSøk} loading={isPending} nullstillSøk={nullstillSøk} />
 			<VerticalSpacer sixteenPx />
 			<SøkResultat oppgaver={data} />
 		</>