Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HOSTSD-319 Fix Drive Space Loading #129

Merged
merged 1 commit into from
Mar 28, 2024
Merged

HOSTSD-319 Fix Drive Space Loading #129

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/dashboard/src/components/dashboard/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ import { useDashboardFilter } from '.';
* @returns Component
*/
export const Dashboard = () => {
const { download, downloadHistory } = useApiServerItems();
const { download } = useApiServerItems();
const { isReady: isReadyTenants, tenants } = useTenants({ init: true });
const { isReady: isReadyOrganizations, organizations } = useOrganizations({
init: true,
Expand Down Expand Up @@ -198,7 +198,7 @@ export const Dashboard = () => {
dashboardOrganization,
dashboardOperatingSystemItem,
handleExport,
]
],
);

return (
Expand Down
6 changes: 3 additions & 3 deletions src/dashboard/src/hooks/filter/useFilteredFileSystemItems.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,11 @@ import { IFileSystemItemFilter, IFileSystemItemModel, useApiFileSystemItems } fr

export const useFilteredFileSystemItems = () => {
const { find } = useApiFileSystemItems();
const isLoading = useFilteredStore((state) => state.loadingFileSystemItems);
const setIsLoading = useFilteredStore((state) => state.setLoadingFileSystemItems);
const fileSystemItems = useFilteredStore((state) => state.fileSystemItems);
const setFileSystemItems = useFilteredStore((state) => state.setFileSystemItems);

const [isLoading, setIsLoading] = React.useState(false);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Look hook state was causing the issue. Every different hook would have it's own state. As such the hook for the filter was not the same state variable as the one used on the dashboard. Loading state has been moved to the zustand store.


const fetch = React.useCallback(
async (filter: IFileSystemItemFilter) => {
try {
Expand All @@ -23,7 +23,7 @@ export const useFilteredFileSystemItems = () => {
setIsLoading(false);
}
},
[find, setFileSystemItems],
[find, setFileSystemItems, setIsLoading],
);

return React.useMemo(
Expand Down
6 changes: 3 additions & 3 deletions src/dashboard/src/hooks/filter/useFilteredOperatingSystemItems.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,12 @@ import {

export const useFilteredOperatingSystemItems = () => {
const { findList } = useApiOperatingSystemItems();
const isLoading = useFilteredStore((state) => state.loadingOperatingSystemItems);
const setIsLoading = useFilteredStore((state) => state.setLoadingOperatingSystemItems);
const { operatingSystemItem } = useFilteredStore((state) => state.values);
const operatingSystemItems = useFilteredStore((state) => state.operatingSystemItems);
const setOperatingSystemItems = useFilteredStore((state) => state.setOperatingSystemItems);

const [isLoading, setIsLoading] = React.useState(false);

const fetch = React.useCallback(
async (filter: IOperatingSystemItemFilter) => {
try {
Expand All @@ -29,7 +29,7 @@ export const useFilteredOperatingSystemItems = () => {
setIsLoading(false);
}
},
[findList, setOperatingSystemItems],
[findList, setIsLoading, setOperatingSystemItems],
);

const options = React.useMemo(
Expand Down
6 changes: 3 additions & 3 deletions src/dashboard/src/hooks/filter/useFilteredOrganizations.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@ export interface IFilteredOrganizations {

export const useFilteredOrganizations = ({ includeDisabled }: IFilteredOrganizations = {}) => {
const { findList } = useApiOrganizations();
const isLoading = useFilteredStore((state) => state.loadingOrganizations);
const setIsLoading = useFilteredStore((state) => state.setLoadingOrganizations);
const organizations = useFilteredStore((state) => state.organizations);
const setOrganizations = useFilteredStore((state) => state.setOrganizations);

const [isLoading, setIsLoading] = React.useState(false);

const fetch = React.useCallback(
async (filter: IOrganizationFilter) => {
try {
Expand All @@ -29,7 +29,7 @@ export const useFilteredOrganizations = ({ includeDisabled }: IFilteredOrganizat
setIsLoading(false);
}
},
[findList, setOrganizations],
[findList, setIsLoading, setOrganizations],
);

const options = React.useMemo(
Expand Down
6 changes: 3 additions & 3 deletions src/dashboard/src/hooks/filter/useFilteredServerItems.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@ export interface IFilteredServerItemsProps {}

export const useFilteredServerItems = ({}: IFilteredServerItemsProps) => {
const { findList } = useApiServerItems();
const isLoading = useFilteredStore((state) => state.loadingServerItems);
const setIsLoading = useFilteredStore((state) => state.setLoadingServerItems);
const serverItems = useFilteredStore((state) => state.serverItems);
const setFilteredServerItems = useFilteredStore((state) => state.setServerItems);

const [isLoading, setIsLoading] = React.useState(false);

const fetch = React.useCallback(
async (filter: IServerItemFilter) => {
try {
Expand All @@ -26,7 +26,7 @@ export const useFilteredServerItems = ({}: IFilteredServerItemsProps) => {
setIsLoading(false);
}
},
[findList, setFilteredServerItems],
[findList, setFilteredServerItems, setIsLoading],
);

const options = React.useMemo(
Expand Down
6 changes: 3 additions & 3 deletions src/dashboard/src/hooks/filter/useFilteredTenants.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@ export interface IFilteredTenants {

export const useFilteredTenants = ({ includeDisabled }: IFilteredTenants = {}) => {
const { findList } = useApiTenants();
const isLoading = useFilteredStore((state) => state.loadingTenants);
const setIsLoading = useFilteredStore((state) => state.setLoadingTenants);
const tenants = useFilteredStore((state) => state.tenants);
const setTenants = useFilteredStore((state) => state.setTenants);

const [isLoading, setIsLoading] = React.useState(false);

const fetch = React.useCallback(
async (filter: ITenantFilter) => {
try {
Expand All @@ -29,7 +29,7 @@ export const useFilteredTenants = ({ includeDisabled }: IFilteredTenants = {}) =
setIsLoading(false);
}
},
[findList, setTenants],
[findList, setIsLoading, setTenants],
);

const options = React.useMemo(
Expand Down
22 changes: 22 additions & 0 deletions src/dashboard/src/store/useFilteredStore.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,30 +22,40 @@ export interface IFilteredStoreState {
setValues: (dispatch: (values: IFilterValues) => IFilterValues) => void;

// Tenants
loadingTenants: boolean;
setLoadingTenants: (value: boolean) => void;
tenantsReady?: boolean;
setTenantsReady: (value?: boolean) => void;
tenants: ITenantListModel[];
setTenants: (values: ITenantListModel[]) => void;

// Organizations
loadingOrganizations: boolean;
setLoadingOrganizations: (value: boolean) => void;
organizationsReady?: boolean;
setOrganizationsReady: (value?: boolean) => void;
organizations: IOrganizationListModel[];
setOrganizations: (values: IOrganizationListModel[]) => void;

// Operating System Items
loadingOperatingSystemItems: boolean;
setLoadingOperatingSystemItems: (value: boolean) => void;
operatingSystemItemsReady?: boolean;
setOperatingSystemItemsReady: (value?: boolean) => void;
operatingSystemItems: IOperatingSystemItemListModel[];
setOperatingSystemItems: (values: IOperatingSystemItemListModel[]) => void;

// Server Items
loadingServerItems: boolean;
setLoadingServerItems: (value: boolean) => void;
serverItemsReady?: boolean;
setServerItemsReady: (value?: boolean) => void;
serverItems: IServerItemListModel[];
setServerItems: (values: IServerItemListModel[]) => void;

// File System Items
loadingFileSystemItems: boolean;
setLoadingFileSystemItems: (value: boolean) => void;
fileSystemItemsReady?: boolean;
setFileSystemItemsReady: (value?: boolean) => void;
fileSystemItems: IFileSystemItemModel[];
Expand All @@ -63,27 +73,39 @@ export const useFilteredStore = create<IFilteredStoreState>((set, get) => ({
},

// Tenants
loadingTenants: false,
setLoadingTenants: (value) => set((state) => ({ ...state, loadingTenants: value })),
setTenantsReady: (value) => set((state) => ({ ...state, tenantsReady: value })),
tenants: [],
setTenants: (values) => set((state) => ({ ...state, tenants: values })),

// Organizations
loadingOrganizations: false,
setLoadingOrganizations: (value) => set((state) => ({ ...state, loadingOrganizations: value })),
setOrganizationsReady: (value) => set((state) => ({ ...state, organizationsReady: value })),
organizations: [],
setOrganizations: (values) => set((state) => ({ ...state, organizations: values })),

// Operating System Items
loadingOperatingSystemItems: false,
setLoadingOperatingSystemItems: (value) =>
set((state) => ({ ...state, loadingOperatingSystemItems: value })),
setOperatingSystemItemsReady: (value) =>
set((state) => ({ ...state, operatingSystemItemsReady: value })),
operatingSystemItems: [],
setOperatingSystemItems: (values) => set((state) => ({ ...state, operatingSystemItems: values })),

// Server Items
loadingServerItems: false,
setLoadingServerItems: (value) => set((state) => ({ ...state, loadingServerItems: value })),
setServerItemsReady: (value) => set((state) => ({ ...state, serverItemsReady: value })),
serverItems: [],
setServerItems: (values) => set((state) => ({ ...state, serverItems: values })),

// File System Items
loadingFileSystemItems: false,
setLoadingFileSystemItems: (value) =>
set((state) => ({ ...state, loadingFileSystemItems: value })),
setFileSystemItemsReady: (value) => set((state) => ({ ...state, fileSystemItemsReady: value })),
fileSystemItems: [],
setFileSystemItems: (values) => set((state) => ({ ...state, fileSystemItems: values })),
Expand Down
Loading