chore(code) avoid react imports and add return types

Signed-off-by: David Edler <[email protected]>
canonical · Apr 15, 2024 · df5111f · df5111f
1 parent 6e9fb76
commit df5111f
Show file tree

Hide file tree

Showing 17 changed files with 33 additions and 19 deletions.
diff --git a/src/pages/instances/CreateInstance.tsx b/src/pages/instances/CreateInstance.tsx
@@ -1,4 +1,4 @@
-import React, { FC, ReactNode, useEffect, useState } from "react";
+import { FC, ReactNode, useEffect, useState } from "react";
 import {
   ActionButton,
   Button,

diff --git a/src/pages/instances/EditInstance.tsx b/src/pages/instances/EditInstance.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from "react";
+import { FC, useEffect, useState } from "react";
 import {
   ActionButton,
   Button,

diff --git a/src/pages/instances/forms/InstanceFormMenu.tsx b/src/pages/instances/forms/InstanceFormMenu.tsx
@@ -1,4 +1,4 @@
-import React, { FC, ReactNode, useEffect, useState } from "react";
+import { FC, ReactNode, useEffect, useState } from "react";
 import MenuItem from "components/forms/FormMenuItem";
 import { Button, useNotify } from "@canonical/react-components";
 import { updateMaxHeight } from "util/updateMaxHeight";

diff --git a/src/pages/networks/forms/NetworkForm.tsx b/src/pages/networks/forms/NetworkForm.tsx
@@ -1,4 +1,4 @@
-import React, { FC, ReactNode, useEffect, useState } from "react";
+import { FC, ReactNode, useEffect, useState } from "react";
 import {
   Col,
   Form,

diff --git a/src/pages/profiles/CreateProfile.tsx b/src/pages/profiles/CreateProfile.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from "react";
+import { FC, useEffect, useState } from "react";
 import {
   ActionButton,
   Button,

diff --git a/src/pages/profiles/EditProfile.tsx b/src/pages/profiles/EditProfile.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from "react";
+import { FC, useEffect, useState } from "react";
 import {
   ActionButton,
   Button,

diff --git a/src/pages/profiles/forms/ProfileFormMenu.tsx b/src/pages/profiles/forms/ProfileFormMenu.tsx
@@ -1,4 +1,4 @@
-import React, { FC, ReactNode, useEffect, useState } from "react";
+import { FC, ReactNode, useEffect, useState } from "react";
 import MenuItem from "components/forms/FormMenuItem";
 import { Button, useNotify } from "@canonical/react-components";
 import { updateMaxHeight } from "util/updateMaxHeight";

diff --git a/src/pages/projects/forms/ClusterRestrictionForm.tsx b/src/pages/projects/forms/ClusterRestrictionForm.tsx
@@ -7,13 +7,16 @@ import { FormikProps } from "formik/dist/types";
 import { optionAllowBlock } from "util/projectOptions";
 import { optionRenderer } from "util/formFields";
 import { getProjectKey } from "util/projectConfigFields";
+import { LxdConfigPair } from "types/config";
 
 export interface ClusterRestrictionFormValues {
   restricted_cluster_groups?: string;
   restricted_cluster_target?: string;
 }
 
-export const clusterRestrictionPayload = (values: ProjectFormValues) => {
+export const clusterRestrictionPayload = (
+  values: ProjectFormValues,
+): LxdConfigPair => {
   return {
     [getProjectKey("restricted_cluster_groups")]:
       values.restricted_cluster_groups,

diff --git a/src/pages/projects/forms/DeviceUsageRestrictionForm.tsx b/src/pages/projects/forms/DeviceUsageRestrictionForm.tsx
@@ -7,6 +7,7 @@ import { FormikProps } from "formik/dist/types";
 import { optionAllowBlock, optionAllowBlockManaged } from "util/projectOptions";
 import { optionRenderer } from "util/formFields";
 import { getProjectKey } from "util/projectConfigFields";
+import { LxdConfigPair } from "types/config";
 
 export interface DeviceUsageRestrictionFormValues {
   restricted_devices_disk?: string;
@@ -23,7 +24,7 @@ export interface DeviceUsageRestrictionFormValues {
 
 export const deviceUsageRestrictionPayload = (
   values: DeviceUsageRestrictionFormValues,
-) => {
+): LxdConfigPair => {
   return {
     [getProjectKey("restricted_devices_disk")]: values.restricted_devices_disk,
     [getProjectKey("restricted_devices_disk_paths")]:

diff --git a/src/pages/projects/forms/InstanceRestrictionForm.tsx b/src/pages/projects/forms/InstanceRestrictionForm.tsx
@@ -10,6 +10,7 @@ import {
 } from "util/projectOptions";
 import { optionRenderer } from "util/formFields";
 import { getProjectKey } from "util/projectConfigFields";
+import { LxdConfigPair } from "types/config";
 
 export interface InstanceRestrictionFormValues {
   restricted_virtual_machines_low_level?: string;
@@ -22,7 +23,9 @@ export interface InstanceRestrictionFormValues {
   restricted_idmap_gid?: string;
 }
 
-export const instanceRestrictionPayload = (values: ProjectFormValues) => {
+export const instanceRestrictionPayload = (
+  values: ProjectFormValues,
+): LxdConfigPair => {
   return {
     [getProjectKey("restricted_virtual_machines_low_level")]:
       values.restricted_virtual_machines_low_level,

diff --git a/src/pages/projects/forms/NetworkRestrictionForm.tsx b/src/pages/projects/forms/NetworkRestrictionForm.tsx
@@ -5,6 +5,7 @@ import ScrollableConfigurationTable from "components/forms/ScrollableConfigurati
 import { ProjectFormValues } from "pages/projects/CreateProject";
 import { FormikProps } from "formik/dist/types";
 import { getProjectKey } from "util/projectConfigFields";
+import { LxdConfigPair } from "types/config";
 
 export interface NetworkRestrictionFormValues {
   restricted_network_access?: string;
@@ -15,7 +16,7 @@ export interface NetworkRestrictionFormValues {
 
 export const networkRestrictionPayload = (
   values: NetworkRestrictionFormValues,
-) => {
+): LxdConfigPair => {
   return {
     [getProjectKey("restricted_network_access")]:
       values.restricted_network_access,

diff --git a/src/pages/projects/forms/ProjectDetailsForm.tsx b/src/pages/projects/forms/ProjectDetailsForm.tsx
@@ -15,6 +15,7 @@ import { LxdProject } from "types/project";
 import AutoExpandingTextArea from "components/AutoExpandingTextArea";
 import ScrollableForm from "components/ScrollableForm";
 import { useSupportedFeatures } from "context/useSupportedFeatures";
+import { LxdConfigPair } from "types/config";
 
 export interface ProjectDetailsFormValues {
   name: string;
@@ -30,7 +31,9 @@ export interface ProjectDetailsFormValues {
   entityType: "project";
 }
 
-export const projectDetailPayload = (values: ProjectDetailsFormValues) => {
+export const projectDetailPayload = (
+  values: ProjectDetailsFormValues,
+): Partial<LxdProject> => {
   return {
     name: values.name,
     description: values.description,
@@ -39,7 +42,7 @@ export const projectDetailPayload = (values: ProjectDetailsFormValues) => {
 
 export const projectDetailRestrictionPayload = (
   values: ProjectDetailsFormValues,
-) => {
+): LxdConfigPair => {
   const boolToPayload = (value?: boolean) => {
     if (value === undefined) {
       return undefined;

diff --git a/src/pages/projects/forms/ProjectResourceLimitsForm.tsx b/src/pages/projects/forms/ProjectResourceLimitsForm.tsx
@@ -6,6 +6,7 @@ import { ProjectFormValues } from "pages/projects/CreateProject";
 import { FormikProps } from "formik/dist/types";
 import DiskSizeSelector from "components/forms/DiskSizeSelector";
 import { getProjectKey } from "util/projectConfigFields";
+import { LxdConfigPair } from "types/config";
 
 export interface ProjectResourceLimitsFormValues {
   limits_instances?: number;
@@ -18,7 +19,9 @@ export interface ProjectResourceLimitsFormValues {
   limits_processes?: number;
 }
 
-export const resourceLimitsPayload = (values: ProjectFormValues) => {
+export const resourceLimitsPayload = (
+  values: ProjectFormValues,
+): LxdConfigPair => {
   return {
     [getProjectKey("limits_instances")]: values.limits_instances?.toString(),
     [getProjectKey("limits_containers")]: values.limits_containers?.toString(),

diff --git a/src/pages/storage/forms/StoragePoolForm.tsx b/src/pages/storage/forms/StoragePoolForm.tsx
@@ -1,4 +1,4 @@
-import React, { FC, ReactNode, useEffect, useState } from "react";
+import { FC, ReactNode, useEffect, useState } from "react";
 import {
   Form,
   Input,

diff --git a/src/types/config.d.ts b/src/types/config.d.ts
@@ -1,4 +1,4 @@
-export type LxdConfigPair = Record<string, string>;
+export type LxdConfigPair = Record<string, string | undefined>;
 
 export type ConfigField = LxdConfigOption & {
   category: string;

diff --git a/src/util/projectConfigFields.tsx b/src/util/projectConfigFields.tsx
@@ -40,7 +40,7 @@ const projectConfigFormFieldsToPayload: Record<string, string> = {
   limits_processes: "limits.processes",
 };
 
-export const getProjectKey = (formField: string) => {
+export const getProjectKey = (formField: string): string => {
   if (!(formField in projectConfigFormFieldsToPayload)) {
     throw new Error(
       `Could not find ${formField} in projectConfigFormFieldsToPayload`,
@@ -49,6 +49,6 @@ export const getProjectKey = (formField: string) => {
   return projectConfigFormFieldsToPayload[formField];
 };
 
-export const getProjectConfigKeys = () => {
+export const getProjectConfigKeys = (): Set<string> => {
   return new Set(Object.values(projectConfigFormFieldsToPayload));
 };
diff --git a/src/util/projectEdit.tsx b/src/util/projectEdit.tsx
@@ -98,7 +98,7 @@ export const getProjectEditValues = (
 export const getProjectPayload = (
   project: LxdProject,
   values: ProjectFormValues,
-) => {
+): Partial<LxdProject> => {
   const handledConfigKeys = getProjectConfigKeys();
   const handledKeys = new Set(["name", "description", "config"]);