2022-11-28 02:00:28 +00:00
|
|
|
import { Plus, Trash2 } from 'lucide-react';
|
2022-09-21 04:49:42 +00:00
|
|
|
import { useRouter } from '@uirouter/react';
|
2022-11-22 12:16:34 +00:00
|
|
|
import { useStore } from 'zustand';
|
2022-09-21 04:49:42 +00:00
|
|
|
|
2022-11-13 08:10:18 +00:00
|
|
|
import { useEnvironmentId } from '@/react/hooks/useEnvironmentId';
|
2022-09-21 04:49:42 +00:00
|
|
|
import { useNamespaces } from '@/react/kubernetes/namespaces/queries';
|
2022-11-13 08:10:18 +00:00
|
|
|
import { useAuthorizations, Authorized } from '@/react/hooks/useUser';
|
2022-11-28 02:00:28 +00:00
|
|
|
import Route from '@/assets/ico/route.svg?c';
|
2022-09-21 04:49:42 +00:00
|
|
|
|
2023-02-14 08:19:41 +00:00
|
|
|
import { confirmDelete } from '@@/modals/confirm';
|
2022-09-21 04:49:42 +00:00
|
|
|
import { Datatable } from '@@/datatables';
|
|
|
|
import { Button } from '@@/buttons';
|
|
|
|
import { Link } from '@@/Link';
|
2022-11-22 12:16:34 +00:00
|
|
|
import { createPersistedStore } from '@@/datatables/types';
|
|
|
|
import { useSearchBarState } from '@@/datatables/SearchBar';
|
2022-09-21 04:49:42 +00:00
|
|
|
|
|
|
|
import { DeleteIngressesRequest, Ingress } from '../types';
|
|
|
|
import { useDeleteIngresses, useIngresses } from '../queries';
|
|
|
|
|
|
|
|
import { useColumns } from './columns';
|
|
|
|
|
|
|
|
import '../style.css';
|
|
|
|
|
|
|
|
interface SelectedIngress {
|
|
|
|
Namespace: string;
|
|
|
|
Name: string;
|
|
|
|
}
|
2022-11-22 12:16:34 +00:00
|
|
|
const storageKey = 'ingressClassesNameSpace';
|
2022-09-21 04:49:42 +00:00
|
|
|
|
2022-11-22 12:16:34 +00:00
|
|
|
const settingsStore = createPersistedStore(storageKey);
|
2022-09-21 04:49:42 +00:00
|
|
|
|
2022-11-22 12:16:34 +00:00
|
|
|
export function IngressDatatable() {
|
2022-09-21 04:49:42 +00:00
|
|
|
const environmentId = useEnvironmentId();
|
|
|
|
|
|
|
|
const nsResult = useNamespaces(environmentId);
|
2022-10-06 02:24:59 +00:00
|
|
|
const ingressesQuery = useIngresses(
|
|
|
|
environmentId,
|
|
|
|
Object.keys(nsResult?.data || {})
|
|
|
|
);
|
2022-09-21 04:49:42 +00:00
|
|
|
|
|
|
|
const columns = useColumns();
|
|
|
|
const deleteIngressesMutation = useDeleteIngresses();
|
2022-11-22 12:16:34 +00:00
|
|
|
const settings = useStore(settingsStore);
|
|
|
|
const [search, setSearch] = useSearchBarState(storageKey);
|
2022-09-21 04:49:42 +00:00
|
|
|
|
|
|
|
const router = useRouter();
|
|
|
|
|
|
|
|
return (
|
|
|
|
<Datatable
|
2022-10-06 02:24:59 +00:00
|
|
|
dataset={ingressesQuery.data || []}
|
2022-09-21 04:49:42 +00:00
|
|
|
columns={columns}
|
2022-10-06 02:24:59 +00:00
|
|
|
isLoading={ingressesQuery.isLoading}
|
2022-09-21 04:49:42 +00:00
|
|
|
emptyContentLabel="No supported ingresses found"
|
2022-11-22 12:16:34 +00:00
|
|
|
title="Ingresses"
|
2022-11-28 02:00:28 +00:00
|
|
|
titleIcon={Route}
|
2022-09-21 04:49:42 +00:00
|
|
|
getRowId={(row) => row.Name + row.Type + row.Namespace}
|
|
|
|
renderTableActions={tableActions}
|
2022-10-17 21:46:27 +00:00
|
|
|
disableSelect={useCheckboxes()}
|
2022-11-22 12:16:34 +00:00
|
|
|
initialPageSize={settings.pageSize}
|
|
|
|
onPageSizeChange={settings.setPageSize}
|
|
|
|
initialSortBy={settings.sortBy}
|
|
|
|
onSortByChange={settings.setSortBy}
|
|
|
|
searchValue={search}
|
|
|
|
onSearchChange={setSearch}
|
2022-09-21 04:49:42 +00:00
|
|
|
/>
|
|
|
|
);
|
|
|
|
|
|
|
|
function tableActions(selectedFlatRows: Ingress[]) {
|
|
|
|
return (
|
|
|
|
<div className="ingressDatatable-actions">
|
|
|
|
<Authorized authorizations="AzureContainerGroupDelete">
|
|
|
|
<Button
|
|
|
|
className="btn-wrapper"
|
|
|
|
color="dangerlight"
|
|
|
|
disabled={selectedFlatRows.length === 0}
|
2022-11-22 12:16:34 +00:00
|
|
|
onClick={() => handleRemoveClick(selectedFlatRows)}
|
2022-09-21 04:49:42 +00:00
|
|
|
icon={Trash2}
|
|
|
|
>
|
|
|
|
Remove
|
|
|
|
</Button>
|
|
|
|
</Authorized>
|
|
|
|
|
2022-10-17 21:46:27 +00:00
|
|
|
<Authorized authorizations="K8sIngressesW">
|
2022-12-01 06:40:52 +00:00
|
|
|
<Link
|
|
|
|
to="kubernetes.ingresses.create"
|
|
|
|
className="space-left no-decoration"
|
|
|
|
>
|
2022-09-21 04:49:42 +00:00
|
|
|
<Button
|
|
|
|
icon={Plus}
|
|
|
|
className="btn-wrapper vertical-center"
|
|
|
|
color="secondary"
|
|
|
|
>
|
|
|
|
Add with form
|
|
|
|
</Button>
|
|
|
|
</Link>
|
|
|
|
</Authorized>
|
2022-10-17 21:46:27 +00:00
|
|
|
<Authorized authorizations="K8sIngressesW">
|
2022-12-01 06:40:52 +00:00
|
|
|
<Link to="kubernetes.deploy" className="space-left no-decoration">
|
2022-09-21 04:49:42 +00:00
|
|
|
<Button icon={Plus} className="btn-wrapper">
|
|
|
|
Create from manifest
|
|
|
|
</Button>
|
|
|
|
</Link>
|
|
|
|
</Authorized>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2022-10-17 21:46:27 +00:00
|
|
|
function useCheckboxes() {
|
|
|
|
return !useAuthorizations(['K8sIngressesW']);
|
|
|
|
}
|
|
|
|
|
2022-09-21 04:49:42 +00:00
|
|
|
async function handleRemoveClick(ingresses: SelectedIngress[]) {
|
2023-02-14 08:19:41 +00:00
|
|
|
const confirmed = await confirmDelete(
|
2022-09-21 04:49:42 +00:00
|
|
|
'Are you sure you want to delete the selected ingresses?'
|
|
|
|
);
|
|
|
|
if (!confirmed) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
|
|
|
const payload: DeleteIngressesRequest = {} as DeleteIngressesRequest;
|
|
|
|
ingresses.forEach((ingress) => {
|
|
|
|
payload[ingress.Namespace] = payload[ingress.Namespace] || [];
|
|
|
|
payload[ingress.Namespace].push(ingress.Name);
|
|
|
|
});
|
|
|
|
|
|
|
|
deleteIngressesMutation.mutate(
|
|
|
|
{ environmentId, data: payload },
|
|
|
|
{
|
|
|
|
onSuccess: () => {
|
|
|
|
router.stateService.reload();
|
|
|
|
},
|
|
|
|
}
|
|
|
|
);
|
|
|
|
return ingresses;
|
|
|
|
}
|
|
|
|
}
|