diff --git a/frontend/components/AuthAnyMaintainerGlobalAdminRoutes/AuthAnyMaintainerGlobalAdminRoutes.tsx b/frontend/components/AuthAnyMaintainerGlobalAdminRoutes/AuthAnyMaintainerGlobalAdminRoutes.tsx
index bbfeff0ef..6ed3059c7 100644
--- a/frontend/components/AuthAnyMaintainerGlobalAdminRoutes/AuthAnyMaintainerGlobalAdminRoutes.tsx
+++ b/frontend/components/AuthAnyMaintainerGlobalAdminRoutes/AuthAnyMaintainerGlobalAdminRoutes.tsx
@@ -23,11 +23,9 @@ const { HOME } = paths;
 /**
  * Checks if a user is a global admin or global maintainer when routing
  */
-const AuthAnyMaintainerGlobalAdminRoutes = (
-  props: IAuthAnyMaintainerGlobalAdminRoutesProps
-): JSX.Element | null => {
-  const { children } = props;
-
+const AuthAnyMaintainerGlobalAdminRoutes = ({
+  children,
+}: IAuthAnyMaintainerGlobalAdminRoutesProps): JSX.Element | null => {
   const dispatch = useDispatch();
   const user = useSelector((state: IRootState) => state.auth.user);
 
diff --git a/frontend/components/AuthGlobalAdminMaintainerRoutes/AuthGlobalAdminMaintainerRoutes.tsx b/frontend/components/AuthGlobalAdminMaintainerRoutes/AuthGlobalAdminMaintainerRoutes.tsx
index e7b2451a2..573c5aedf 100644
--- a/frontend/components/AuthGlobalAdminMaintainerRoutes/AuthGlobalAdminMaintainerRoutes.tsx
+++ b/frontend/components/AuthGlobalAdminMaintainerRoutes/AuthGlobalAdminMaintainerRoutes.tsx
@@ -23,11 +23,9 @@ const { HOME } = paths;
 /**
  * Checks if a user is a global admin or global maintainer when routing
  */
-const AuthGlobalAdminMaintainerRoutes = (
-  props: IAuthGlobalAdminMaintainerRoutesProps
-) => {
-  const { children } = props;
-
+const AuthGlobalAdminMaintainerRoutes = ({
+  children,
+}: IAuthGlobalAdminMaintainerRoutesProps) => {
   const dispatch = useDispatch();
   const user = useSelector((state: IRootState) => state.auth.user);
 
diff --git a/frontend/components/IconToolTip/IconToolTip.tsx b/frontend/components/IconToolTip/IconToolTip.tsx
index 4cf3ce847..9c568e1b5 100644
--- a/frontend/components/IconToolTip/IconToolTip.tsx
+++ b/frontend/components/IconToolTip/IconToolTip.tsx
@@ -8,8 +8,11 @@ interface IIconToolTipProps {
 }
 
 // TODO: handle html text better. possibly use 'children' prop for html
-const IconToolTip = (props: IIconToolTipProps): JSX.Element => {
-  const { text, isHtml, issue } = props;
+const IconToolTip = ({
+  text,
+  isHtml,
+  issue,
+}: IIconToolTipProps): JSX.Element => {
   let svgIcon = (
     <svg
       width="16"
diff --git a/frontend/components/InfoBanner/InfoBanner.tsx b/frontend/components/InfoBanner/InfoBanner.tsx
index 663960e91..98de0a566 100644
--- a/frontend/components/InfoBanner/InfoBanner.tsx
+++ b/frontend/components/InfoBanner/InfoBanner.tsx
@@ -8,8 +8,7 @@ interface IInfoBannerProps {
   className?: string;
 }
 
-const InfoBanner = (props: IInfoBannerProps): JSX.Element => {
-  const { children, className } = props;
+const InfoBanner = ({ children, className }: IInfoBannerProps): JSX.Element => {
   const wrapperClasses = classNames(baseClass, className);
 
   return <div className={wrapperClasses}>{children}</div>;
diff --git a/frontend/components/PremiumTierRoutes/PremiumTierRoutes.tsx b/frontend/components/PremiumTierRoutes/PremiumTierRoutes.tsx
index 8e5f9ea82..7b721ddcc 100644
--- a/frontend/components/PremiumTierRoutes/PremiumTierRoutes.tsx
+++ b/frontend/components/PremiumTierRoutes/PremiumTierRoutes.tsx
@@ -18,9 +18,9 @@ interface IRootState {
 
 const { FLEET_403 } = paths;
 
-const PremiumTierRoutes = (props: IPremiumTierRoutes): JSX.Element | null => {
-  const { children } = props;
-
+const PremiumTierRoutes = ({
+  children,
+}: IPremiumTierRoutes): JSX.Element | null => {
   const dispatch = useDispatch();
   const config = useSelector((state: IRootState) => state.app.config);
 
diff --git a/frontend/components/TableContainer/DataTable/DropdownCell/DropdownCell.tsx b/frontend/components/TableContainer/DataTable/DropdownCell/DropdownCell.tsx
index e0212e05e..0bc96ad18 100644
--- a/frontend/components/TableContainer/DataTable/DropdownCell/DropdownCell.tsx
+++ b/frontend/components/TableContainer/DataTable/DropdownCell/DropdownCell.tsx
@@ -14,8 +14,11 @@ interface IDropdownCellProps {
   onChange: (value: any) => void;
 }
 
-const DropdownCell = (props: IDropdownCellProps): JSX.Element => {
-  const { options, onChange, placeholder } = props;
+const DropdownCell = ({
+  options,
+  onChange,
+  placeholder,
+}: IDropdownCellProps): JSX.Element => {
   return (
     <div className={baseClass}>
       <Dropdown
diff --git a/frontend/components/TableContainer/DataTable/HeaderCell/HeaderCell.tsx b/frontend/components/TableContainer/DataTable/HeaderCell/HeaderCell.tsx
index ed5509d0a..82d29e4ea 100644
--- a/frontend/components/TableContainer/DataTable/HeaderCell/HeaderCell.tsx
+++ b/frontend/components/TableContainer/DataTable/HeaderCell/HeaderCell.tsx
@@ -5,9 +5,7 @@ interface IHeaderCellProps {
   isSortedDesc?: boolean;
 }
 
-const HeaderCell = (props: IHeaderCellProps): JSX.Element => {
-  const { value, isSortedDesc } = props;
-
+const HeaderCell = ({ value, isSortedDesc }: IHeaderCellProps): JSX.Element => {
   let sortArrowClass = "";
   if (isSortedDesc === undefined) {
     sortArrowClass = "";
diff --git a/frontend/components/TableContainer/DataTable/IconCell/IconCell.tsx b/frontend/components/TableContainer/DataTable/IconCell/IconCell.tsx
index f3f08ce2b..be84de0e3 100644
--- a/frontend/components/TableContainer/DataTable/IconCell/IconCell.tsx
+++ b/frontend/components/TableContainer/DataTable/IconCell/IconCell.tsx
@@ -7,11 +7,9 @@ interface IIconTooltipCellProps<T> {
   value: string;
 }
 
-const IconTooltipCell = (
-  props: IIconTooltipCellProps<any>
-): JSX.Element | null => {
-  const { value } = props;
-
+const IconTooltipCell = ({
+  value,
+}: IIconTooltipCellProps<any>): JSX.Element | null => {
   // The value passed in must be a valid FleetIcon name
   return <FleetIcon name={value} />;
 };
diff --git a/frontend/components/TableContainer/DataTable/IconTooltipCell/IconTooltipCell.tsx b/frontend/components/TableContainer/DataTable/IconTooltipCell/IconTooltipCell.tsx
index 2f5016406..a6c936e9b 100644
--- a/frontend/components/TableContainer/DataTable/IconTooltipCell/IconTooltipCell.tsx
+++ b/frontend/components/TableContainer/DataTable/IconTooltipCell/IconTooltipCell.tsx
@@ -7,11 +7,9 @@ interface IIconTooltipCellProps<T> {
   value: string;
 }
 
-const IconTooltipCell = (
-  props: IIconTooltipCellProps<any>
-): JSX.Element | null => {
-  const { value } = props;
-
+const IconTooltipCell = ({
+  value,
+}: IIconTooltipCellProps<any>): JSX.Element | null => {
   if (isEmpty(value)) {
     return null;
   }
diff --git a/frontend/components/TableContainer/DataTable/LinkCell/LinkCell.tsx b/frontend/components/TableContainer/DataTable/LinkCell/LinkCell.tsx
index 9442cc7e5..1eac7e24f 100644
--- a/frontend/components/TableContainer/DataTable/LinkCell/LinkCell.tsx
+++ b/frontend/components/TableContainer/DataTable/LinkCell/LinkCell.tsx
@@ -10,9 +10,7 @@ interface ILinkCellProps<T> {
   title?: string;
 }
 
-const LinkCell = (props: ILinkCellProps<any>): JSX.Element => {
-  const { value, path, title } = props;
-
+const LinkCell = ({ value, path, title }: ILinkCellProps<any>): JSX.Element => {
   const dispatch = useDispatch();
 
   const onClick = (): void => {
diff --git a/frontend/components/TableContainer/DataTable/PillCell/PillCell.tsx b/frontend/components/TableContainer/DataTable/PillCell/PillCell.tsx
index fd7f19198..9644d51a4 100644
--- a/frontend/components/TableContainer/DataTable/PillCell/PillCell.tsx
+++ b/frontend/components/TableContainer/DataTable/PillCell/PillCell.tsx
@@ -12,8 +12,7 @@ const generateClassTag = (rawValue: string): string => {
   return rawValue.replace(" ", "-").toLowerCase();
 };
 
-const PillCell = (props: IPillCellProps): JSX.Element => {
-  const { value, customIdPrefix } = props;
+const PillCell = ({ value, customIdPrefix }: IPillCellProps): JSX.Element => {
   const [pillText, id] = value;
 
   const pillClassName = classnames(
diff --git a/frontend/components/TableContainer/DataTable/StatusCell/StatusCell.tsx b/frontend/components/TableContainer/DataTable/StatusCell/StatusCell.tsx
index e9bb370dd..079e0ba19 100644
--- a/frontend/components/TableContainer/DataTable/StatusCell/StatusCell.tsx
+++ b/frontend/components/TableContainer/DataTable/StatusCell/StatusCell.tsx
@@ -9,9 +9,7 @@ const generateClassTag = (rawValue: string): string => {
   return rawValue.replace(" ", "-").toLowerCase();
 };
 
-const StatusCell = (props: IStatusCellProps): JSX.Element => {
-  const { value } = props;
-
+const StatusCell = ({ value }: IStatusCellProps): JSX.Element => {
   const statusClassName = classnames(
     "data-table__status",
     `data-table__status--${generateClassTag(value)}`
diff --git a/frontend/components/TableContainer/DataTable/TextCell/TextCell.tsx b/frontend/components/TableContainer/DataTable/TextCell/TextCell.tsx
index 5a0205e28..a4a930d90 100644
--- a/frontend/components/TableContainer/DataTable/TextCell/TextCell.tsx
+++ b/frontend/components/TableContainer/DataTable/TextCell/TextCell.tsx
@@ -6,13 +6,11 @@ interface ITextCellProps {
   greyed?: string;
 }
 
-const TextCell = (props: ITextCellProps): JSX.Element => {
-  const {
-    value,
-    formatter = (val) => val, // identity function if no formatter is provided
-    greyed,
-  } = props;
-
+const TextCell = ({
+  value,
+  formatter = (val) => val, // identity function if no formatter is provided
+  greyed,
+}: ITextCellProps): JSX.Element => {
   let val = value;
 
   if (typeof value === "boolean") {
diff --git a/frontend/components/forms/fields/Radio/Radio.tsx b/frontend/components/forms/fields/Radio/Radio.tsx
index 341071840..7353676b4 100644
--- a/frontend/components/forms/fields/Radio/Radio.tsx
+++ b/frontend/components/forms/fields/Radio/Radio.tsx
@@ -14,17 +14,16 @@ interface IRadioProps {
   disabled?: boolean;
 }
 
-const Radio = (props: IRadioProps): JSX.Element => {
-  const {
-    className,
-    id,
-    name,
-    value,
-    checked,
-    disabled,
-    label,
-    onChange,
-  } = props;
+const Radio = ({
+  className,
+  id,
+  name,
+  value,
+  checked,
+  disabled,
+  label,
+  onChange,
+}: IRadioProps): JSX.Element => {
   const wrapperClasses = classnames(baseClass, className);
 
   const radioControlClass = classnames({
diff --git a/frontend/components/forms/fields/Slider/Slider.jsx b/frontend/components/forms/fields/Slider/Slider.jsx
index b2036aeee..9b31e68a4 100644
--- a/frontend/components/forms/fields/Slider/Slider.jsx
+++ b/frontend/components/forms/fields/Slider/Slider.jsx
@@ -7,7 +7,7 @@ import FormField from "components/forms/FormField";
 
 const Slider = (props) => {
   const { onChange, value, inactiveText = "Off", activeText = "On" } = props;
-  const baseClass = "kolide-slider";
+  const baseClass = "fleet-slider";
 
   const sliderBtnClass = classnames(baseClass, {
     [`${baseClass}--active`]: value,
diff --git a/frontend/components/forms/fields/Slider/_styles.scss b/frontend/components/forms/fields/Slider/_styles.scss
index d6e315982..8e4118585 100644
--- a/frontend/components/forms/fields/Slider/_styles.scss
+++ b/frontend/components/forms/fields/Slider/_styles.scss
@@ -1,4 +1,4 @@
-.kolide-slider {
+.fleet-slider {
   transition: background-color 150ms ease-in-out;
   background-color: $core-fleet-black;
   border-radius: 12px;
diff --git a/frontend/components/policies/PoliciesPageWrapper/PoliciesPageWrapper.tsx b/frontend/components/policies/PoliciesPageWrapper/PoliciesPageWrapper.tsx
index 331d24faf..5b312fe30 100644
--- a/frontend/components/policies/PoliciesPageWrapper/PoliciesPageWrapper.tsx
+++ b/frontend/components/policies/PoliciesPageWrapper/PoliciesPageWrapper.tsx
@@ -1,10 +1,10 @@
 import React from "react";
 
-const PoliciesPageWrapper = (props: {
+const PoliciesPageWrapper = ({
+  children,
+}: {
   children: React.ReactNode;
 }): React.ReactNode | null => {
-  const { children } = props;
-
   return children || null;
 };
 
diff --git a/frontend/components/side_panels/HostSidePanel/HostSidePanel.tsx b/frontend/components/side_panels/HostSidePanel/HostSidePanel.tsx
index 2892b6f68..69bdb4e6a 100644
--- a/frontend/components/side_panels/HostSidePanel/HostSidePanel.tsx
+++ b/frontend/components/side_panels/HostSidePanel/HostSidePanel.tsx
@@ -25,15 +25,13 @@ interface IHostSidePanelProps {
   canAddNewLabel: boolean;
 }
 
-const HostSidePanel = (props: IHostSidePanelProps): JSX.Element => {
-  const {
-    labels,
-    onAddLabelClick,
-    onLabelClick,
-    selectedFilter,
-    canAddNewLabel,
-  } = props;
-
+const HostSidePanel = ({
+  labels,
+  onAddLabelClick,
+  onLabelClick,
+  selectedFilter,
+  canAddNewLabel,
+}: IHostSidePanelProps): JSX.Element => {
   const [labelFilter, setLabelFilter] = useState<string>("");
 
   const onFilterLabels = useCallback(
diff --git a/frontend/components/side_panels/HostSidePanel/PanelGroupItem/PanelGroupItem.tsx b/frontend/components/side_panels/HostSidePanel/PanelGroupItem/PanelGroupItem.tsx
index 4e257a6d7..117339e42 100644
--- a/frontend/components/side_panels/HostSidePanel/PanelGroupItem/PanelGroupItem.tsx
+++ b/frontend/components/side_panels/HostSidePanel/PanelGroupItem/PanelGroupItem.tsx
@@ -38,8 +38,11 @@ interface IPanelGroupItemProps {
   isSelected: boolean;
 }
 
-const PanelGroupItem = (props: IPanelGroupItemProps): JSX.Element => {
-  const { item, onLabelClick, isSelected } = props;
+const PanelGroupItem = ({
+  item,
+  onLabelClick,
+  isSelected,
+}: IPanelGroupItemProps): JSX.Element => {
   const {
     count,
     display_text: displayText,
diff --git a/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx b/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx
index 61a3b535f..2bd215bf3 100644
--- a/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx
+++ b/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx
@@ -45,12 +45,10 @@ const getTabIndex = (path: string): number => {
 
 const baseClass = "settings-wrapper";
 
-const SettingsWrapper = (props: ISettingsWrapperProp): JSX.Element => {
-  const {
-    children,
-    location: { pathname },
-  } = props;
-
+const SettingsWrapper = ({
+  children,
+  location: { pathname },
+}: ISettingsWrapperProp): JSX.Element => {
   // Add Teams tab for premium tier only
   const config = useSelector((state: IRootState) => state.app.config);
 
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx
index fc07e3e29..6764e3278 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx
@@ -32,10 +32,9 @@ interface IRootState {
   };
 }
 
-const AgentOptionsPage = (props: IAgentOptionsPageProps): JSX.Element => {
-  const {
-    params: { team_id },
-  } = props;
+const AgentOptionsPage = ({
+  params: { team_id },
+}: IAgentOptionsPageProps): JSX.Element => {
   const teamId = parseInt(team_id, 10);
   const dispatch = useDispatch();
   const team = useSelector((state: IRootState) => {
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/MembersPage.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/MembersPage.tsx
index f2fb3b30e..6483aadd8 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/MembersPage.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/MembersPage.tsx
@@ -72,10 +72,9 @@ const memoizedGetTeams = memoize(getTeams);
 // with the same table query params after we have made an edit to a user.
 let tableQueryData = {};
 
-const MembersPage = (props: IMembersPageProps): JSX.Element => {
-  const {
-    params: { team_id },
-  } = props;
+const MembersPage = ({
+  params: { team_id },
+}: IMembersPageProps): JSX.Element => {
   const teamId = parseInt(team_id, 10);
   const dispatch = useDispatch();
 
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AddMemberModal/AddMemberModal.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AddMemberModal/AddMemberModal.tsx
index b498118dd..c0e587a3b 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AddMemberModal/AddMemberModal.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AddMemberModal/AddMemberModal.tsx
@@ -16,9 +16,12 @@ interface IAddMemberModal {
   onSubmit: (userIds: INewMembersBody) => void;
 }
 
-const AddMemberModal = (props: IAddMemberModal): JSX.Element => {
-  const { disabledMembers, onCancel, onSubmit, team } = props;
-
+const AddMemberModal = ({
+  disabledMembers,
+  onCancel,
+  onSubmit,
+  team,
+}: IAddMemberModal): JSX.Element => {
   const [selectedMembers, setSelectedMembers] = useState([]);
 
   const onChangeDropdown = useCallback(
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AutocompleteDropdown/AutocompleteDropdown.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AutocompleteDropdown/AutocompleteDropdown.tsx
index 6e5c6716a..c6fa60465 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AutocompleteDropdown/AutocompleteDropdown.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/AutocompleteDropdown/AutocompleteDropdown.tsx
@@ -56,21 +56,17 @@ const generateOptionLabel = (user: IUser, team: ITeam): string => {
   return user.name;
 };
 
-const AutocompleteDropdown = (
-  props: IAutocompleteDropdownProps
-): JSX.Element => {
-  const {
-    className,
-    disabled,
-    disabledOptions,
-    placeholder,
-    onChange,
-    id,
-    resourceUrl,
-    value,
-    team,
-  } = props;
-
+const AutocompleteDropdown = ({
+  className,
+  disabled,
+  disabledOptions,
+  placeholder,
+  onChange,
+  id,
+  resourceUrl,
+  value,
+  team,
+}: IAutocompleteDropdownProps): JSX.Element => {
   const wrapperClass = classnames(baseClass, className);
 
   // We disable any filtering client side as the server filters the results
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/RemoveMemberModal/RemoveMemberModal.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/RemoveMemberModal/RemoveMemberModal.tsx
index 0d50d3431..43ba49dde 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/RemoveMemberModal/RemoveMemberModal.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/MembersPagePage/components/RemoveMemberModal/RemoveMemberModal.tsx
@@ -12,9 +12,12 @@ interface IDeleteTeamModalProps {
   onCancel: () => void;
 }
 
-const RemoveMemberModal = (props: IDeleteTeamModalProps): JSX.Element => {
-  const { memberName, teamName, onSubmit, onCancel } = props;
-
+const RemoveMemberModal = ({
+  memberName,
+  teamName,
+  onSubmit,
+  onCancel,
+}: IDeleteTeamModalProps): JSX.Element => {
   return (
     <Modal title={"Delete team"} onExit={onCancel} className={baseClass}>
       <form className={`${baseClass}__form`}>
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx
index 2ed487802..8294c69d9 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx
@@ -77,13 +77,11 @@ const getTabIndex = (path: string, teamId: number): number => {
   });
 };
 
-const TeamDetailsWrapper = (props: ITeamDetailsPageProps): JSX.Element => {
-  const {
-    children,
-    location: { pathname },
-    params: { team_id },
-  } = props;
-
+const TeamDetailsWrapper = ({
+  children,
+  location: { pathname },
+  params: { team_id },
+}: ITeamDetailsPageProps): JSX.Element => {
   const isLoadingTeams = useSelector(
     (state: IRootState) => state.entities.teams.loading
   );
diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/components/AddHostsModal/AddHostsRedirectModal.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/components/AddHostsModal/AddHostsRedirectModal.tsx
index 0653d69d9..86b40d758 100644
--- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/components/AddHostsModal/AddHostsRedirectModal.tsx
+++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/components/AddHostsModal/AddHostsRedirectModal.tsx
@@ -9,9 +9,10 @@ interface IAddHostsModalProps {
 
 const baseClass = "add-hosts-redirect-modal";
 
-const AddHostsRedirectModal = (props: IAddHostsModalProps): JSX.Element => {
-  const { onCancel, onSubmit } = props;
-
+const AddHostsRedirectModal = ({
+  onCancel,
+  onSubmit,
+}: IAddHostsModalProps): JSX.Element => {
   return (
     <Modal title={"Add hosts"} onExit={onCancel} className={baseClass}>
       <div className={`${baseClass}__modal-body`}>
diff --git a/frontend/pages/admin/TeamManagementPage/components/CreateTeamModal/CreateTeamModal.tsx b/frontend/pages/admin/TeamManagementPage/components/CreateTeamModal/CreateTeamModal.tsx
index 499d10305..eb31156f2 100644
--- a/frontend/pages/admin/TeamManagementPage/components/CreateTeamModal/CreateTeamModal.tsx
+++ b/frontend/pages/admin/TeamManagementPage/components/CreateTeamModal/CreateTeamModal.tsx
@@ -17,9 +17,10 @@ interface ICreateTeamModalProps {
   onSubmit: (formData: ICreateTeamFormData) => void;
 }
 
-const CreateTeamModal = (props: ICreateTeamModalProps): JSX.Element => {
-  const { onCancel, onSubmit } = props;
-
+const CreateTeamModal = ({
+  onCancel,
+  onSubmit,
+}: ICreateTeamModalProps): JSX.Element => {
   const [name, setName] = useState("");
 
   const onInputChange = useCallback(
diff --git a/frontend/pages/admin/TeamManagementPage/components/DeleteTeamModal/DeleteTeamModal.tsx b/frontend/pages/admin/TeamManagementPage/components/DeleteTeamModal/DeleteTeamModal.tsx
index 734194cd1..d19c3e336 100644
--- a/frontend/pages/admin/TeamManagementPage/components/DeleteTeamModal/DeleteTeamModal.tsx
+++ b/frontend/pages/admin/TeamManagementPage/components/DeleteTeamModal/DeleteTeamModal.tsx
@@ -11,9 +11,11 @@ interface IDeleteTeamModalProps {
   onCancel: () => void;
 }
 
-const DeleteTeamModal = (props: IDeleteTeamModalProps): JSX.Element => {
-  const { name, onSubmit, onCancel } = props;
-
+const DeleteTeamModal = ({
+  name,
+  onSubmit,
+  onCancel,
+}: IDeleteTeamModalProps): JSX.Element => {
   return (
     <Modal title={"Delete team"} onExit={onCancel} className={baseClass}>
       <form className={`${baseClass}__form`}>
diff --git a/frontend/pages/admin/TeamManagementPage/components/EditTeamModal/EditTeamModal.tsx b/frontend/pages/admin/TeamManagementPage/components/EditTeamModal/EditTeamModal.tsx
index 7b4360d87..a3b3f6cff 100644
--- a/frontend/pages/admin/TeamManagementPage/components/EditTeamModal/EditTeamModal.tsx
+++ b/frontend/pages/admin/TeamManagementPage/components/EditTeamModal/EditTeamModal.tsx
@@ -17,9 +17,11 @@ interface IEditTeamModalProps {
   defaultName: string;
 }
 
-const EditTeamModal = (props: IEditTeamModalProps): JSX.Element => {
-  const { onCancel, onSubmit, defaultName } = props;
-
+const EditTeamModal = ({
+  onCancel,
+  onSubmit,
+  defaultName,
+}: IEditTeamModalProps): JSX.Element => {
   const [name, setName] = useState(defaultName);
 
   const onInputChange = useCallback(
diff --git a/frontend/pages/admin/UserManagementPage/components/DeleteUserForm/DeleteUserForm.tsx b/frontend/pages/admin/UserManagementPage/components/DeleteUserForm/DeleteUserForm.tsx
index 28b1f596b..44ecdd798 100644
--- a/frontend/pages/admin/UserManagementPage/components/DeleteUserForm/DeleteUserForm.tsx
+++ b/frontend/pages/admin/UserManagementPage/components/DeleteUserForm/DeleteUserForm.tsx
@@ -9,9 +9,11 @@ interface IDeleteUserForm {
   onCancel: () => void;
 }
 
-const DeleteUserForm = (props: IDeleteUserForm): JSX.Element => {
-  const { name, onDelete, onCancel } = props;
-
+const DeleteUserForm = ({
+  name,
+  onDelete,
+  onCancel,
+}: IDeleteUserForm): JSX.Element => {
   return (
     <div className={baseClass}>
       <p>
diff --git a/frontend/pages/admin/UserManagementPage/components/EditUserModal/EditUserModal.tsx b/frontend/pages/admin/UserManagementPage/components/EditUserModal/EditUserModal.tsx
index 8fc43e7da..b81afde18 100644
--- a/frontend/pages/admin/UserManagementPage/components/EditUserModal/EditUserModal.tsx
+++ b/frontend/pages/admin/UserManagementPage/components/EditUserModal/EditUserModal.tsx
@@ -21,21 +21,19 @@ interface IEditUserModalProps {
 
 const baseClass = "edit-user-modal";
 
-const EditUserModal = (props: IEditUserModalProps): JSX.Element => {
-  const {
-    onCancel,
-    onSubmit,
-    defaultName,
-    defaultEmail,
-    defaultGlobalRole,
-    defaultTeams,
-    availableTeams,
-    isPremiumTier,
-    smtpConfigured,
-    canUseSso,
-    isSsoEnabled,
-  } = props;
-
+const EditUserModal = ({
+  onCancel,
+  onSubmit,
+  defaultName,
+  defaultEmail,
+  defaultGlobalRole,
+  defaultTeams,
+  availableTeams,
+  isPremiumTier,
+  smtpConfigured,
+  canUseSso,
+  isSsoEnabled,
+}: IEditUserModalProps): JSX.Element => {
   return (
     <Modal
       title="Edit user"
diff --git a/frontend/pages/admin/UserManagementPage/components/SelectedTeamsForm/SelectedTeamsForm.tsx b/frontend/pages/admin/UserManagementPage/components/SelectedTeamsForm/SelectedTeamsForm.tsx
index f51da07eb..014e9b5c5 100644
--- a/frontend/pages/admin/UserManagementPage/components/SelectedTeamsForm/SelectedTeamsForm.tsx
+++ b/frontend/pages/admin/UserManagementPage/components/SelectedTeamsForm/SelectedTeamsForm.tsx
@@ -119,8 +119,11 @@ const useSelectedTeamState = (
   return [teamsFormList, updateSelectedTeams] as const;
 };
 
-const SelectedTeamsForm = (props: ISelectedTeamsFormProps): JSX.Element => {
-  const { availableTeams, usersCurrentTeams, onFormChange } = props;
+const SelectedTeamsForm = ({
+  availableTeams,
+  usersCurrentTeams,
+  onFormChange,
+}: ISelectedTeamsFormProps): JSX.Element => {
   const [teamsFormList, updateSelectedTeams] = useSelectedTeamState(
     availableTeams,
     usersCurrentTeams,
diff --git a/frontend/pages/admin/UserManagementPage/components/UserForm/UserForm.tsx b/frontend/pages/admin/UserManagementPage/components/UserForm/UserForm.tsx
index 0ea280376..12ddf8ba9 100644
--- a/frontend/pages/admin/UserManagementPage/components/UserForm/UserForm.tsx
+++ b/frontend/pages/admin/UserManagementPage/components/UserForm/UserForm.tsx
@@ -122,8 +122,6 @@ class UserForm extends Component<ICreateUserFormProps, ICreateUserFormState> {
       },
       isGlobalUser: props.defaultGlobalRole !== null,
     };
-
-    const { isPremiumTier } = props;
   }
 
   onInputChange = (formField: string): ((value: string) => void) => {
diff --git a/frontend/pages/hosts/HostDetailsPage/SelectQueryModal/SelectQueryModal.jsx b/frontend/pages/hosts/HostDetailsPage/SelectQueryModal/SelectQueryModal.jsx
index baeead2f3..60eec59c7 100644
--- a/frontend/pages/hosts/HostDetailsPage/SelectQueryModal/SelectQueryModal.jsx
+++ b/frontend/pages/hosts/HostDetailsPage/SelectQueryModal/SelectQueryModal.jsx
@@ -35,16 +35,14 @@ const onQueryHostSaved = (host, selectedQuery, dispatch) => {
   );
 };
 
-const SelectQueryModal = (props) => {
-  const {
-    host,
-    onCancel,
-    dispatch,
-    queries,
-    queryErrors,
-    isOnlyObserver,
-  } = props;
-
+const SelectQueryModal = ({
+  host,
+  onCancel,
+  dispatch,
+  queries,
+  queryErrors,
+  isOnlyObserver,
+}) => {
   let queriesAvailableToRun = queries;
 
   if (isOnlyObserver) {
diff --git a/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx b/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx
index 072199dcf..8c10d80fa 100644
--- a/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx
+++ b/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx
@@ -45,9 +45,12 @@ const getHiddenColumns = (columns) => {
     .map((column) => column.accessor);
 };
 
-const EditColumnsModal = (props) => {
-  const { columns, hiddenColumns, onSaveColumns, onCancelColumns } = props;
-
+const EditColumnsModal = ({
+  columns,
+  hiddenColumns,
+  onSaveColumns,
+  onCancelColumns,
+}) => {
   const [columnItems, updateColumnItems] = useCheckboxListStateManagement(
     columns,
     hiddenColumns
diff --git a/frontend/pages/packs/EditPackPage/components/RemovePackQueryModal/RemovePackQueryModal.tsx b/frontend/pages/packs/EditPackPage/components/RemovePackQueryModal/RemovePackQueryModal.tsx
index a76229836..f05d049a5 100644
--- a/frontend/pages/packs/EditPackPage/components/RemovePackQueryModal/RemovePackQueryModal.tsx
+++ b/frontend/pages/packs/EditPackPage/components/RemovePackQueryModal/RemovePackQueryModal.tsx
@@ -13,10 +13,12 @@ interface IRemovePackQueryModalProps {
   selectedQueryIds: number[];
 }
 
-const RemovePackQueryModal = (
-  props: IRemovePackQueryModalProps
-): JSX.Element => {
-  const { onCancel, onSubmit, selectedQuery, selectedQueryIds } = props;
+const RemovePackQueryModal = ({
+  onCancel,
+  onSubmit,
+  selectedQuery,
+  selectedQueryIds,
+}: IRemovePackQueryModalProps): JSX.Element => {
   const queryOrQueries =
     selectedQuery || selectedQueryIds?.length === 1 ? "query" : "queries";
   return (
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx
index 33d33e29d..ebd9e4ce3 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx
@@ -20,18 +20,16 @@ interface IPoliciesListWrapperProps {
   tableType?: string;
 }
 
-const PoliciesListWrapper = (props: IPoliciesListWrapperProps): JSX.Element => {
-  const {
-    policiesList,
-    isLoading,
-    onRemovePoliciesClick,
-    toggleAddPolicyModal,
-    resultsTitle,
-    selectedTeamId,
-    canAddOrRemovePolicy,
-    tableType,
-  } = props;
-
+const PoliciesListWrapper = ({
+  policiesList,
+  isLoading,
+  onRemovePoliciesClick,
+  toggleAddPolicyModal,
+  resultsTitle,
+  selectedTeamId,
+  canAddOrRemovePolicy,
+  tableType,
+}: IPoliciesListWrapperProps): JSX.Element => {
   const NoPolicies = () => {
     return (
       <div className={`${noPoliciesClass}`}>
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/RemovePoliciesModal/RemovePoliciesModal.tsx b/frontend/pages/policies/ManagePoliciesPage/components/RemovePoliciesModal/RemovePoliciesModal.tsx
index a7f6e46f0..50da8255f 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/RemovePoliciesModal/RemovePoliciesModal.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/RemovePoliciesModal/RemovePoliciesModal.tsx
@@ -10,9 +10,10 @@ interface IRemovePoliciesModalProps {
   onSubmit: () => void;
 }
 
-const RemovePoliciesModal = (props: IRemovePoliciesModalProps): JSX.Element => {
-  const { onCancel, onSubmit } = props;
-
+const RemovePoliciesModal = ({
+  onCancel,
+  onSubmit,
+}: IRemovePoliciesModalProps): JSX.Element => {
   return (
     <Modal title={"Remove policies"} onExit={onCancel} className={baseClass}>
       <div className={baseClass}>
diff --git a/frontend/pages/queries/ManageQueriesPage/components/RemoveQueryModal/RemoveQueryModal.tsx b/frontend/pages/queries/ManageQueriesPage/components/RemoveQueryModal/RemoveQueryModal.tsx
index 4d587904e..795491328 100644
--- a/frontend/pages/queries/ManageQueriesPage/components/RemoveQueryModal/RemoveQueryModal.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/components/RemoveQueryModal/RemoveQueryModal.tsx
@@ -10,9 +10,10 @@ interface IRemoveQueryModalProps {
   onSubmit: () => void;
 }
 
-const RemoveQueryModal = (props: IRemoveQueryModalProps): JSX.Element => {
-  const { onCancel, onSubmit } = props;
-
+const RemoveQueryModal = ({
+  onCancel,
+  onSubmit,
+}: IRemoveQueryModalProps): JSX.Element => {
   return (
     <Modal title={"Delete query"} onExit={onCancel} className={baseClass}>
       <div className={baseClass}>
diff --git a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx
index a888c4f64..c21a94034 100644
--- a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx
+++ b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx
@@ -135,10 +135,9 @@ interface ITeamOptions {
   value: string | number;
 }
 
-const ManageSchedulePage = (props: ITeamSchedulesPageProps): JSX.Element => {
-  const {
-    params: { team_id },
-  } = props;
+const ManageSchedulePage = ({
+  params: { team_id },
+}: ITeamSchedulesPageProps): JSX.Element => {
   const teamId = parseInt(team_id, 10);
   const dispatch = useDispatch();
   const { MANAGE_PACKS } = paths;
diff --git a/frontend/pages/schedule/ManageSchedulePage/components/RemoveScheduledQueryModal/RemoveScheduledQueryModal.tsx b/frontend/pages/schedule/ManageSchedulePage/components/RemoveScheduledQueryModal/RemoveScheduledQueryModal.tsx
index 879d6b7ab..64f4e533a 100644
--- a/frontend/pages/schedule/ManageSchedulePage/components/RemoveScheduledQueryModal/RemoveScheduledQueryModal.tsx
+++ b/frontend/pages/schedule/ManageSchedulePage/components/RemoveScheduledQueryModal/RemoveScheduledQueryModal.tsx
@@ -10,11 +10,10 @@ interface IRemoveScheduledQueryModalProps {
   onSubmit: () => void;
 }
 
-const RemoveScheduledQueryModal = (
-  props: IRemoveScheduledQueryModalProps
-): JSX.Element => {
-  const { onCancel, onSubmit } = props;
-
+const RemoveScheduledQueryModal = ({
+  onCancel,
+  onSubmit,
+}: IRemoveScheduledQueryModalProps): JSX.Element => {
   return (
     <Modal
       title={"Remove scheduled query"}
diff --git a/frontend/pages/schedule/ManageSchedulePage/components/ScheduleListWrapper/ScheduleListWrapper.tsx b/frontend/pages/schedule/ManageSchedulePage/components/ScheduleListWrapper/ScheduleListWrapper.tsx
index 591a59bdc..9124a5c00 100644
--- a/frontend/pages/schedule/ManageSchedulePage/components/ScheduleListWrapper/ScheduleListWrapper.tsx
+++ b/frontend/pages/schedule/ManageSchedulePage/components/ScheduleListWrapper/ScheduleListWrapper.tsx
@@ -48,16 +48,15 @@ interface IRootState {
   };
 }
 
-const ScheduleListWrapper = (props: IScheduleListWrapperProps): JSX.Element => {
-  const {
-    onRemoveScheduledQueryClick,
-    allScheduledQueriesList,
-    toggleScheduleEditorModal,
-    onEditScheduledQueryClick,
-    teamId,
-    inheritedQueries,
-    isTeamMaintainer,
-  } = props;
+const ScheduleListWrapper = ({
+  onRemoveScheduledQueryClick,
+  allScheduledQueriesList,
+  toggleScheduleEditorModal,
+  onEditScheduledQueryClick,
+  teamId,
+  inheritedQueries,
+  isTeamMaintainer,
+}: IScheduleListWrapperProps): JSX.Element => {
   const dispatch = useDispatch();
   const { MANAGE_PACKS } = paths;