From 1dfb814ff34eefa3f9659fa9e15888eef50d51fd Mon Sep 17 00:00:00 2001 From: Saba Shavidze Date: Wed, 18 Oct 2023 11:51:25 +0400 Subject: [PATCH 1/5] refactor: changed toast to have centrilized state management ans singleton approach --- .../feedback-widget/FeedbackWidget.tsx | 2 +- .../hooks/useInventory/useInventory.tsx | 2 +- dashboard/components/layout/Layout.tsx | 143 +++++++++--------- .../onboarding-wizard/ProviderContent.tsx | 2 +- dashboard/components/toast/Toast.tsx | 3 +- dashboard/components/toast/ToastProvider.tsx | 56 +++++++ dashboard/components/toast/hooks/useToast.tsx | 30 ---- dashboard/pages/cloud-accounts.tsx | 3 +- .../pages/onboarding/cloud-accounts/index.tsx | 3 +- .../pages/onboarding/database/postgres.tsx | 3 +- .../pages/onboarding/database/sqlite.tsx | 3 +- 11 files changed, 142 insertions(+), 108 deletions(-) create mode 100644 dashboard/components/toast/ToastProvider.tsx delete mode 100644 dashboard/components/toast/hooks/useToast.tsx diff --git a/dashboard/components/feedback-widget/FeedbackWidget.tsx b/dashboard/components/feedback-widget/FeedbackWidget.tsx index 51bf836d4..c36db5543 100644 --- a/dashboard/components/feedback-widget/FeedbackWidget.tsx +++ b/dashboard/components/feedback-widget/FeedbackWidget.tsx @@ -8,8 +8,8 @@ import Modal from '@components/modal/Modal'; import Input from '@components/input/Input'; import settingsService from '@services/settingsService'; import Button from '@components/button/Button'; -import useToast from '@components/toast/hooks/useToast'; import Toast from '@components/toast/Toast'; +import { useToast } from '@components/toast/ToastProvider'; // We define the placeholder here for convenience // It's difficult to read when passed inline diff --git a/dashboard/components/inventory/hooks/useInventory/useInventory.tsx b/dashboard/components/inventory/hooks/useInventory/useInventory.tsx index 37960eff8..2f2e12cd7 100644 --- a/dashboard/components/inventory/hooks/useInventory/useInventory.tsx +++ b/dashboard/components/inventory/hooks/useInventory/useInventory.tsx @@ -1,7 +1,7 @@ +import { useToast } from '@components/toast/ToastProvider'; import { useRouter } from 'next/router'; import { ChangeEvent, useEffect, useRef, useState } from 'react'; import settingsService from '../../../../services/settingsService'; -import useToast from '../../../toast/hooks/useToast'; import useIsVisible from '../useIsVisible/useIsVisible'; import getCustomViewInventoryListAndStats from './helpers/getCustomViewInventoryListAndStats'; import getInventoryListAndStats from './helpers/getInventoryListAndStats'; diff --git a/dashboard/components/layout/Layout.tsx b/dashboard/components/layout/Layout.tsx index b2b8f08b4..0ca6e3c3e 100644 --- a/dashboard/components/layout/Layout.tsx +++ b/dashboard/components/layout/Layout.tsx @@ -4,6 +4,7 @@ import { BrowserTracing } from '@sentry/tracing'; import { useRouter } from 'next/router'; import { ReactNode, useEffect } from 'react'; import settingsService from '@services/settingsService'; +import { ToastProvider } from '@components/toast/ToastProvider'; import environment from '../../environments/environment'; import Banner from '../banner/Banner'; import useGithubStarBanner from '../banner/hooks/useGithubStarBanner'; @@ -72,80 +73,82 @@ function Layout({ children }: LayoutProps) { betaFlagOnboardingWizard }} > - {isOnboarding && <>{children}} + + {isOnboarding && <>{children}} - {!isOnboarding && ( - <> - - -
- {canRender && children} + {!isOnboarding && ( + <> + + +
+ {canRender && children} - {hasNoAccounts && betaFlagOnboardingWizard && !isOnboarding && ( - { - router.push('/onboarding/choose-cloud'); - }} - actionLabel="Begin Onboarding" - secondaryAction={() => { - router.push( - 'https://github.com/tailwarden/komiser/issues/new/choose' - ); - }} - secondaryActionLabel="Report an issue" - mascotPose="greetings" - /> - )} + {hasNoAccounts && betaFlagOnboardingWizard && !isOnboarding && ( + { + router.push('/onboarding/choose-cloud'); + }} + actionLabel="Begin Onboarding" + secondaryAction={() => { + router.push( + 'https://github.com/tailwarden/komiser/issues/new/choose' + ); + }} + secondaryActionLabel="Report an issue" + mascotPose="greetings" + /> + )} - {/* This block would be removed when onboarding Wizard is stable leaving the block above */} - {hasNoAccounts && !betaFlagOnboardingWizard && ( - { - router.push( - 'https://docs.komiser.io/docs/introduction/getting-started?utm_source=komiser&utm_medium=referral&utm_campaign=static' - ); - }} - actionLabel="Guide to connect account" - secondaryAction={() => { - router.push( - 'https://github.com/tailwarden/komiser/issues/new/choose' - ); - }} - secondaryActionLabel="Report an issue" - mascotPose="thinking" - /> - )} - {/* This block would be removed when onboarding Wizard is stable leaving the block above */} + {/* This block would be removed when onboarding Wizard is stable leaving the block above */} + {hasNoAccounts && !betaFlagOnboardingWizard && ( + { + router.push( + 'https://docs.komiser.io/docs/introduction/getting-started?utm_source=komiser&utm_medium=referral&utm_campaign=static' + ); + }} + actionLabel="Guide to connect account" + secondaryAction={() => { + router.push( + 'https://github.com/tailwarden/komiser/issues/new/choose' + ); + }} + secondaryActionLabel="Report an issue" + mascotPose="thinking" + /> + )} + {/* This block would be removed when onboarding Wizard is stable leaving the block above */} - {error && ( - router.reload()} - > - Refresh the page - - } - /> - )} -
- - )} + {error && ( + router.reload()} + > + Refresh the page + + } + /> + )} +
+ + )} + ); } diff --git a/dashboard/components/onboarding-wizard/ProviderContent.tsx b/dashboard/components/onboarding-wizard/ProviderContent.tsx index f1d959b96..7c3dbf2ca 100644 --- a/dashboard/components/onboarding-wizard/ProviderContent.tsx +++ b/dashboard/components/onboarding-wizard/ProviderContent.tsx @@ -10,9 +10,9 @@ import OnboardingWizardLayout, { import PurplinCloud from '@components/onboarding-wizard/PurplinCloud'; import CredentialsButton from '@components/onboarding-wizard/CredentialsButton'; import Toast from '@components/toast/Toast'; -import useToast from '@components/toast/hooks/useToast'; import { Provider } from '@utils/providerHelper'; import { CloudAccountPayload } from '@components/cloud-account/hooks/useCloudAccounts/useCloudAccount'; +import { useToast } from '@components/toast/ToastProvider'; interface ChildProps { cloudAccountData?: CloudAccountPayload; diff --git a/dashboard/components/toast/Toast.tsx b/dashboard/components/toast/Toast.tsx index 6afe259f5..4d4207bb5 100644 --- a/dashboard/components/toast/Toast.tsx +++ b/dashboard/components/toast/Toast.tsx @@ -1,8 +1,9 @@ import classNames from 'classnames'; import Button from '../button/Button'; -import { ToastProps } from './hooks/useToast'; + import ErrorIcon from '../icons/ErrorIcon'; import CheckIcon from '../icons/CheckIcon'; +import { ToastProps } from './ToastProvider'; type ToastProp = ToastProps & { dismissToast: () => void; diff --git a/dashboard/components/toast/ToastProvider.tsx b/dashboard/components/toast/ToastProvider.tsx new file mode 100644 index 000000000..0a2188519 --- /dev/null +++ b/dashboard/components/toast/ToastProvider.tsx @@ -0,0 +1,56 @@ +import React, { + createContext, + useContext, + useState, + useEffect, + FC, + ReactNode, + Dispatch, + SetStateAction +} from 'react'; + +export type ToastProps = { + hasError: boolean; + title: string; + message: string; +}; + +type ToastContextType = { + setToast: Dispatch>; + dismissToast: () => void; + toast: ToastProps | null; +}; + +const ToastContext = createContext(undefined); + +export const ToastProvider: FC<{ children: ReactNode }> = ({ children }) => { + const [toast, setToast] = useState(null); + + const dismissToast = () => { + setToast(null); + }; + + useEffect(() => { + let timeout: any; + if (toast) { + timeout = setTimeout(dismissToast, 5000); + } + return () => clearTimeout(timeout); + }, [toast]); + + return ( + + {children} + + ); +}; + +export const useToast = () => { + const context = useContext(ToastContext); + + if (context === undefined) { + throw new Error('useToast must be used within a ToastProvider'); + } + + return context; +}; diff --git a/dashboard/components/toast/hooks/useToast.tsx b/dashboard/components/toast/hooks/useToast.tsx deleted file mode 100644 index 35f828355..000000000 --- a/dashboard/components/toast/hooks/useToast.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { useEffect, useState } from 'react'; - -export type ToastProps = { - hasError: boolean; - title: string; - message: string; -}; - -function useToast() { - const [toast, setToast] = useState(undefined); - - function dismissToast() { - setToast(undefined); - } - - useEffect(() => { - const timeout = setTimeout(dismissToast, 5000); - return () => { - clearTimeout(timeout); - }; - }, [toast]); - - return { - toast, - setToast, - dismissToast - }; -} - -export default useToast; diff --git a/dashboard/pages/cloud-accounts.tsx b/dashboard/pages/cloud-accounts.tsx index 8e94c263c..e5e771310 100644 --- a/dashboard/pages/cloud-accounts.tsx +++ b/dashboard/pages/cloud-accounts.tsx @@ -11,7 +11,8 @@ import CloudAccountsLayout from '@components/cloud-account/components/CloudAccou import useCloudAccount from '@components/cloud-account/hooks/useCloudAccounts/useCloudAccount'; import CloudAccountsSidePanel from '@components/cloud-account/components/CloudAccountsSidePanel'; import CloudAccountDeleteContents from '@components/cloud-account/components/CloudAccountDeleteContents'; -import useToast from '@components/toast/hooks/useToast'; +import { useToast } from '@components/toast/ToastProvider'; + import EmptyState from '@components/empty-state/EmptyState'; function CloudAccounts() { diff --git a/dashboard/pages/onboarding/cloud-accounts/index.tsx b/dashboard/pages/onboarding/cloud-accounts/index.tsx index 3959713e2..b8bad619e 100644 --- a/dashboard/pages/onboarding/cloud-accounts/index.tsx +++ b/dashboard/pages/onboarding/cloud-accounts/index.tsx @@ -13,9 +13,10 @@ import DeleteIcon from '@components/icons/DeleteIcon'; import Modal from '@components/modal/Modal'; import CloudAccountDeleteContents from '@components/cloud-account/components/CloudAccountDeleteContents'; import Toast from '@components/toast/Toast'; -import useToast from '@components/toast/hooks/useToast'; + import useCloudAccount from '@components/cloud-account/hooks/useCloudAccounts/useCloudAccount'; import Button from '@components/button/Button'; +import { useToast } from '@components/toast/ToastProvider'; export default function CloudAccounts() { const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); diff --git a/dashboard/pages/onboarding/database/postgres.tsx b/dashboard/pages/onboarding/database/postgres.tsx index ce7c342d0..54d453ee5 100644 --- a/dashboard/pages/onboarding/database/postgres.tsx +++ b/dashboard/pages/onboarding/database/postgres.tsx @@ -12,9 +12,10 @@ import LabelledInput from '@components/onboarding-wizard/LabelledInput'; import DatabasePurplin from '@components/onboarding-wizard/DatabasePurplin'; import CredentialsButton from '@components/onboarding-wizard/CredentialsButton'; import settingsService from '@services/settingsService'; -import useToast from '@components/toast/hooks/useToast'; + import Toast from '@components/toast/Toast'; import DatabaseErrorMessage from '@components/onboarding-wizard/DatabaseErrorMessage'; +import { useToast } from '@components/toast/ToastProvider'; export default function PostgreSQLCredentials() { const databaseProvider = allDBProviders.POSTGRES; diff --git a/dashboard/pages/onboarding/database/sqlite.tsx b/dashboard/pages/onboarding/database/sqlite.tsx index 5cdbb9b3f..ea013f2ee 100644 --- a/dashboard/pages/onboarding/database/sqlite.tsx +++ b/dashboard/pages/onboarding/database/sqlite.tsx @@ -13,9 +13,10 @@ import DatabasePurplin from '@components/onboarding-wizard/DatabasePurplin'; import InputFileSelect from '@components/onboarding-wizard/InputFileSelect'; import CredentialsButton from '@components/onboarding-wizard/CredentialsButton'; import settingsService from '@services/settingsService'; -import useToast from '@components/toast/hooks/useToast'; + import Toast from '@components/toast/Toast'; import DatabaseErrorMessage from '@components/onboarding-wizard/DatabaseErrorMessage'; +import { useToast } from '@components/toast/ToastProvider'; export default function SqliteCredentials() { const database = allDBProviders.SQLITE; From 2f528045c0e544107b13025b3006d5816153ce31 Mon Sep 17 00:00:00 2001 From: Saba Shavidze Date: Wed, 18 Oct 2023 12:03:54 +0400 Subject: [PATCH 2/5] refactor: updated imports for ToastProps --- .../cloud-account/components/CloudAccountDeleteContents.tsx | 2 +- .../cloud-account/components/CloudAccountsSidePanel.tsx | 2 +- dashboard/components/export-csv/ExportCSV.tsx | 2 +- .../components/inventory/components/InventorySearchBar.tsx | 2 +- dashboard/components/inventory/components/InventoryTable.tsx | 2 +- .../inventory/components/filter/InventoryFilterValue.tsx | 2 +- .../components/inventory/components/view/InventoryView.tsx | 2 +- .../inventory/components/view/InventoryViewHeader.tsx | 2 +- .../inventory/components/view/alerts/InventoryViewAlerts.tsx | 2 +- .../components/view/alerts/InventoryViewAlertsDeleteAlert.tsx | 2 +- .../components/view/alerts/InventoryViewAlertsEditAlert.tsx | 2 +- .../inventory/components/view/alerts/hooks/useEditAlerts.tsx | 2 +- .../components/inventory/components/view/hooks/useViews.tsx | 2 +- .../useInventory/helpers/getCustomViewInventoryListAndStats.ts | 2 +- .../hooks/useInventory/helpers/getInventoryListFromAFilter.ts | 2 +- .../hooks/useInventory/helpers/infiniteScrollCustomViewList.ts | 2 +- .../hooks/useInventory/helpers/infiniteScrollFilteredList.ts | 2 +- .../hooks/useInventory/helpers/infiniteScrollInventoryList.ts | 2 +- .../helpers/infiniteScrollSearchedAndFilteredList.ts | 2 +- .../helpers/infiniteScrollSearchedCustomViewList.ts | 2 +- .../hooks/useInventory/helpers/infiniteScrollSearchedList.ts | 2 +- 21 files changed, 21 insertions(+), 21 deletions(-) diff --git a/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx b/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx index 69398b196..f90639782 100644 --- a/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx +++ b/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx @@ -1,9 +1,9 @@ import { useState } from 'react'; +import { ToastProps } from '@components/toast/ToastProvider'; import AlertCircleIcon from '../../icons/AlertCircleIcon'; import Button from '../../button/Button'; import { CloudAccount } from '../hooks/useCloudAccounts/useCloudAccount'; import settingsService from '../../../services/settingsService'; -import { ToastProps } from '../../toast/hooks/useToast'; interface CloudAccountDeleteContentsProps { cloudAccount: CloudAccount; diff --git a/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx b/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx index a9dcb1d6e..21d0e1104 100644 --- a/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx +++ b/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx @@ -10,6 +10,7 @@ import MongoDbAtlasAccountDetails from '@components/account-details/MongoDBAtlas import OciAccountDetails from '@components/account-details/OciAccountDetails'; import ScalewayAccountDetails from '@components/account-details/ScalewayAccountDetails'; import { getPayloadFromForm } from '@utils/cloudAccountHelpers'; +import { ToastProps } from '@components/toast/ToastProvider'; import providers, { allProviders, Provider @@ -24,7 +25,6 @@ import { CloudAccount, CloudAccountsPage } from '../hooks/useCloudAccounts/useCloudAccount'; -import { ToastProps } from '../../toast/hooks/useToast'; import settingsService from '../../../services/settingsService'; interface CloudAccountsSidePanelProps { diff --git a/dashboard/components/export-csv/ExportCSV.tsx b/dashboard/components/export-csv/ExportCSV.tsx index fd17946c8..835cdbdaf 100644 --- a/dashboard/components/export-csv/ExportCSV.tsx +++ b/dashboard/components/export-csv/ExportCSV.tsx @@ -1,6 +1,6 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { useRouter } from 'next/router'; import settingsService from '../../services/settingsService'; -import { ToastProps } from '../toast/hooks/useToast'; import ExportCSVButton from './ExportCSVButton'; type ExportCSVProps = { diff --git a/dashboard/components/inventory/components/InventorySearchBar.tsx b/dashboard/components/inventory/components/InventorySearchBar.tsx index 2631e9d7d..13fd5b09d 100644 --- a/dashboard/components/inventory/components/InventorySearchBar.tsx +++ b/dashboard/components/inventory/components/InventorySearchBar.tsx @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import ExportCSV from '../../export-csv/ExportCSV'; import CloseIcon from '../../icons/CloseIcon'; import SearchIcon from '../../icons/SearchIcon'; -import { ToastProps } from '../../toast/hooks/useToast'; type InventorySearchBarProps = { query: string; diff --git a/dashboard/components/inventory/components/InventoryTable.tsx b/dashboard/components/inventory/components/InventoryTable.tsx index eb226295c..d25712411 100644 --- a/dashboard/components/inventory/components/InventoryTable.tsx +++ b/dashboard/components/inventory/components/InventoryTable.tsx @@ -1,10 +1,10 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { ChangeEvent } from 'react'; import formatNumber from '../../../utils/formatNumber'; import providers from '../../../utils/providerHelper'; import Checkbox from '../../checkbox/Checkbox'; import SkeletonInventory from '../../skeleton/SkeletonInventory'; -import { ToastProps } from '../../toast/hooks/useToast'; import { InventoryItem, InventoryStats diff --git a/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx b/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx index 0ed019754..e1acbc860 100644 --- a/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx +++ b/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx @@ -1,8 +1,8 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { ChangeEvent, useEffect, useState } from 'react'; import settingsService from '../../../../services/settingsService'; import Checkbox from '../../../checkbox/Checkbox'; import Input from '../../../input/Input'; -import { ToastProps } from '../../../toast/hooks/useToast'; import { InventoryFilterData } from '../../hooks/useInventory/types/useInventoryTypes'; import { CostBetween } from './hooks/useFilterWizard'; diff --git a/dashboard/components/inventory/components/view/InventoryView.tsx b/dashboard/components/inventory/components/view/InventoryView.tsx index 1cc5f0ed7..8f692e3ec 100644 --- a/dashboard/components/inventory/components/view/InventoryView.tsx +++ b/dashboard/components/inventory/components/view/InventoryView.tsx @@ -1,5 +1,6 @@ import Image from 'next/image'; import { NextRouter } from 'next/router'; +import { ToastProps } from '@components/toast/ToastProvider'; import formatNumber from '../../../../utils/formatNumber'; import providers, { Provider } from '../../../../utils/providerHelper'; import Button from '../../../button/Button'; @@ -10,7 +11,6 @@ import Sidepanel from '../../../sidepanel/Sidepanel'; import SidepanelHeader from '../../../sidepanel/SidepanelHeader'; import SidepanelPage from '../../../sidepanel/SidepanelPage'; import SidepanelTabs from '../../../sidepanel/SidepanelTabs'; -import { ToastProps } from '../../../toast/hooks/useToast'; import { HiddenResource, InventoryFilterData, diff --git a/dashboard/components/inventory/components/view/InventoryViewHeader.tsx b/dashboard/components/inventory/components/view/InventoryViewHeader.tsx index b51e18cdb..b0487caa8 100644 --- a/dashboard/components/inventory/components/view/InventoryViewHeader.tsx +++ b/dashboard/components/inventory/components/view/InventoryViewHeader.tsx @@ -1,3 +1,4 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { FormEvent, useState } from 'react'; import Button from '../../../button/Button'; @@ -10,7 +11,6 @@ import EditIcon from '../../../icons/EditIcon'; import LinkIcon from '../../../icons/LinkIcon'; import WarningIcon from '../../../icons/WarningIcon'; import Modal from '../../../modal/Modal'; -import { ToastProps } from '../../../toast/hooks/useToast'; import { InventoryFilterData, View diff --git a/dashboard/components/inventory/components/view/alerts/InventoryViewAlerts.tsx b/dashboard/components/inventory/components/view/alerts/InventoryViewAlerts.tsx index 8042fec6c..dbb3327f8 100644 --- a/dashboard/components/inventory/components/view/alerts/InventoryViewAlerts.tsx +++ b/dashboard/components/inventory/components/view/alerts/InventoryViewAlerts.tsx @@ -1,4 +1,4 @@ -import { ToastProps } from '../../../../toast/hooks/useToast'; +import { ToastProps } from '@components/toast/ToastProvider'; import useAlerts from './hooks/useAlerts'; import InventoryViewAlertsDeleteAlert from './InventoryViewAlertsDeleteAlert'; import InventoryViewAlertDisplayAlerts from './InventoryViewAlertsDisplay'; diff --git a/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsDeleteAlert.tsx b/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsDeleteAlert.tsx index db792db22..67f814da3 100644 --- a/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsDeleteAlert.tsx +++ b/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsDeleteAlert.tsx @@ -1,8 +1,8 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import Image from 'next/image'; import Button from '../../../../button/Button'; import { AlertMethod, Alert } from './hooks/useAlerts'; import useEditAlerts from './hooks/useEditAlerts'; -import { ToastProps } from '../../../../toast/hooks/useToast'; type InventoryViewAlertsDeleteAlertProps = { alertMethod: AlertMethod; diff --git a/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsEditAlert.tsx b/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsEditAlert.tsx index 589fa7fe8..a80b6c3c7 100644 --- a/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsEditAlert.tsx +++ b/dashboard/components/inventory/components/view/alerts/InventoryViewAlertsEditAlert.tsx @@ -1,11 +1,11 @@ import classNames from 'classnames'; import { useState } from 'react'; import Image from 'next/image'; +import { ToastProps } from '@components/toast/ToastProvider'; import Button from '../../../../button/Button'; import Grid from '../../../../grid/Grid'; import ArrowLeftIcon from '../../../../icons/ArrowLeftIcon'; import Input from '../../../../input/Input'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import useEditAlerts from './hooks/useEditAlerts'; import { AlertMethod, Alert } from './hooks/useAlerts'; import settingsService from '../../../../../services/settingsService'; diff --git a/dashboard/components/inventory/components/view/alerts/hooks/useEditAlerts.tsx b/dashboard/components/inventory/components/view/alerts/hooks/useEditAlerts.tsx index 9f1c72ec0..86a13c8f1 100644 --- a/dashboard/components/inventory/components/view/alerts/hooks/useEditAlerts.tsx +++ b/dashboard/components/inventory/components/view/alerts/hooks/useEditAlerts.tsx @@ -1,6 +1,6 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { FormEvent, useState } from 'react'; import settingsService from '../../../../../../services/settingsService'; -import { ToastProps } from '../../../../../toast/hooks/useToast'; import { AlertMethod, Alert } from './useAlerts'; type AlertType = 'BUDGET' | 'USAGE'; diff --git a/dashboard/components/inventory/components/view/hooks/useViews.tsx b/dashboard/components/inventory/components/view/hooks/useViews.tsx index 657ad9a91..b34a71d14 100644 --- a/dashboard/components/inventory/components/view/hooks/useViews.tsx +++ b/dashboard/components/inventory/components/view/hooks/useViews.tsx @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { ChangeEvent, FormEvent, useState } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { HiddenResource, InventoryFilterData, diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/getCustomViewInventoryListAndStats.ts b/dashboard/components/inventory/hooks/useInventory/helpers/getCustomViewInventoryListAndStats.ts index 6288037b0..acae4c110 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/getCustomViewInventoryListAndStats.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/getCustomViewInventoryListAndStats.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { HiddenResource, InventoryFilterData, diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/getInventoryListFromAFilter.ts b/dashboard/components/inventory/hooks/useInventory/helpers/getInventoryListFromAFilter.ts index 9858e31da..bdca50329 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/getInventoryListFromAFilter.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/getInventoryListFromAFilter.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryFilterData, InventoryItem, diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollCustomViewList.ts b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollCustomViewList.ts index 8e75df240..e9eeeaf90 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollCustomViewList.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollCustomViewList.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryItem, View } from '../types/useInventoryTypes'; type InfiniteScrollCustomViewListProps = { diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollFilteredList.ts b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollFilteredList.ts index 3a55f91b9..531289dd9 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollFilteredList.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollFilteredList.ts @@ -1,6 +1,6 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryFilterData, InventoryItem } from '../types/useInventoryTypes'; type InfiniteScrollFilteredListProps = { diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollInventoryList.ts b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollInventoryList.ts index 010b7d386..83d504328 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollInventoryList.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollInventoryList.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryFilterData, InventoryItem, diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedAndFilteredList.ts b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedAndFilteredList.ts index 8e671511d..9a199af8e 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedAndFilteredList.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedAndFilteredList.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryFilterData, InventoryItem } from '../types/useInventoryTypes'; type InfiniteScrollSearchedAndFilteredList = { diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedCustomViewList.ts b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedCustomViewList.ts index 546e83132..c9a9b282b 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedCustomViewList.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedCustomViewList.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryItem, View } from '../types/useInventoryTypes'; type InfiniteScrollSearchedCustomViewListProps = { diff --git a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedList.ts b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedList.ts index fcf38caba..4e19aaee6 100644 --- a/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedList.ts +++ b/dashboard/components/inventory/hooks/useInventory/helpers/infiniteScrollSearchedList.ts @@ -1,7 +1,7 @@ +import { ToastProps } from '@components/toast/ToastProvider'; import { NextRouter } from 'next/router'; import { SetStateAction } from 'react'; import settingsService from '../../../../../services/settingsService'; -import { ToastProps } from '../../../../toast/hooks/useToast'; import { InventoryItem } from '../types/useInventoryTypes'; type InfiniteScrollSearchedListProps = { From 5e44c2654228f6e939f8205cd64ba11bb3a40975 Mon Sep 17 00:00:00 2001 From: Saba Shavidze Date: Wed, 18 Oct 2023 12:33:47 +0400 Subject: [PATCH 3/5] refactor: updated imports for ToastProps --- .../components/CloudAccountDeleteContents.tsx | 8 ++-- .../components/CloudAccountsSidePanel.tsx | 10 ++--- .../filter/DependencyGraphFilterDropdown.tsx | 4 +- dashboard/components/export-csv/ExportCSV.tsx | 6 +-- .../feedback-widget/FeedbackWidget.tsx | 14 +++--- .../components/InventoryFilterDropdown.tsx | 4 +- .../components/InventorySearchBar.tsx | 6 +-- .../inventory/components/InventoryTable.tsx | 6 +-- .../filter/InventoryFilterValue.tsx | 12 ++--- .../components/view/InventoryView.tsx | 10 ++--- .../components/view/InventoryViewHeader.tsx | 8 ++-- .../view/alerts/InventoryViewAlerts.tsx | 10 ++--- .../alerts/InventoryViewAlertsDeleteAlert.tsx | 6 +-- .../alerts/InventoryViewAlertsEditAlert.tsx | 6 +-- .../view/alerts/hooks/useEditAlerts.tsx | 16 +++---- .../components/view/hooks/useViews.tsx | 28 ++++++------ .../getCustomViewInventoryListAndStats.ts | 8 ++-- .../helpers/getInventoryListFromAFilter.ts | 8 ++-- .../helpers/infiniteScrollCustomViewList.ts | 6 +-- .../helpers/infiniteScrollFilteredList.ts | 6 +-- .../helpers/infiniteScrollInventoryList.ts | 6 +-- .../infiniteScrollSearchedAndFilteredList.ts | 6 +-- .../infiniteScrollSearchedCustomViewList.ts | 6 +-- .../helpers/infiniteScrollSearchedList.ts | 6 +-- .../hooks/useInventory/useInventory.tsx | 44 +++++++++---------- .../onboarding-wizard/ProviderContent.tsx | 4 +- dashboard/components/toast/ToastProvider.tsx | 12 ++--- dashboard/pages/cloud-accounts.tsx | 6 +-- dashboard/pages/inventory.tsx | 6 +-- .../pages/onboarding/cloud-accounts/index.tsx | 4 +- .../pages/onboarding/database/postgres.tsx | 4 +- .../pages/onboarding/database/sqlite.tsx | 4 +- dashboard/utils/cloudAccountHelpers.ts | 28 ++++++------ 33 files changed, 160 insertions(+), 158 deletions(-) diff --git a/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx b/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx index f90639782..51b1c9c45 100644 --- a/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx +++ b/dashboard/components/cloud-account/components/CloudAccountDeleteContents.tsx @@ -9,14 +9,14 @@ interface CloudAccountDeleteContentsProps { cloudAccount: CloudAccount; onCancel: () => void; handleAfterDelete: (account: CloudAccount) => void; - setToast: (toast: ToastProps) => void; + showToast: (toast: ToastProps) => void; } function CloudAccountDeleteContents({ cloudAccount, onCancel, handleAfterDelete, - setToast + showToast }: CloudAccountDeleteContentsProps) { const [loading, setLoading] = useState(false); @@ -28,14 +28,14 @@ function CloudAccountDeleteContents({ settingsService.deleteCloudAccount(cloudAccount.id).then(res => { setLoading(false); if (res === Error) { - setToast({ + showToast({ hasError: true, title: 'Cloud account was not deleted', message: 'There was an error deleting this cloud account. Please try again.' }); } else { - setToast({ + showToast({ hasError: false, title: 'Cloud account deleted', message: `The cloud account was successfully deleted!` diff --git a/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx b/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx index 21d0e1104..0976ef508 100644 --- a/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx +++ b/dashboard/components/cloud-account/components/CloudAccountsSidePanel.tsx @@ -36,7 +36,7 @@ interface CloudAccountsSidePanelProps { handleAfterDelete: (account: CloudAccount) => void; page: CloudAccountsPage; goTo: (page: CloudAccountsPage) => void; - setToast: (toast: ToastProps) => void; + showToast: (toast: ToastProps) => void; } function AccountDetails({ @@ -81,7 +81,7 @@ function CloudAccountsSidePanel({ handleAfterDelete, page, goTo, - setToast + showToast }: CloudAccountsSidePanelProps) { const [isDeleteOpen, setIsDeleteOpen] = useState(false); const [loading, setLoading] = useState(false); @@ -101,7 +101,7 @@ function CloudAccountsSidePanel({ settingsService.editCloudAccount(id, payloadJson).then(res => { if (res === Error || res.error) { setLoading(false); - setToast({ + showToast({ hasError: true, title: 'Cloud account not edited', message: @@ -109,7 +109,7 @@ function CloudAccountsSidePanel({ }); } else { setLoading(false); - setToast({ + showToast({ hasError: false, title: 'Cloud account edited', message: `The cloud account was successfully edited!` @@ -182,7 +182,7 @@ function CloudAccountsSidePanel({ setIsDeleteOpen(false); closeModal(); }} - setToast={setToast} + showToast={showToast} /> ) : ( diff --git a/dashboard/components/explorer/filter/DependencyGraphFilterDropdown.tsx b/dashboard/components/explorer/filter/DependencyGraphFilterDropdown.tsx index c2c927f1d..20e0e1b78 100644 --- a/dashboard/components/explorer/filter/DependencyGraphFilterDropdown.tsx +++ b/dashboard/components/explorer/filter/DependencyGraphFilterDropdown.tsx @@ -19,7 +19,7 @@ export default function InventoryFilterDropdown({ toggle, closeDropdownAfterAdd }: InventoryFilterDropdownProps) { - const { setSkippedSearch, router, setToast } = useInventory(); + const { setSkippedSearch, router, showToast } = useInventory(); const { // toggle, @@ -93,7 +93,7 @@ export default function InventoryFilterDropdown({ handleValueCheck={handleValueCheck} handleValueInput={handleValueInput} cleanValues={cleanValues} - setToast={setToast} + showToast={showToast} costBetween={costBetween} handleCostBetween={handleCostBetween} /> diff --git a/dashboard/components/export-csv/ExportCSV.tsx b/dashboard/components/export-csv/ExportCSV.tsx index 835cdbdaf..0029a4976 100644 --- a/dashboard/components/export-csv/ExportCSV.tsx +++ b/dashboard/components/export-csv/ExportCSV.tsx @@ -4,15 +4,15 @@ import settingsService from '../../services/settingsService'; import ExportCSVButton from './ExportCSVButton'; type ExportCSVProps = { - setToast: (toast: ToastProps | undefined) => void; + showToast: (toast: ToastProps) => void; }; -function ExportCSV({ setToast }: ExportCSVProps) { +function ExportCSV({ showToast }: ExportCSVProps) { const router = useRouter(); function exportCSV(id?: string) { settingsService.exportCSV(id); - setToast({ + showToast({ hasError: false, title: 'CSV exported', message: 'The download of the CSV file should begin shortly.' diff --git a/dashboard/components/feedback-widget/FeedbackWidget.tsx b/dashboard/components/feedback-widget/FeedbackWidget.tsx index c36db5543..9aa803604 100644 --- a/dashboard/components/feedback-widget/FeedbackWidget.tsx +++ b/dashboard/components/feedback-widget/FeedbackWidget.tsx @@ -54,7 +54,7 @@ const useFeedbackWidget = (defaultState: boolean = false) => { const [isTakingScreenCapture, setIsTakingScreenCapture] = useState(false); const [fileAttachement, setFileAttachement] = useState(null); const [isSendingFeedback, setIsSendingFeedback] = useState(false); - const { toast, setToast, dismissToast } = useToast(); + const { toast, showToast, dismissToast } = useToast(); async function takeScreenshot() { if ( @@ -85,7 +85,7 @@ const useFeedbackWidget = (defaultState: boolean = false) => { setFileAttachement(screenShotFile); } - setToast({ + showToast({ hasError: false, title: 'Screen capture', message: @@ -93,7 +93,7 @@ const useFeedbackWidget = (defaultState: boolean = false) => { }); }) .catch(err => { - setToast({ + showToast({ hasError: true, title: 'Screen capture failed', message: @@ -126,7 +126,7 @@ const useFeedbackWidget = (defaultState: boolean = false) => { settingsService .sendFeedback(formData) .then(result => { - setToast({ + showToast({ hasError: false, title: 'Feedback sent', message: @@ -136,7 +136,7 @@ const useFeedbackWidget = (defaultState: boolean = false) => { clearFeedbackForm(); }) .catch(error => { - setToast({ + showToast({ hasError: true, title: 'Feedback', message: 'An Error happened. Maybe try again please!' @@ -267,14 +267,14 @@ const useFeedbackWidget = (defaultState: boolean = false) => { hoverTitle="drop here" maxSize={MAX_FILE_SIZE_MB} onTypeError={(err: string) => - setToast({ + showToast({ hasError: true, title: 'File upload failed', message: err }) } onSizeError={(err: string) => - setToast({ + showToast({ hasError: true, title: 'File upload failed', message: err diff --git a/dashboard/components/inventory/components/InventoryFilterDropdown.tsx b/dashboard/components/inventory/components/InventoryFilterDropdown.tsx index 11f11dc69..118e74a4e 100644 --- a/dashboard/components/inventory/components/InventoryFilterDropdown.tsx +++ b/dashboard/components/inventory/components/InventoryFilterDropdown.tsx @@ -19,7 +19,7 @@ export default function InventoryFilterDropdown({ toggle, closeDropdownAfterAdd }: InventoryFilterDropdownProps) { - const { setSkippedSearch, router, setToast } = useInventory(); + const { setSkippedSearch, router, showToast } = useInventory(); const { // toggle, @@ -91,7 +91,7 @@ export default function InventoryFilterDropdown({ handleValueCheck={handleValueCheck} handleValueInput={handleValueInput} cleanValues={cleanValues} - setToast={setToast} + showToast={showToast} costBetween={costBetween} handleCostBetween={handleCostBetween} /> diff --git a/dashboard/components/inventory/components/InventorySearchBar.tsx b/dashboard/components/inventory/components/InventorySearchBar.tsx index 13fd5b09d..d6f3a1c75 100644 --- a/dashboard/components/inventory/components/InventorySearchBar.tsx +++ b/dashboard/components/inventory/components/InventorySearchBar.tsx @@ -7,14 +7,14 @@ type InventorySearchBarProps = { query: string; setQuery: (query: string) => void; error: boolean; - setToast: (toast: ToastProps | undefined) => void; + showToast: (toast: ToastProps) => void; }; function InventorySearchBar({ query, setQuery, error, - setToast + showToast }: InventorySearchBarProps) { return ( <> @@ -45,7 +45,7 @@ function InventorySearchBar({ maxLength={64} />
- +
)} diff --git a/dashboard/components/inventory/components/InventoryTable.tsx b/dashboard/components/inventory/components/InventoryTable.tsx index d25712411..de72272ae 100644 --- a/dashboard/components/inventory/components/InventoryTable.tsx +++ b/dashboard/components/inventory/components/InventoryTable.tsx @@ -32,7 +32,7 @@ type InventoryTableProps = { searchedLoading: boolean; hideResourceFromCustomView: () => void; hideResourcesLoading: boolean; - setToast: (toast: ToastProps | undefined) => void; + showToast: (toast: ToastProps) => void; }; function InventoryTable({ @@ -52,7 +52,7 @@ function InventoryTable({ searchedLoading, hideResourceFromCustomView, hideResourcesLoading, - setToast + showToast }: InventoryTableProps) { return ( <> @@ -63,7 +63,7 @@ function InventoryTable({ query={query} setQuery={setQuery} error={error} - setToast={setToast} + showToast={showToast} />
diff --git a/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx b/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx index e1acbc860..4462f0b9a 100644 --- a/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx +++ b/dashboard/components/inventory/components/filter/InventoryFilterValue.tsx @@ -14,7 +14,7 @@ type InventoryFilterValueProps = { ) => void; handleValueInput: (newValue: { values: string }) => void; cleanValues: () => void; - setToast: (toast: ToastProps | undefined) => void; + showToast: (toast: ToastProps) => void; costBetween: CostBetween; handleCostBetween: (newValue: Partial) => void; }; @@ -26,7 +26,7 @@ function InventoryFilterValue({ handleValueCheck, handleValueInput, cleanValues, - setToast, + showToast, costBetween, handleCostBetween }: InventoryFilterValueProps) { @@ -45,7 +45,7 @@ function InventoryFilterValue({ if (data.field === 'provider') { settingsService.getProviders().then(res => { if (res === Error) { - setToast({ + showToast({ hasError: true, title: `There was an error when fetching the cloud providers`, message: `Please refresh the page and try again.` @@ -59,7 +59,7 @@ function InventoryFilterValue({ if (data.field === 'account') { settingsService.getAccounts().then(res => { if (res === Error) { - setToast({ + showToast({ hasError: true, title: `There was an error when fetching the cloud accounts`, message: `Please refresh the page and try again.` @@ -73,7 +73,7 @@ function InventoryFilterValue({ if (data.field === 'region') { settingsService.getRegions().then(res => { if (res === Error) { - setToast({ + showToast({ hasError: true, title: `There was an error when fetching the cloud regions`, message: `Please refresh the page and try again.` @@ -87,7 +87,7 @@ function InventoryFilterValue({ if (data.field === 'service') { settingsService.getServices().then(res => { if (res === Error) { - setToast({ + showToast({ hasError: true, title: `There was an error when fetching the cloud services`, message: `Please refresh the page and try again.` diff --git a/dashboard/components/inventory/components/view/InventoryView.tsx b/dashboard/components/inventory/components/view/InventoryView.tsx index 8f692e3ec..0781f4faf 100644 --- a/dashboard/components/inventory/components/view/InventoryView.tsx +++ b/dashboard/components/inventory/components/view/InventoryView.tsx @@ -25,7 +25,7 @@ import useViews from './hooks/useViews'; type InventoryViewProps = { filters: InventoryFilterData[] | undefined; displayedFilters: InventoryFilterData[] | undefined; - setToast: (toast: ToastProps | undefined) => void; + showToast: (toast: ToastProps) => void; inventoryStats: InventoryStats | undefined; router: NextRouter; views: View[] | undefined; @@ -36,7 +36,7 @@ type InventoryViewProps = { function InventoryView({ filters, displayedFilters, - setToast, + showToast, inventoryStats, router, views, @@ -63,7 +63,7 @@ function InventoryView({ unhideResources, deleteLoading } = useViews({ - setToast, + showToast, views, router, getViews, @@ -78,7 +78,7 @@ function InventoryView({ views={views} router={router} saveView={saveView} - setToast={setToast} + showToast={showToast} loading={loading} deleteView={deleteView} deleteLoading={deleteLoading} @@ -173,7 +173,7 @@ function InventoryView({ - + diff --git a/dashboard/components/inventory/components/view/InventoryViewHeader.tsx b/dashboard/components/inventory/components/view/InventoryViewHeader.tsx index b0487caa8..79a4fbfc2 100644 --- a/dashboard/components/inventory/components/view/InventoryViewHeader.tsx +++ b/dashboard/components/inventory/components/view/InventoryViewHeader.tsx @@ -35,7 +35,7 @@ type InventoryViewHeaderProps = { dropdown?: boolean | undefined, viewToBeDeleted?: View | undefined ) => void; - setToast: (toast: ToastProps | undefined) => void; + showToast: (toast: ToastProps) => void; }; function InventoryViewHeader({ @@ -46,7 +46,7 @@ function InventoryViewHeader({ loading, deleteView, deleteLoading, - setToast + showToast }: InventoryViewHeaderProps) { const [dropdownIsOpen, setDropdownIsOpen] = useState(false); const [modalIsOpen, setModalIsOpen] = useState(false); @@ -134,7 +134,7 @@ function InventoryViewHeader({ transition={false} onClick={() => { navigator.clipboard.writeText(document.URL); - setToast({ + showToast({ hasError: false, title: 'Link copied!', message: `${document.URL} has been copied to your clipboard.` @@ -144,7 +144,7 @@ function InventoryViewHeader({ Copy view link - +