@cobaltcore-dev/aurora 0.2.2 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client/AuroraApp.d.ts +10 -0
- package/dist/client/{ContentHeader-DtBiIwRY.mjs → ContentHeader-BXZoN3B9.mjs} +15 -15
- package/dist/client/{ContentHeader-DtBiIwRY.mjs.map → ContentHeader-BXZoN3B9.mjs.map} +1 -1
- package/dist/client/{DeleteFlavorModal-rmuYIafD.mjs → DeleteFlavorModal-BusYn32r.mjs} +148 -148
- package/dist/client/{DeleteFlavorModal-rmuYIafD.mjs.map → DeleteFlavorModal-BusYn32r.mjs.map} +1 -1
- package/dist/client/{EditSecurityGroupModal-B7Sz9puM.mjs → EditSecurityGroupModal-Dl6m7wUe.mjs} +16 -16
- package/dist/client/{EditSecurityGroupModal-B7Sz9puM.mjs.map → EditSecurityGroupModal-Dl6m7wUe.mjs.map} +1 -1
- package/dist/client/FiltersInput-BgNaHFBt.mjs +81 -0
- package/dist/client/FiltersInput-BgNaHFBt.mjs.map +1 -0
- package/dist/client/{FloatingIpActionModals-CfRJiZqD.mjs → FloatingIpActionModals-By2hXR9m.mjs} +51 -51
- package/dist/client/{FloatingIpActionModals-CfRJiZqD.mjs.map → FloatingIpActionModals-By2hXR9m.mjs.map} +1 -1
- package/dist/client/{ImageToastNotifications-Cw30RXsw.mjs → ImageToastNotifications-fHI8jB2j.mjs} +369 -369
- package/dist/client/{ImageToastNotifications-Cw30RXsw.mjs.map → ImageToastNotifications-fHI8jB2j.mjs.map} +1 -1
- package/dist/client/ListToolbar-BvtCo8dk.mjs +129 -0
- package/dist/client/ListToolbar-BvtCo8dk.mjs.map +1 -0
- package/dist/client/{RouteError-Cyto623-.mjs → RouteError-pDEWC_k7.mjs} +2 -2
- package/dist/client/{RouteError-Cyto623-.mjs.map → RouteError-pDEWC_k7.mjs.map} +1 -1
- package/dist/client/SortInput-DXWSqSny.mjs +34 -0
- package/dist/client/SortInput-DXWSqSny.mjs.map +1 -0
- package/dist/client/{_flavorId-B-1fYadl.mjs → _flavorId-BRonXvCo.mjs} +46 -46
- package/dist/client/_flavorId-BRonXvCo.mjs.map +1 -0
- package/dist/client/{_flavorId-BYfIHIV_.mjs → _flavorId-BoNcxYmF.mjs} +10 -10
- package/dist/client/_flavorId-BoNcxYmF.mjs.map +1 -0
- package/dist/client/_floatingIpId-BpUfL8Im2.mjs +228 -0
- package/dist/client/_floatingIpId-BpUfL8Im2.mjs.map +1 -0
- package/dist/client/{_floatingIpId-IrnN-ozB.mjs → _floatingIpId-CwHiXazi.mjs} +2 -2
- package/dist/client/{_floatingIpId-IrnN-ozB.mjs.map → _floatingIpId-CwHiXazi.mjs.map} +1 -1
- package/dist/client/{_imageId-Tx_9bqEc.mjs → _imageId-CdOOJjw0.mjs} +158 -158
- package/dist/client/_imageId-CdOOJjw0.mjs.map +1 -0
- package/dist/client/{_pcaId-CFuKY82d.mjs → _pcaId-CwlH1Kvl.mjs} +132 -132
- package/dist/client/{_pcaId-CFuKY82d.mjs.map → _pcaId-CwlH1Kvl.mjs.map} +1 -1
- package/dist/client/{_pcaId-Bck7S7gJ.mjs → _pcaId-D1ZEaCdp.mjs} +2 -2
- package/dist/client/{_pcaId-Bck7S7gJ.mjs.map → _pcaId-D1ZEaCdp.mjs.map} +1 -1
- package/dist/client/_projectId-D1gGribM.mjs +316 -0
- package/dist/client/_projectId-D1gGribM.mjs.map +1 -0
- package/dist/client/{_projectId-PSpuCKO7.mjs → _projectId-DhLpIalx.mjs} +9 -9
- package/dist/client/{_projectId-PSpuCKO7.mjs.map → _projectId-DhLpIalx.mjs.map} +1 -1
- package/dist/client/{_projectId-B1VjDd0Z.mjs → _projectId-Dj_InfSc.mjs} +3 -3
- package/dist/client/{_projectId-B1VjDd0Z.mjs.map → _projectId-Dj_InfSc.mjs.map} +1 -1
- package/dist/client/{_projectId-Pxp-RXK4.mjs → _projectId-OW2xkK43.mjs} +2 -2
- package/dist/client/{_projectId-Pxp-RXK4.mjs.map → _projectId-OW2xkK43.mjs.map} +1 -1
- package/dist/client/{_securityGroupId-VV2lUcGQ.mjs → _securityGroupId-B0llWH9A.mjs} +2 -2
- package/dist/client/{_securityGroupId-VV2lUcGQ.mjs.map → _securityGroupId-B0llWH9A.mjs.map} +1 -1
- package/dist/client/{_securityGroupId-Dqi6ddw4.mjs → _securityGroupId-gbUnd5Wv.mjs} +363 -363
- package/dist/client/{_securityGroupId-Dqi6ddw4.mjs.map → _securityGroupId-gbUnd5Wv.mjs.map} +1 -1
- package/dist/client/{about-B2AzqxFI.mjs → about-DCe6LsKz.mjs} +8 -8
- package/dist/client/{about-B2AzqxFI.mjs.map → about-DCe6LsKz.mjs.map} +1 -1
- package/dist/client/{build-Cf7iWbpH.mjs → build-BJDfnAyi.mjs} +1573 -1564
- package/dist/client/{build-Cf7iWbpH.mjs.map → build-BJDfnAyi.mjs.map} +1 -1
- package/dist/client/{buildFilterParams-ngVK3ybs.mjs → buildFilterParams-By33pG59.mjs} +1 -1
- package/dist/client/{buildFilterParams-ngVK3ybs.mjs.map → buildFilterParams-By33pG59.mjs.map} +1 -1
- package/dist/client/{constants-CCgR6fKI.mjs → constants-CAjjRTo_.mjs} +9 -9
- package/dist/client/{constants-CCgR6fKI.mjs.map → constants-CAjjRTo_.mjs.map} +1 -1
- package/dist/client/{containers-BWERuY0O.mjs → containers-BuXUVb1N.mjs} +811 -811
- package/dist/client/{containers-BWERuY0O.mjs.map → containers-BuXUVb1N.mjs.map} +1 -1
- package/dist/client/{containers-Cs5vOeR2.mjs → containers-Ca5V1EBS.mjs} +1 -1
- package/dist/client/containers-Ca5V1EBS.mjs.map +1 -0
- package/dist/client/{containers-DovytjVP.mjs → containers-NW7RnHTI.mjs} +6 -6
- package/dist/client/containers-NW7RnHTI.mjs.map +1 -0
- package/dist/client/flavors-BXPYAFyQ.mjs.map +1 -1
- package/dist/client/{flavors-CUiALHcB.mjs → flavors-D8oElC2K.mjs} +2 -2
- package/dist/client/{flavors-CUiALHcB.mjs.map → flavors-D8oElC2K.mjs.map} +1 -1
- package/dist/client/flavors-qvgPSI7J.mjs +613 -0
- package/dist/client/flavors-qvgPSI7J.mjs.map +1 -0
- package/dist/client/{floatingips-BrjDiY2t.mjs → floatingips-Be3zLoaD.mjs} +126 -126
- package/dist/client/{floatingips-BrjDiY2t.mjs.map → floatingips-Be3zLoaD.mjs.map} +1 -1
- package/dist/client/{images-BZP3pBqj.mjs → images-BiEBENaj.mjs} +2 -2
- package/dist/client/{images-BZP3pBqj.mjs.map → images-BiEBENaj.mjs.map} +1 -1
- package/dist/client/images-CCYBAphP2.mjs +1900 -0
- package/dist/client/images-CCYBAphP2.mjs.map +1 -0
- package/dist/client/images-DM9I8G0p.mjs.map +1 -1
- package/dist/client/index.d.ts +2 -1
- package/dist/client/index.js +410 -412
- package/dist/client/index.js.map +1 -1
- package/dist/client/{network-SCVadZsv.mjs → network-nbSbl0X0.mjs} +1 -1
- package/dist/client/{network-SCVadZsv.mjs.map → network-nbSbl0X0.mjs.map} +1 -1
- package/dist/client/{objects-D4zBka5e.mjs → objects-CU5ws07o.mjs} +6 -6
- package/dist/client/objects-CU5ws07o.mjs.map +1 -0
- package/dist/client/objects-FXN0VWLI.mjs +4760 -0
- package/dist/client/{objects-Cw4Vu01M.mjs.map → objects-FXN0VWLI.mjs.map} +1 -1
- package/dist/client/{objects-B4yrYf_a.mjs → objects-GmuIOaHd.mjs} +1 -1
- package/dist/client/objects-GmuIOaHd.mjs.map +1 -0
- package/dist/client/{overview-BtIXpYBo.mjs → overview-B3gdnWTG.mjs} +2 -2
- package/dist/client/{overview-BtIXpYBo.mjs.map → overview-B3gdnWTG.mjs.map} +1 -1
- package/dist/client/{overview-2J54-loz.mjs → overview-DzYBiNfD.mjs} +2 -2
- package/dist/client/{overview-2J54-loz.mjs.map → overview-DzYBiNfD.mjs.map} +1 -1
- package/dist/client/{overview-D0AAvsmL.mjs → overview-EhfPY8Je.mjs} +2 -2
- package/dist/client/{overview-D0AAvsmL.mjs.map → overview-EhfPY8Je.mjs.map} +1 -1
- package/dist/client/{overview-BnmukbFh.mjs → overview-XueZI4LQ.mjs} +7 -7
- package/dist/client/{overview-BnmukbFh.mjs.map → overview-XueZI4LQ.mjs.map} +1 -1
- package/dist/client/{pca-BqZycwCu.mjs → pca-DSM71LhW.mjs} +2 -2
- package/dist/client/{pca-BqZycwCu.mjs.map → pca-DSM71LhW.mjs.map} +1 -1
- package/dist/client/{pca-V2aaOxZA.mjs → pca-x9if8xU-.mjs} +59 -59
- package/dist/client/{pca-V2aaOxZA.mjs.map → pca-x9if8xU-.mjs.map} +1 -1
- package/dist/client/{projects-jyIHL6DE.mjs → projects-B6BPo2Ar.mjs} +2 -2
- package/dist/client/projects-B6BPo2Ar.mjs.map +1 -0
- package/dist/client/{projects-BsN4bvU2.mjs → projects-BilrmHLu.mjs} +1 -1
- package/dist/client/projects-BilrmHLu.mjs.map +1 -0
- package/dist/client/{projects-0feOw_b6.mjs → projects-Bt0XptpG.mjs} +2 -2
- package/dist/client/projects-Bt0XptpG.mjs.map +1 -0
- package/dist/client/projects-CnmZIB2Q.mjs +95 -0
- package/dist/client/projects-CnmZIB2Q.mjs.map +1 -0
- package/dist/client/{securitygroups-B4MkSBtI.mjs → securitygroups-BdzieS7Z.mjs} +121 -121
- package/dist/client/{securitygroups-B4MkSBtI.mjs.map → securitygroups-BdzieS7Z.mjs.map} +1 -1
- package/dist/client/{useListWithFiltering-CEDh1LO-.mjs → useListWithFiltering-CqQbAjEe.mjs} +1 -1
- package/dist/client/{useListWithFiltering-CEDh1LO-.mjs.map → useListWithFiltering-CqQbAjEe.mjs.map} +1 -1
- package/package.json +2 -2
- package/dist/client/ListToolbar-DuazvsAu.mjs +0 -223
- package/dist/client/ListToolbar-DuazvsAu.mjs.map +0 -1
- package/dist/client/_flavorId-B-1fYadl.mjs.map +0 -1
- package/dist/client/_flavorId-BYfIHIV_.mjs.map +0 -1
- package/dist/client/_floatingIpId-FQ5P2qMV.mjs +0 -228
- package/dist/client/_floatingIpId-FQ5P2qMV.mjs.map +0 -1
- package/dist/client/_imageId-Tx_9bqEc.mjs.map +0 -1
- package/dist/client/_projectId-Bs4W9hos.mjs +0 -283
- package/dist/client/_projectId-Bs4W9hos.mjs.map +0 -1
- package/dist/client/containers-Cs5vOeR2.mjs.map +0 -1
- package/dist/client/containers-DovytjVP.mjs.map +0 -1
- package/dist/client/flavors-Bovz-I2U.mjs +0 -565
- package/dist/client/flavors-Bovz-I2U.mjs.map +0 -1
- package/dist/client/images-DaaCUXMI.mjs +0 -1797
- package/dist/client/images-DaaCUXMI.mjs.map +0 -1
- package/dist/client/objects-B4yrYf_a.mjs.map +0 -1
- package/dist/client/objects-Cw4Vu01M.mjs +0 -4760
- package/dist/client/objects-D4zBka5e.mjs.map +0 -1
- package/dist/client/projects-0feOw_b6.mjs.map +0 -1
- package/dist/client/projects-BsN4bvU2.mjs.map +0 -1
- package/dist/client/projects-C1IYOvFQ.mjs +0 -144
- package/dist/client/projects-C1IYOvFQ.mjs.map +0 -1
- package/dist/client/projects-jyIHL6DE.mjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"securitygroups-B4MkSBtI.mjs","names":["React","useState","Modal","Button","ModalFooter","ButtonRow","Message","TextInput","DeleteSecurityGroupDialog","isOpen","onClose","securityGroup","onDelete","isDeleting","error","useLingui","confirmationText","setConfirmationText","deleteWord","t","isDeleteEnabled","toLowerCase","securityGroupName","name","id","handleDelete","e","preventDefault","handleClose","open","onCancel","size","title","modalFooter","className","variant","onClick","disabled","data-testid","div","dismissible","p","strong","value","onChange","target","placeholder","autoComplete","DataGridCell","DataGridRow","PopupMenu","PopupMenuItem","PopupMenuOptions","SecurityGroupTableRow","securityGroup","sg","permissions","onEdit","onDelete","onViewDetails","isReadOnly","useLingui","BooleanValue","value","span","t","handleShowDetails","data-testid","id","onClick","className","div","p","name","description","shared","project_id","stateful","e","stopPropagation","label","canUpdate","canDelete","useState","useEffect","useRef","DataGrid","DataGridHeadCell","DataGridRow","Stack","Spinner","useNavigate","useProjectId","EditSecurityGroupModal","DeleteSecurityGroupDialog","SecurityGroupTableRow","SecurityGroupListContainer","securityGroups","isLoading","isError","error","permissions","onDeleteSecurityGroup","isDeletingSecurityGroup","deleteError","onUpdateSecurityGroup","isUpdatingSecurityGroup","updateError","currentProjectId","useLingui","navigate","projectId","selectedSecurityGroup","setSelectedSecurityGroup","editModalOpen","setEditModalOpen","deleteDialogOpen","setDeleteDialogOpen","prevIsDeletingRef","prevIsUpdatingRef","handleEdit","sg","handleDelete","handleViewDetails","to","params","securityGroupId","id","closeEditModal","closeDeleteDialog","deletionJustFinished","current","updateJustFinished","className","distribution","alignment","direction","variant","size","message","t","length","columns","map","label","isReadOnly","Boolean","project_id","securityGroup","onEdit","onDelete","onViewDetails","open","onClose","onUpdate","data","isOpen","isDeleting","React","useState","Modal","Form","FormRow","FormSection","TextInput","Checkbox","Button","ButtonRow","Spinner","ModalFooter","Textarea","Message","defaultSecurityGroupValues","name","description","stateful","CreateSecurityGroupModal","isOpen","onClose","onCreate","isLoading","error","useLingui","properties","setProperties","errors","setErrors","handleInputChange","e","value","type","target","checked","prev","newErrors","validateForm","trim","t","Object","keys","length","handleSubmit","preventDefault","securityGroupData","undefined","handleClose","open","onCancel","size","title","modalFooter","className","variant","onClick","disabled","data-testid","dismissible","div","span","id","label","onChange","required","errortext","placeholder","rows","useState","useNavigate","Button","trpcReact","ListToolbar","buildFilterParams","useListWithFiltering","useProjectId","SecurityGroupListContainer","CreateSecurityGroupModal","SECURITY_GROUP_SHARED","TRUE","FALSE","SecurityGroups","useLingui","navigate","projectId","createModalOpen","setCreateModalOpen","deleteError","setDeleteError","createError","setCreateError","updateError","setUpdateError","searchTerm","sortSettings","filterSettings","handleSearchChange","handleSortChange","handleFilterChange","defaultSortKey","defaultSortDir","sortOptions","label","t","value","filters","displayName","filterName","values","Object","supportsMultiValue","utils","useUtils","permissions","canCreate","canUpdate","canDelete","canManageAccess","data","securityGroups","isLoading","isError","error","network","securityGroup","list","useQuery","project_id","sort_key","sortBy","sort_dir","sortDirection","enabled","createSecurityGroupMutation","create","useMutation","onSuccess","createdSecurityGroup","invalidate","to","params","securityGroupId","id","onError","message","deleteSecurityGroupMutation","deleteById","updateSecurityGroupMutation","update","handleCreateSecurityGroup","securityGroupData","mutateAsync","handleDeleteSecurityGroup","mutate","handleUpdateSecurityGroup","div","className","onSort","onFilter","onSearch","actions","onClick","variant","onCreateClick","onDeleteSecurityGroup","isDeletingSecurityGroup","isPending","onUpdateSecurityGroup","isUpdatingSecurityGroup","currentProjectId","isOpen","onClose","onCreate","useLingui","SecurityGroups","ContentHeading","RouteComponent","t","component"],"sources":["../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/-modals/DeleteSecurityGroupDialog.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/SecurityGroupTableRow.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/SecurityGroupListContainer.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/-modals/CreateSecurityGroupModal.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/SecurityGroupsList.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/index.tsx?tsr-split=component"],"sourcesContent":["import React, { useState } from \"react\"\nimport { Modal, Button, ModalFooter, ButtonRow, Message, TextInput } from \"@cloudoperators/juno-ui-components\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport type { SecurityGroup } from \"@/server/Network/types/securityGroup\"\n\ninterface DeleteSecurityGroupDialogProps {\n isOpen: boolean\n securityGroup: SecurityGroup\n onClose: () => void\n onDelete: (securityGroupId: string) => void\n isDeleting?: boolean\n error?: string | null\n}\n\nexport const DeleteSecurityGroupDialog: React.FC<DeleteSecurityGroupDialogProps> = ({\n isOpen,\n onClose,\n securityGroup,\n onDelete,\n isDeleting = false,\n error = null,\n}) => {\n const { t } = useLingui()\n const [confirmationText, setConfirmationText] = useState(\"\")\n\n const deleteWord = t`delete`\n const isDeleteEnabled = confirmationText.toLowerCase() === deleteWord.toLowerCase()\n const securityGroupName = securityGroup.name || securityGroup.id\n\n const handleDelete = (e: React.MouseEvent<HTMLElement>) => {\n e.preventDefault()\n if (isDeleteEnabled && !isDeleting) {\n onDelete(securityGroup.id)\n }\n }\n\n const handleClose = () => {\n setConfirmationText(\"\")\n onClose()\n }\n\n return (\n <Modal\n open={isOpen}\n onCancel={handleClose}\n size=\"small\"\n title={t`Delete Security Group \"${securityGroupName}\"`}\n modalFooter={\n <ModalFooter className=\"flex justify-end\">\n <ButtonRow>\n <Button variant=\"default\" onClick={handleClose} disabled={isDeleting}>\n <Trans>Cancel</Trans>\n </Button>\n <Button\n variant=\"primary-danger\"\n onClick={handleDelete}\n disabled={!isDeleteEnabled || isDeleting}\n data-testid=\"confirm-delete-button\"\n >\n {isDeleting ? <Trans>Deleting...</Trans> : <Trans>Delete</Trans>}\n </Button>\n </ButtonRow>\n </ModalFooter>\n }\n >\n <div>\n {/* Error Message */}\n {error && (\n <Message dismissible={false} variant=\"error\" className=\"mt-4\">\n {error}\n </Message>\n )}\n\n {/* Warning */}\n <Trans>This action cannot be undone. The security group will be permanently deleted.</Trans>\n\n {/* Confirmation Input */}\n <div className=\"mt-4\">\n <p className=\"mb-2 text-sm\">\n <Trans>\n Type <strong>{deleteWord}</strong> to confirm:\n </Trans>\n </p>\n <TextInput\n id=\"confirmation\"\n name=\"confirmation\"\n value={confirmationText}\n onChange={(e) => setConfirmationText(e.target.value)}\n placeholder={deleteWord}\n disabled={isDeleting}\n autoComplete=\"off\"\n data-testid=\"delete-confirmation-input\"\n />\n </div>\n </div>\n </Modal>\n )\n}\n","import {\n DataGridCell,\n DataGridRow,\n PopupMenu,\n PopupMenuItem,\n PopupMenuOptions,\n} from \"@cloudoperators/juno-ui-components\"\nimport { useLingui, Trans } from \"@lingui/react/macro\"\nimport type { SecurityGroup } from \"@/server/Network/types/securityGroup\"\n\nexport interface SecurityGroupPermissions {\n canCreate: boolean\n canUpdate: boolean\n canDelete: boolean\n canManageAccess: boolean\n}\n\ninterface SecurityGroupTableRowProps {\n securityGroup: SecurityGroup\n permissions: SecurityGroupPermissions\n onEdit: (sg: SecurityGroup) => void\n onDelete: (sg: SecurityGroup) => void\n onViewDetails?: (sg: SecurityGroup) => void\n isReadOnly?: boolean\n}\n\nexport function SecurityGroupTableRow({\n securityGroup: sg,\n permissions,\n onEdit,\n onDelete,\n onViewDetails,\n isReadOnly = false,\n}: SecurityGroupTableRowProps) {\n const { t } = useLingui()\n\n const BooleanValue = ({ value }: { value: boolean | undefined }) => <span>{value ? t`Yes` : t`No`}</span>\n\n const handleShowDetails = () => {\n if (onViewDetails) {\n onViewDetails(sg)\n }\n }\n\n return (\n <DataGridRow\n key={sg.id}\n data-testid={`security-group-row-${sg.id}`}\n onClick={handleShowDetails}\n className=\"hover:bg-theme-background-lvl-2 cursor-pointer\"\n >\n <DataGridCell>\n <div>\n <p className=\"text-md\">{sg.name}</p>\n <p className=\"text-theme-light text-xs\">{sg.id}</p>\n </div>\n </DataGridCell>\n <DataGridCell>{sg.description || t`—`}</DataGridCell>\n <DataGridCell>\n <BooleanValue value={sg.shared} />\n {sg.shared && (\n <p>\n <Trans>Owner</Trans>: <span className=\"text-theme-light text-xs\">{sg.project_id}</span>\n </p>\n )}\n </DataGridCell>\n <DataGridCell>\n <BooleanValue value={sg.stateful} />\n </DataGridCell>\n <DataGridCell onClick={(e) => e.stopPropagation()} className=\"items-end justify-end pr-0\">\n <PopupMenu>\n <PopupMenuOptions>\n <PopupMenuItem label={t`Show Details`} onClick={() => handleShowDetails()} />\n {permissions.canUpdate && !isReadOnly && <PopupMenuItem label={t`Edit`} onClick={() => onEdit(sg)} />}\n {permissions.canDelete && !isReadOnly && <PopupMenuItem label={t`Delete`} onClick={() => onDelete(sg)} />}\n </PopupMenuOptions>\n </PopupMenu>\n </DataGridCell>\n </DataGridRow>\n )\n}\n","import { useState, useEffect, useRef } from \"react\"\nimport { DataGrid, DataGridHeadCell, DataGridRow, Stack, Spinner } from \"@cloudoperators/juno-ui-components\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport { useNavigate } from \"@tanstack/react-router\"\nimport { useProjectId } from \"@/client/hooks\"\nimport type { SecurityGroup } from \"@/server/Network/types/securityGroup\"\nimport type { UpdateSecurityGroupInput } from \"@/server/Network/types/securityGroup\"\nimport { EditSecurityGroupModal } from \"./-modals/EditSecurityGroupModal\"\nimport { DeleteSecurityGroupDialog } from \"./-modals/DeleteSecurityGroupDialog\"\nimport { SecurityGroupTableRow, type SecurityGroupPermissions } from \"./SecurityGroupTableRow\"\n\ninterface SecurityGroupListContainerProps {\n securityGroups: SecurityGroup[]\n isLoading: boolean\n isError: boolean\n error: { message?: string } | null\n permissions: SecurityGroupPermissions\n onCreateClick?: () => void\n onDeleteSecurityGroup?: (securityGroupId: string) => void\n isDeletingSecurityGroup?: boolean\n deleteError?: string | null\n onUpdateSecurityGroup?: (\n securityGroupId: string,\n data: Omit<UpdateSecurityGroupInput, \"securityGroupId\" | \"project_id\">\n ) => void\n isUpdatingSecurityGroup?: boolean\n updateError?: string | null\n currentProjectId?: string\n}\n\nexport const SecurityGroupListContainer = ({\n securityGroups,\n isLoading,\n isError,\n error,\n permissions,\n onDeleteSecurityGroup,\n isDeletingSecurityGroup = false,\n deleteError = null,\n onUpdateSecurityGroup,\n isUpdatingSecurityGroup = false,\n updateError = null,\n currentProjectId,\n}: SecurityGroupListContainerProps) => {\n const { t } = useLingui()\n const navigate = useNavigate()\n const projectId = useProjectId()\n const [selectedSecurityGroup, setSelectedSecurityGroup] = useState<SecurityGroup | null>(null)\n const [editModalOpen, setEditModalOpen] = useState(false)\n const [deleteDialogOpen, setDeleteDialogOpen] = useState(false)\n const prevIsDeletingRef = useRef<boolean>(false)\n const prevIsUpdatingRef = useRef<boolean>(false)\n\n const handleEdit = (sg: SecurityGroup) => {\n setSelectedSecurityGroup(sg)\n setEditModalOpen(true)\n }\n\n const handleDelete = (sg: SecurityGroup) => {\n setSelectedSecurityGroup(sg)\n setDeleteDialogOpen(true)\n }\n\n const handleViewDetails = (sg: SecurityGroup) => {\n navigate({\n to: \"/projects/$projectId/network/securitygroups/$securityGroupId\",\n params: { projectId, securityGroupId: sg.id },\n })\n }\n\n const closeEditModal = () => {\n setSelectedSecurityGroup(null)\n setEditModalOpen(false)\n }\n\n const closeDeleteDialog = () => {\n setSelectedSecurityGroup(null)\n setDeleteDialogOpen(false)\n }\n\n // Close delete dialog when deletion completes successfully\n useEffect(() => {\n // Check if deletion just finished (was deleting before, now not deleting)\n const deletionJustFinished = prevIsDeletingRef.current && !isDeletingSecurityGroup\n\n // Close dialog if deletion just finished and there's no error\n if (deletionJustFinished && deleteDialogOpen && !deleteError) {\n closeDeleteDialog()\n }\n\n // Update the ref for next render\n prevIsDeletingRef.current = isDeletingSecurityGroup\n }, [isDeletingSecurityGroup, deleteError, deleteDialogOpen])\n\n // Close edit modal when update completes successfully\n useEffect(() => {\n // Check if update just finished (was updating before, now not updating)\n const updateJustFinished = prevIsUpdatingRef.current && !isUpdatingSecurityGroup\n\n // Close modal if update just finished and there's no error\n if (updateJustFinished && editModalOpen && !updateError) {\n closeEditModal()\n }\n\n // Update the ref for next render\n prevIsUpdatingRef.current = isUpdatingSecurityGroup\n }, [isUpdatingSecurityGroup, updateError, editModalOpen])\n\n // Loading state\n if (isLoading) {\n return (\n <Stack className=\"py-8\" distribution=\"center\" alignment=\"center\" direction=\"vertical\">\n <Spinner variant=\"primary\" size=\"large\" className=\"mb-2\" />\n <Trans>Loading...</Trans>\n </Stack>\n )\n }\n\n // Error state\n if (isError) {\n return (\n <Stack className=\"py-8\" distribution=\"center\" alignment=\"center\" direction=\"vertical\">\n {error?.message ?? t`Failed to load security groups`}\n </Stack>\n )\n }\n\n // Empty state\n if (securityGroups.length === 0) {\n return <Trans>There are no groups</Trans>\n }\n\n return (\n <>\n <DataGrid columns={5}>\n <DataGridRow>\n {[t`Name`, t`Description`, t`Shared`, t`Stateful`, \"\"].map((label) => (\n <DataGridHeadCell key={label}>{label}</DataGridHeadCell>\n ))}\n </DataGridRow>\n {securityGroups.map((sg) => {\n // Compute isReadOnly only when the security group has an explicit project owner\n const isReadOnly = Boolean(currentProjectId && sg.project_id && sg.project_id !== currentProjectId)\n\n return (\n <SecurityGroupTableRow\n key={sg.id}\n securityGroup={sg}\n permissions={permissions}\n onEdit={handleEdit}\n onDelete={handleDelete}\n onViewDetails={handleViewDetails}\n isReadOnly={isReadOnly}\n />\n )\n })}\n </DataGrid>\n\n {selectedSecurityGroup && (\n <>\n <EditSecurityGroupModal\n securityGroup={selectedSecurityGroup}\n open={editModalOpen}\n onClose={closeEditModal}\n onUpdate={async (id, data) => {\n if (onUpdateSecurityGroup) {\n await onUpdateSecurityGroup(id, data)\n }\n }}\n isLoading={isUpdatingSecurityGroup}\n error={updateError}\n />\n <DeleteSecurityGroupDialog\n securityGroup={selectedSecurityGroup}\n isOpen={deleteDialogOpen}\n onClose={closeDeleteDialog}\n onDelete={(id) => {\n if (onDeleteSecurityGroup) {\n onDeleteSecurityGroup(id)\n }\n }}\n isDeleting={isDeletingSecurityGroup}\n error={deleteError}\n />\n </>\n )}\n </>\n )\n}\n","import React, { useState } from \"react\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport {\n Modal,\n Form,\n FormRow,\n FormSection,\n TextInput,\n Checkbox,\n Button,\n ButtonRow,\n Spinner,\n ModalFooter,\n Textarea,\n Message,\n} from \"@cloudoperators/juno-ui-components\"\nimport { CreateSecurityGroupInput } from \"@/server/Network/types/securityGroup\"\n\ninterface CreateSecurityGroupModalProps {\n isOpen: boolean\n onClose: () => void\n onCreate: (securityGroupData: Omit<CreateSecurityGroupInput, \"project_id\">) => Promise<void>\n isLoading?: boolean\n error?: string | null\n}\n\ninterface SecurityGroupProperties {\n name: string\n description: string\n stateful: boolean\n}\n\nconst defaultSecurityGroupValues: SecurityGroupProperties = {\n name: \"\",\n description: \"\",\n stateful: true,\n}\n\nexport const CreateSecurityGroupModal: React.FC<CreateSecurityGroupModalProps> = ({\n isOpen,\n onClose,\n onCreate,\n isLoading = false,\n error = null,\n}) => {\n const { t } = useLingui()\n\n const [properties, setProperties] = useState<SecurityGroupProperties>({ ...defaultSecurityGroupValues })\n const [errors, setErrors] = useState<{ [key: string]: string }>({})\n\n const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n const { name, value, type } = e.target\n const checked = (e.target as HTMLInputElement).checked\n\n setProperties((prev) => ({\n ...prev,\n [name]: type === \"checkbox\" ? checked : value,\n }))\n\n if (errors[name]) {\n setErrors((prev) => {\n const newErrors = { ...prev }\n delete newErrors[name]\n return newErrors\n })\n }\n }\n\n const validateForm = (): boolean => {\n const newErrors: { [key: string]: string } = {}\n\n if (!properties.name || properties.name.trim() === \"\") {\n newErrors.name = t`Security group name is required`\n }\n\n setErrors(newErrors)\n return Object.keys(newErrors).length === 0\n }\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault()\n\n if (!validateForm()) {\n return\n }\n\n const securityGroupData: Omit<CreateSecurityGroupInput, \"project_id\"> = {\n name: properties.name.trim(),\n description: properties.description.trim() || undefined,\n stateful: properties.stateful,\n }\n\n await onCreate(securityGroupData)\n handleClose()\n }\n\n const handleClose = () => {\n setProperties({ ...defaultSecurityGroupValues })\n setErrors({})\n onClose()\n }\n\n return (\n <Modal\n open={isOpen}\n onCancel={handleClose}\n size=\"large\"\n title={t`Create Security Group`}\n modalFooter={\n <ModalFooter className=\"flex justify-end\">\n <ButtonRow>\n <Button variant=\"default\" onClick={handleClose} disabled={isLoading}>\n <Trans>Cancel</Trans>\n </Button>\n <Button\n variant=\"primary\"\n onClick={(e) => {\n handleSubmit(e)\n }}\n disabled={isLoading}\n data-testid=\"create-security-group-button\"\n >\n {isLoading ? <Spinner size=\"small\" /> : <Trans>Create Security Group</Trans>}\n </Button>\n </ButtonRow>\n </ModalFooter>\n }\n >\n {/* Error Message */}\n {error && (\n <Message dismissible={false} variant=\"error\" className=\"mb-4\">\n {error}\n </Message>\n )}\n\n {isLoading && (\n <div className=\"mb-4 flex items-center justify-center gap-2\">\n <Spinner variant=\"primary\" />\n <span className=\"text-theme-high text-sm\">\n <Trans>Creating security group...</Trans>\n </span>\n </div>\n )}\n\n {!isLoading && (\n <Form className=\"mb-6\">\n <FormSection className=\"mb-6\">\n <FormRow className=\"mb-6\">\n <TextInput\n id=\"name\"\n name=\"name\"\n label={t`Name`}\n value={properties.name}\n onChange={handleInputChange}\n required\n errortext={errors.name}\n placeholder={t`Type name`}\n disabled={isLoading}\n />\n </FormRow>\n\n <FormRow className=\"mb-6\">\n <Textarea\n id=\"description\"\n name=\"description\"\n label={t`Description`}\n value={properties.description}\n onChange={handleInputChange}\n placeholder={t`Description`}\n disabled={isLoading}\n rows={3}\n />\n </FormRow>\n\n <FormRow className=\"mb-0\">\n <Checkbox\n id=\"stateful\"\n name=\"stateful\"\n label={t`Stateful`}\n checked={properties.stateful}\n onChange={handleInputChange}\n disabled={isLoading}\n />\n </FormRow>\n </FormSection>\n </Form>\n )}\n </Modal>\n )\n}\n","import { useState } from \"react\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport { useNavigate } from \"@tanstack/react-router\"\nimport { Button } from \"@cloudoperators/juno-ui-components\"\nimport { trpcReact } from \"@/client/trpcClient\"\nimport { ListToolbar } from \"@/client/components/ListToolbar\"\nimport { buildFilterParams } from \"@/client/utils/buildFilterParams\"\nimport { useListWithFiltering } from \"@/client/utils/useListWithFiltering\"\nimport { useProjectId } from \"@/client/hooks\"\nimport { SecurityGroupListContainer } from \"./SecurityGroupListContainer\"\nimport { CreateSecurityGroupModal } from \"./-modals/CreateSecurityGroupModal\"\nimport { CreateSecurityGroupInput, UpdateSecurityGroupInput } from \"@/server/Network/types/securityGroup\"\n\n// Security group shared filter constants\nconst SECURITY_GROUP_SHARED = {\n TRUE: \"true\",\n FALSE: \"false\",\n} as const\n\ntype SecurityGroupSortKey = \"name\" | \"project_id\"\n\nexport const SecurityGroups = () => {\n const { t } = useLingui()\n const navigate = useNavigate()\n const projectId = useProjectId()\n\n const [createModalOpen, setCreateModalOpen] = useState(false)\n const [deleteError, setDeleteError] = useState<string | null>(null)\n const [createError, setCreateError] = useState<string | null>(null)\n const [updateError, setUpdateError] = useState<string | null>(null)\n\n const { searchTerm, sortSettings, filterSettings, handleSearchChange, handleSortChange, handleFilterChange } =\n useListWithFiltering<SecurityGroupSortKey>({\n defaultSortKey: \"name\",\n defaultSortDir: \"asc\",\n sortOptions: [\n { label: t`Name`, value: \"name\" },\n { label: t`Project id`, value: \"project_id\" },\n ],\n filterSettings: {\n filters: [\n {\n displayName: t`Shared`,\n filterName: \"shared\",\n values: Object.values(SECURITY_GROUP_SHARED),\n supportsMultiValue: false,\n },\n ],\n },\n })\n\n const utils = trpcReact.useUtils()\n\n // TODO: replace with trpc.network.canUser when security group permissions are available\n const permissions = {\n canCreate: true,\n canUpdate: true,\n canDelete: true,\n canManageAccess: true,\n }\n\n const {\n data: securityGroups = [],\n isLoading,\n isError,\n error,\n } = trpcReact.network.securityGroup.list.useQuery(\n {\n project_id: projectId || \"\",\n sort_key: sortSettings.sortBy,\n sort_dir: sortSettings.sortDirection,\n ...buildFilterParams(filterSettings),\n ...(searchTerm ? { searchTerm } : {}),\n },\n {\n enabled: !!projectId,\n }\n )\n\n const createSecurityGroupMutation = trpcReact.network.securityGroup.create.useMutation({\n onSuccess: (createdSecurityGroup) => {\n // Invalidate and refetch the security groups list\n utils.network.securityGroup.list.invalidate()\n setCreateError(null)\n\n // Navigate to the details page of the newly created security group\n navigate({\n to: \"/projects/$projectId/network/securitygroups/$securityGroupId\",\n params: {\n projectId,\n securityGroupId: createdSecurityGroup.id,\n },\n })\n },\n onError: (error) => {\n // Backend handles error parsing, just display the message\n setCreateError(error.message || t`Failed to create security group`)\n },\n })\n\n const deleteSecurityGroupMutation = trpcReact.network.securityGroup.deleteById.useMutation({\n onSuccess: () => {\n // Invalidate and refetch the security groups list\n utils.network.securityGroup.list.invalidate()\n setDeleteError(null)\n },\n onError: (error) => {\n // Backend handles error parsing, just display the message\n setDeleteError(error.message || t`Failed to delete security group`)\n },\n })\n\n const updateSecurityGroupMutation = trpcReact.network.securityGroup.update.useMutation({\n onSuccess: () => {\n // Invalidate and refetch the security groups list\n utils.network.securityGroup.list.invalidate()\n setUpdateError(null)\n },\n onError: (error) => {\n // Backend handles error parsing, just display the message\n setUpdateError(error.message || t`Failed to update security group`)\n },\n })\n\n const handleCreateSecurityGroup = async (securityGroupData: Omit<CreateSecurityGroupInput, \"project_id\">) => {\n setCreateError(null)\n await createSecurityGroupMutation.mutateAsync({ project_id: projectId, ...securityGroupData })\n }\n\n const handleDeleteSecurityGroup = (securityGroupId: string) => {\n setDeleteError(null)\n deleteSecurityGroupMutation.mutate({ project_id: projectId, securityGroupId })\n }\n\n const handleUpdateSecurityGroup = async (\n securityGroupId: string,\n data: Omit<UpdateSecurityGroupInput, \"securityGroupId\" | \"project_id\">\n ) => {\n setUpdateError(null)\n await updateSecurityGroupMutation.mutateAsync({ project_id: projectId, securityGroupId, ...data })\n }\n\n return (\n <div className=\"relative\">\n <ListToolbar\n sortSettings={sortSettings}\n filterSettings={filterSettings}\n searchTerm={searchTerm}\n onSort={handleSortChange}\n onFilter={handleFilterChange}\n onSearch={handleSearchChange}\n actions={\n permissions.canCreate && (\n <Button onClick={() => setCreateModalOpen(true)} variant=\"primary\">\n <Trans>Create Security Group</Trans>\n </Button>\n )\n }\n />\n\n <SecurityGroupListContainer\n securityGroups={securityGroups}\n isLoading={isLoading}\n isError={isError}\n error={error}\n permissions={permissions}\n onCreateClick={() => setCreateModalOpen(true)}\n onDeleteSecurityGroup={handleDeleteSecurityGroup}\n isDeletingSecurityGroup={deleteSecurityGroupMutation.isPending}\n deleteError={deleteError}\n onUpdateSecurityGroup={handleUpdateSecurityGroup}\n isUpdatingSecurityGroup={updateSecurityGroupMutation.isPending}\n updateError={updateError}\n currentProjectId={projectId}\n />\n\n <CreateSecurityGroupModal\n isOpen={createModalOpen}\n onClose={() => setCreateModalOpen(false)}\n onCreate={handleCreateSecurityGroup}\n isLoading={createSecurityGroupMutation.isPending}\n error={createError}\n />\n </div>\n )\n}\n","import { createFileRoute } from \"@tanstack/react-router\"\nimport { t } from \"@lingui/core/macro\"\nimport { useLingui } from \"@lingui/react/macro\"\nimport { SecurityGroups } from \"./-components/SecurityGroupsList\"\nimport type { RouteInfo } from \"@/client/routes/routeInfo\"\nimport { ContentHeading } from \"@cloudoperators/juno-ui-components\"\n\nexport const Route = createFileRoute(\"/_auth/projects/$projectId/network/securitygroups/\")({\n staticData: {\n section: \"network\",\n service: \"securitygroups\",\n sectionCrumb: { labelKey: \"Network\" },\n crumb: { labelKey: \"Security Groups\" },\n } satisfies RouteInfo,\n head: () => ({ meta: [{ title: t`Security Groups` }] }),\n component: RouteComponent,\n})\n\nfunction RouteComponent() {\n const { t } = useLingui()\n return (\n <>\n <ContentHeading>{t`Security Groups`}</ContentHeading>\n <SecurityGroups />\n </>\n )\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"securitygroups-BdzieS7Z.mjs","names":["React","useState","Modal","Button","ModalFooter","ButtonRow","Message","TextInput","DeleteSecurityGroupDialog","isOpen","onClose","securityGroup","onDelete","isDeleting","error","useLingui","confirmationText","setConfirmationText","deleteWord","t","isDeleteEnabled","toLowerCase","securityGroupName","name","id","handleDelete","e","preventDefault","handleClose","open","onCancel","size","title","modalFooter","className","variant","onClick","disabled","data-testid","div","dismissible","p","strong","value","onChange","target","placeholder","autoComplete","DataGridCell","DataGridRow","PopupMenu","PopupMenuItem","PopupMenuOptions","SecurityGroupTableRow","securityGroup","sg","permissions","onEdit","onDelete","onViewDetails","isReadOnly","useLingui","BooleanValue","value","span","t","handleShowDetails","data-testid","id","onClick","className","div","p","name","description","shared","project_id","stateful","e","stopPropagation","label","canUpdate","canDelete","useState","useEffect","useRef","DataGrid","DataGridHeadCell","DataGridRow","Stack","Spinner","useNavigate","useProjectId","EditSecurityGroupModal","DeleteSecurityGroupDialog","SecurityGroupTableRow","SecurityGroupListContainer","securityGroups","isLoading","isError","error","permissions","onDeleteSecurityGroup","isDeletingSecurityGroup","deleteError","onUpdateSecurityGroup","isUpdatingSecurityGroup","updateError","currentProjectId","useLingui","navigate","projectId","selectedSecurityGroup","setSelectedSecurityGroup","editModalOpen","setEditModalOpen","deleteDialogOpen","setDeleteDialogOpen","prevIsDeletingRef","prevIsUpdatingRef","handleEdit","sg","handleDelete","handleViewDetails","to","params","securityGroupId","id","closeEditModal","closeDeleteDialog","deletionJustFinished","current","updateJustFinished","className","distribution","alignment","direction","variant","size","message","t","length","columns","map","label","isReadOnly","Boolean","project_id","securityGroup","onEdit","onDelete","onViewDetails","open","onClose","onUpdate","data","isOpen","isDeleting","React","useState","Modal","Form","FormRow","FormSection","TextInput","Checkbox","Button","ButtonRow","Spinner","ModalFooter","Textarea","Message","defaultSecurityGroupValues","name","description","stateful","CreateSecurityGroupModal","isOpen","onClose","onCreate","isLoading","error","useLingui","properties","setProperties","errors","setErrors","handleInputChange","e","value","type","target","checked","prev","newErrors","validateForm","trim","t","Object","keys","length","handleSubmit","preventDefault","securityGroupData","undefined","handleClose","open","onCancel","size","title","modalFooter","className","variant","onClick","disabled","data-testid","dismissible","div","span","id","label","onChange","required","errortext","placeholder","rows","useState","useNavigate","Button","trpcReact","ListToolbar","buildFilterParams","useListWithFiltering","useProjectId","SecurityGroupListContainer","CreateSecurityGroupModal","SECURITY_GROUP_SHARED","TRUE","FALSE","SecurityGroups","useLingui","navigate","projectId","createModalOpen","setCreateModalOpen","deleteError","setDeleteError","createError","setCreateError","updateError","setUpdateError","searchTerm","sortSettings","filterSettings","handleSearchChange","handleSortChange","handleFilterChange","defaultSortKey","defaultSortDir","sortOptions","label","t","value","filters","displayName","filterName","values","Object","supportsMultiValue","utils","useUtils","permissions","canCreate","canUpdate","canDelete","canManageAccess","data","securityGroups","isLoading","isError","error","network","securityGroup","list","useQuery","project_id","sort_key","sortBy","sort_dir","sortDirection","enabled","createSecurityGroupMutation","create","useMutation","onSuccess","createdSecurityGroup","invalidate","to","params","securityGroupId","id","onError","message","deleteSecurityGroupMutation","deleteById","updateSecurityGroupMutation","update","handleCreateSecurityGroup","securityGroupData","mutateAsync","handleDeleteSecurityGroup","mutate","handleUpdateSecurityGroup","div","className","onSort","onFilter","onSearch","actions","onClick","variant","onCreateClick","onDeleteSecurityGroup","isDeletingSecurityGroup","isPending","onUpdateSecurityGroup","isUpdatingSecurityGroup","currentProjectId","isOpen","onClose","onCreate","useLingui","SecurityGroups","ContentHeading","RouteComponent","t","component"],"sources":["../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/-modals/DeleteSecurityGroupDialog.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/SecurityGroupTableRow.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/SecurityGroupListContainer.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/-modals/CreateSecurityGroupModal.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/-components/SecurityGroupsList.tsx","../../src/client/routes/_auth/projects/$projectId/network/securitygroups/index.tsx?tsr-split=component"],"sourcesContent":["import React, { useState } from \"react\"\nimport { Modal, Button, ModalFooter, ButtonRow, Message, TextInput } from \"@cloudoperators/juno-ui-components\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport type { SecurityGroup } from \"@/server/Network/types/securityGroup\"\n\ninterface DeleteSecurityGroupDialogProps {\n isOpen: boolean\n securityGroup: SecurityGroup\n onClose: () => void\n onDelete: (securityGroupId: string) => void\n isDeleting?: boolean\n error?: string | null\n}\n\nexport const DeleteSecurityGroupDialog: React.FC<DeleteSecurityGroupDialogProps> = ({\n isOpen,\n onClose,\n securityGroup,\n onDelete,\n isDeleting = false,\n error = null,\n}) => {\n const { t } = useLingui()\n const [confirmationText, setConfirmationText] = useState(\"\")\n\n const deleteWord = t`delete`\n const isDeleteEnabled = confirmationText.toLowerCase() === deleteWord.toLowerCase()\n const securityGroupName = securityGroup.name || securityGroup.id\n\n const handleDelete = (e: React.MouseEvent<HTMLElement>) => {\n e.preventDefault()\n if (isDeleteEnabled && !isDeleting) {\n onDelete(securityGroup.id)\n }\n }\n\n const handleClose = () => {\n setConfirmationText(\"\")\n onClose()\n }\n\n return (\n <Modal\n open={isOpen}\n onCancel={handleClose}\n size=\"small\"\n title={t`Delete Security Group \"${securityGroupName}\"`}\n modalFooter={\n <ModalFooter className=\"flex justify-end\">\n <ButtonRow>\n <Button variant=\"default\" onClick={handleClose} disabled={isDeleting}>\n <Trans>Cancel</Trans>\n </Button>\n <Button\n variant=\"primary-danger\"\n onClick={handleDelete}\n disabled={!isDeleteEnabled || isDeleting}\n data-testid=\"confirm-delete-button\"\n >\n {isDeleting ? <Trans>Deleting...</Trans> : <Trans>Delete</Trans>}\n </Button>\n </ButtonRow>\n </ModalFooter>\n }\n >\n <div>\n {/* Error Message */}\n {error && (\n <Message dismissible={false} variant=\"error\" className=\"mt-4\">\n {error}\n </Message>\n )}\n\n {/* Warning */}\n <Trans>This action cannot be undone. The security group will be permanently deleted.</Trans>\n\n {/* Confirmation Input */}\n <div className=\"mt-4\">\n <p className=\"mb-2 text-sm\">\n <Trans>\n Type <strong>{deleteWord}</strong> to confirm:\n </Trans>\n </p>\n <TextInput\n id=\"confirmation\"\n name=\"confirmation\"\n value={confirmationText}\n onChange={(e) => setConfirmationText(e.target.value)}\n placeholder={deleteWord}\n disabled={isDeleting}\n autoComplete=\"off\"\n data-testid=\"delete-confirmation-input\"\n />\n </div>\n </div>\n </Modal>\n )\n}\n","import {\n DataGridCell,\n DataGridRow,\n PopupMenu,\n PopupMenuItem,\n PopupMenuOptions,\n} from \"@cloudoperators/juno-ui-components\"\nimport { useLingui, Trans } from \"@lingui/react/macro\"\nimport type { SecurityGroup } from \"@/server/Network/types/securityGroup\"\n\nexport interface SecurityGroupPermissions {\n canCreate: boolean\n canUpdate: boolean\n canDelete: boolean\n canManageAccess: boolean\n}\n\ninterface SecurityGroupTableRowProps {\n securityGroup: SecurityGroup\n permissions: SecurityGroupPermissions\n onEdit: (sg: SecurityGroup) => void\n onDelete: (sg: SecurityGroup) => void\n onViewDetails?: (sg: SecurityGroup) => void\n isReadOnly?: boolean\n}\n\nexport function SecurityGroupTableRow({\n securityGroup: sg,\n permissions,\n onEdit,\n onDelete,\n onViewDetails,\n isReadOnly = false,\n}: SecurityGroupTableRowProps) {\n const { t } = useLingui()\n\n const BooleanValue = ({ value }: { value: boolean | undefined }) => <span>{value ? t`Yes` : t`No`}</span>\n\n const handleShowDetails = () => {\n if (onViewDetails) {\n onViewDetails(sg)\n }\n }\n\n return (\n <DataGridRow\n key={sg.id}\n data-testid={`security-group-row-${sg.id}`}\n onClick={handleShowDetails}\n className=\"hover:bg-theme-background-lvl-2 cursor-pointer\"\n >\n <DataGridCell>\n <div>\n <p className=\"text-md\">{sg.name}</p>\n <p className=\"text-theme-light text-xs\">{sg.id}</p>\n </div>\n </DataGridCell>\n <DataGridCell>{sg.description || t`—`}</DataGridCell>\n <DataGridCell>\n <BooleanValue value={sg.shared} />\n {sg.shared && (\n <p>\n <Trans>Owner</Trans>: <span className=\"text-theme-light text-xs\">{sg.project_id}</span>\n </p>\n )}\n </DataGridCell>\n <DataGridCell>\n <BooleanValue value={sg.stateful} />\n </DataGridCell>\n <DataGridCell onClick={(e) => e.stopPropagation()} className=\"items-end justify-end pr-0\">\n <PopupMenu>\n <PopupMenuOptions>\n <PopupMenuItem label={t`Show Details`} onClick={() => handleShowDetails()} />\n {permissions.canUpdate && !isReadOnly && <PopupMenuItem label={t`Edit`} onClick={() => onEdit(sg)} />}\n {permissions.canDelete && !isReadOnly && <PopupMenuItem label={t`Delete`} onClick={() => onDelete(sg)} />}\n </PopupMenuOptions>\n </PopupMenu>\n </DataGridCell>\n </DataGridRow>\n )\n}\n","import { useState, useEffect, useRef } from \"react\"\nimport { DataGrid, DataGridHeadCell, DataGridRow, Stack, Spinner } from \"@cloudoperators/juno-ui-components\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport { useNavigate } from \"@tanstack/react-router\"\nimport { useProjectId } from \"@/client/hooks\"\nimport type { SecurityGroup } from \"@/server/Network/types/securityGroup\"\nimport type { UpdateSecurityGroupInput } from \"@/server/Network/types/securityGroup\"\nimport { EditSecurityGroupModal } from \"./-modals/EditSecurityGroupModal\"\nimport { DeleteSecurityGroupDialog } from \"./-modals/DeleteSecurityGroupDialog\"\nimport { SecurityGroupTableRow, type SecurityGroupPermissions } from \"./SecurityGroupTableRow\"\n\ninterface SecurityGroupListContainerProps {\n securityGroups: SecurityGroup[]\n isLoading: boolean\n isError: boolean\n error: { message?: string } | null\n permissions: SecurityGroupPermissions\n onCreateClick?: () => void\n onDeleteSecurityGroup?: (securityGroupId: string) => void\n isDeletingSecurityGroup?: boolean\n deleteError?: string | null\n onUpdateSecurityGroup?: (\n securityGroupId: string,\n data: Omit<UpdateSecurityGroupInput, \"securityGroupId\" | \"project_id\">\n ) => void\n isUpdatingSecurityGroup?: boolean\n updateError?: string | null\n currentProjectId?: string\n}\n\nexport const SecurityGroupListContainer = ({\n securityGroups,\n isLoading,\n isError,\n error,\n permissions,\n onDeleteSecurityGroup,\n isDeletingSecurityGroup = false,\n deleteError = null,\n onUpdateSecurityGroup,\n isUpdatingSecurityGroup = false,\n updateError = null,\n currentProjectId,\n}: SecurityGroupListContainerProps) => {\n const { t } = useLingui()\n const navigate = useNavigate()\n const projectId = useProjectId()\n const [selectedSecurityGroup, setSelectedSecurityGroup] = useState<SecurityGroup | null>(null)\n const [editModalOpen, setEditModalOpen] = useState(false)\n const [deleteDialogOpen, setDeleteDialogOpen] = useState(false)\n const prevIsDeletingRef = useRef<boolean>(false)\n const prevIsUpdatingRef = useRef<boolean>(false)\n\n const handleEdit = (sg: SecurityGroup) => {\n setSelectedSecurityGroup(sg)\n setEditModalOpen(true)\n }\n\n const handleDelete = (sg: SecurityGroup) => {\n setSelectedSecurityGroup(sg)\n setDeleteDialogOpen(true)\n }\n\n const handleViewDetails = (sg: SecurityGroup) => {\n navigate({\n to: \"/projects/$projectId/network/securitygroups/$securityGroupId\",\n params: { projectId, securityGroupId: sg.id },\n })\n }\n\n const closeEditModal = () => {\n setSelectedSecurityGroup(null)\n setEditModalOpen(false)\n }\n\n const closeDeleteDialog = () => {\n setSelectedSecurityGroup(null)\n setDeleteDialogOpen(false)\n }\n\n // Close delete dialog when deletion completes successfully\n useEffect(() => {\n // Check if deletion just finished (was deleting before, now not deleting)\n const deletionJustFinished = prevIsDeletingRef.current && !isDeletingSecurityGroup\n\n // Close dialog if deletion just finished and there's no error\n if (deletionJustFinished && deleteDialogOpen && !deleteError) {\n closeDeleteDialog()\n }\n\n // Update the ref for next render\n prevIsDeletingRef.current = isDeletingSecurityGroup\n }, [isDeletingSecurityGroup, deleteError, deleteDialogOpen])\n\n // Close edit modal when update completes successfully\n useEffect(() => {\n // Check if update just finished (was updating before, now not updating)\n const updateJustFinished = prevIsUpdatingRef.current && !isUpdatingSecurityGroup\n\n // Close modal if update just finished and there's no error\n if (updateJustFinished && editModalOpen && !updateError) {\n closeEditModal()\n }\n\n // Update the ref for next render\n prevIsUpdatingRef.current = isUpdatingSecurityGroup\n }, [isUpdatingSecurityGroup, updateError, editModalOpen])\n\n // Loading state\n if (isLoading) {\n return (\n <Stack className=\"py-8\" distribution=\"center\" alignment=\"center\" direction=\"vertical\">\n <Spinner variant=\"primary\" size=\"large\" className=\"mb-2\" />\n <Trans>Loading...</Trans>\n </Stack>\n )\n }\n\n // Error state\n if (isError) {\n return (\n <Stack className=\"py-8\" distribution=\"center\" alignment=\"center\" direction=\"vertical\">\n {error?.message ?? t`Failed to load security groups`}\n </Stack>\n )\n }\n\n // Empty state\n if (securityGroups.length === 0) {\n return <Trans>There are no groups</Trans>\n }\n\n return (\n <>\n <DataGrid columns={5}>\n <DataGridRow>\n {[t`Name`, t`Description`, t`Shared`, t`Stateful`, \"\"].map((label) => (\n <DataGridHeadCell key={label}>{label}</DataGridHeadCell>\n ))}\n </DataGridRow>\n {securityGroups.map((sg) => {\n // Compute isReadOnly only when the security group has an explicit project owner\n const isReadOnly = Boolean(currentProjectId && sg.project_id && sg.project_id !== currentProjectId)\n\n return (\n <SecurityGroupTableRow\n key={sg.id}\n securityGroup={sg}\n permissions={permissions}\n onEdit={handleEdit}\n onDelete={handleDelete}\n onViewDetails={handleViewDetails}\n isReadOnly={isReadOnly}\n />\n )\n })}\n </DataGrid>\n\n {selectedSecurityGroup && (\n <>\n <EditSecurityGroupModal\n securityGroup={selectedSecurityGroup}\n open={editModalOpen}\n onClose={closeEditModal}\n onUpdate={async (id, data) => {\n if (onUpdateSecurityGroup) {\n await onUpdateSecurityGroup(id, data)\n }\n }}\n isLoading={isUpdatingSecurityGroup}\n error={updateError}\n />\n <DeleteSecurityGroupDialog\n securityGroup={selectedSecurityGroup}\n isOpen={deleteDialogOpen}\n onClose={closeDeleteDialog}\n onDelete={(id) => {\n if (onDeleteSecurityGroup) {\n onDeleteSecurityGroup(id)\n }\n }}\n isDeleting={isDeletingSecurityGroup}\n error={deleteError}\n />\n </>\n )}\n </>\n )\n}\n","import React, { useState } from \"react\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport {\n Modal,\n Form,\n FormRow,\n FormSection,\n TextInput,\n Checkbox,\n Button,\n ButtonRow,\n Spinner,\n ModalFooter,\n Textarea,\n Message,\n} from \"@cloudoperators/juno-ui-components\"\nimport { CreateSecurityGroupInput } from \"@/server/Network/types/securityGroup\"\n\ninterface CreateSecurityGroupModalProps {\n isOpen: boolean\n onClose: () => void\n onCreate: (securityGroupData: Omit<CreateSecurityGroupInput, \"project_id\">) => Promise<void>\n isLoading?: boolean\n error?: string | null\n}\n\ninterface SecurityGroupProperties {\n name: string\n description: string\n stateful: boolean\n}\n\nconst defaultSecurityGroupValues: SecurityGroupProperties = {\n name: \"\",\n description: \"\",\n stateful: true,\n}\n\nexport const CreateSecurityGroupModal: React.FC<CreateSecurityGroupModalProps> = ({\n isOpen,\n onClose,\n onCreate,\n isLoading = false,\n error = null,\n}) => {\n const { t } = useLingui()\n\n const [properties, setProperties] = useState<SecurityGroupProperties>({ ...defaultSecurityGroupValues })\n const [errors, setErrors] = useState<{ [key: string]: string }>({})\n\n const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n const { name, value, type } = e.target\n const checked = (e.target as HTMLInputElement).checked\n\n setProperties((prev) => ({\n ...prev,\n [name]: type === \"checkbox\" ? checked : value,\n }))\n\n if (errors[name]) {\n setErrors((prev) => {\n const newErrors = { ...prev }\n delete newErrors[name]\n return newErrors\n })\n }\n }\n\n const validateForm = (): boolean => {\n const newErrors: { [key: string]: string } = {}\n\n if (!properties.name || properties.name.trim() === \"\") {\n newErrors.name = t`Security group name is required`\n }\n\n setErrors(newErrors)\n return Object.keys(newErrors).length === 0\n }\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault()\n\n if (!validateForm()) {\n return\n }\n\n const securityGroupData: Omit<CreateSecurityGroupInput, \"project_id\"> = {\n name: properties.name.trim(),\n description: properties.description.trim() || undefined,\n stateful: properties.stateful,\n }\n\n await onCreate(securityGroupData)\n handleClose()\n }\n\n const handleClose = () => {\n setProperties({ ...defaultSecurityGroupValues })\n setErrors({})\n onClose()\n }\n\n return (\n <Modal\n open={isOpen}\n onCancel={handleClose}\n size=\"large\"\n title={t`Create Security Group`}\n modalFooter={\n <ModalFooter className=\"flex justify-end\">\n <ButtonRow>\n <Button variant=\"default\" onClick={handleClose} disabled={isLoading}>\n <Trans>Cancel</Trans>\n </Button>\n <Button\n variant=\"primary\"\n onClick={(e) => {\n handleSubmit(e)\n }}\n disabled={isLoading}\n data-testid=\"create-security-group-button\"\n >\n {isLoading ? <Spinner size=\"small\" /> : <Trans>Create Security Group</Trans>}\n </Button>\n </ButtonRow>\n </ModalFooter>\n }\n >\n {/* Error Message */}\n {error && (\n <Message dismissible={false} variant=\"error\" className=\"mb-4\">\n {error}\n </Message>\n )}\n\n {isLoading && (\n <div className=\"mb-4 flex items-center justify-center gap-2\">\n <Spinner variant=\"primary\" />\n <span className=\"text-theme-high text-sm\">\n <Trans>Creating security group...</Trans>\n </span>\n </div>\n )}\n\n {!isLoading && (\n <Form className=\"mb-6\">\n <FormSection className=\"mb-6\">\n <FormRow className=\"mb-6\">\n <TextInput\n id=\"name\"\n name=\"name\"\n label={t`Name`}\n value={properties.name}\n onChange={handleInputChange}\n required\n errortext={errors.name}\n placeholder={t`Type name`}\n disabled={isLoading}\n />\n </FormRow>\n\n <FormRow className=\"mb-6\">\n <Textarea\n id=\"description\"\n name=\"description\"\n label={t`Description`}\n value={properties.description}\n onChange={handleInputChange}\n placeholder={t`Description`}\n disabled={isLoading}\n rows={3}\n />\n </FormRow>\n\n <FormRow className=\"mb-0\">\n <Checkbox\n id=\"stateful\"\n name=\"stateful\"\n label={t`Stateful`}\n checked={properties.stateful}\n onChange={handleInputChange}\n disabled={isLoading}\n />\n </FormRow>\n </FormSection>\n </Form>\n )}\n </Modal>\n )\n}\n","import { useState } from \"react\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport { useNavigate } from \"@tanstack/react-router\"\nimport { Button } from \"@cloudoperators/juno-ui-components\"\nimport { trpcReact } from \"@/client/trpcClient\"\nimport { ListToolbar } from \"@/client/components/ListToolbar\"\nimport { buildFilterParams } from \"@/client/utils/buildFilterParams\"\nimport { useListWithFiltering } from \"@/client/utils/useListWithFiltering\"\nimport { useProjectId } from \"@/client/hooks\"\nimport { SecurityGroupListContainer } from \"./SecurityGroupListContainer\"\nimport { CreateSecurityGroupModal } from \"./-modals/CreateSecurityGroupModal\"\nimport { CreateSecurityGroupInput, UpdateSecurityGroupInput } from \"@/server/Network/types/securityGroup\"\n\n// Security group shared filter constants\nconst SECURITY_GROUP_SHARED = {\n TRUE: \"true\",\n FALSE: \"false\",\n} as const\n\ntype SecurityGroupSortKey = \"name\" | \"project_id\"\n\nexport const SecurityGroups = () => {\n const { t } = useLingui()\n const navigate = useNavigate()\n const projectId = useProjectId()\n\n const [createModalOpen, setCreateModalOpen] = useState(false)\n const [deleteError, setDeleteError] = useState<string | null>(null)\n const [createError, setCreateError] = useState<string | null>(null)\n const [updateError, setUpdateError] = useState<string | null>(null)\n\n const { searchTerm, sortSettings, filterSettings, handleSearchChange, handleSortChange, handleFilterChange } =\n useListWithFiltering<SecurityGroupSortKey>({\n defaultSortKey: \"name\",\n defaultSortDir: \"asc\",\n sortOptions: [\n { label: t`Name`, value: \"name\" },\n { label: t`Project id`, value: \"project_id\" },\n ],\n filterSettings: {\n filters: [\n {\n displayName: t`Shared`,\n filterName: \"shared\",\n values: Object.values(SECURITY_GROUP_SHARED),\n supportsMultiValue: false,\n },\n ],\n },\n })\n\n const utils = trpcReact.useUtils()\n\n // TODO: replace with trpc.network.canUser when security group permissions are available\n const permissions = {\n canCreate: true,\n canUpdate: true,\n canDelete: true,\n canManageAccess: true,\n }\n\n const {\n data: securityGroups = [],\n isLoading,\n isError,\n error,\n } = trpcReact.network.securityGroup.list.useQuery(\n {\n project_id: projectId || \"\",\n sort_key: sortSettings.sortBy,\n sort_dir: sortSettings.sortDirection,\n ...buildFilterParams(filterSettings),\n ...(searchTerm ? { searchTerm } : {}),\n },\n {\n enabled: !!projectId,\n }\n )\n\n const createSecurityGroupMutation = trpcReact.network.securityGroup.create.useMutation({\n onSuccess: (createdSecurityGroup) => {\n // Invalidate and refetch the security groups list\n utils.network.securityGroup.list.invalidate()\n setCreateError(null)\n\n // Navigate to the details page of the newly created security group\n navigate({\n to: \"/projects/$projectId/network/securitygroups/$securityGroupId\",\n params: {\n projectId,\n securityGroupId: createdSecurityGroup.id,\n },\n })\n },\n onError: (error) => {\n // Backend handles error parsing, just display the message\n setCreateError(error.message || t`Failed to create security group`)\n },\n })\n\n const deleteSecurityGroupMutation = trpcReact.network.securityGroup.deleteById.useMutation({\n onSuccess: () => {\n // Invalidate and refetch the security groups list\n utils.network.securityGroup.list.invalidate()\n setDeleteError(null)\n },\n onError: (error) => {\n // Backend handles error parsing, just display the message\n setDeleteError(error.message || t`Failed to delete security group`)\n },\n })\n\n const updateSecurityGroupMutation = trpcReact.network.securityGroup.update.useMutation({\n onSuccess: () => {\n // Invalidate and refetch the security groups list\n utils.network.securityGroup.list.invalidate()\n setUpdateError(null)\n },\n onError: (error) => {\n // Backend handles error parsing, just display the message\n setUpdateError(error.message || t`Failed to update security group`)\n },\n })\n\n const handleCreateSecurityGroup = async (securityGroupData: Omit<CreateSecurityGroupInput, \"project_id\">) => {\n setCreateError(null)\n await createSecurityGroupMutation.mutateAsync({ project_id: projectId, ...securityGroupData })\n }\n\n const handleDeleteSecurityGroup = (securityGroupId: string) => {\n setDeleteError(null)\n deleteSecurityGroupMutation.mutate({ project_id: projectId, securityGroupId })\n }\n\n const handleUpdateSecurityGroup = async (\n securityGroupId: string,\n data: Omit<UpdateSecurityGroupInput, \"securityGroupId\" | \"project_id\">\n ) => {\n setUpdateError(null)\n await updateSecurityGroupMutation.mutateAsync({ project_id: projectId, securityGroupId, ...data })\n }\n\n return (\n <div className=\"relative\">\n <ListToolbar\n sortSettings={sortSettings}\n filterSettings={filterSettings}\n searchTerm={searchTerm}\n onSort={handleSortChange}\n onFilter={handleFilterChange}\n onSearch={handleSearchChange}\n actions={\n permissions.canCreate && (\n <Button onClick={() => setCreateModalOpen(true)} variant=\"primary\">\n <Trans>Create Security Group</Trans>\n </Button>\n )\n }\n />\n\n <SecurityGroupListContainer\n securityGroups={securityGroups}\n isLoading={isLoading}\n isError={isError}\n error={error}\n permissions={permissions}\n onCreateClick={() => setCreateModalOpen(true)}\n onDeleteSecurityGroup={handleDeleteSecurityGroup}\n isDeletingSecurityGroup={deleteSecurityGroupMutation.isPending}\n deleteError={deleteError}\n onUpdateSecurityGroup={handleUpdateSecurityGroup}\n isUpdatingSecurityGroup={updateSecurityGroupMutation.isPending}\n updateError={updateError}\n currentProjectId={projectId}\n />\n\n <CreateSecurityGroupModal\n isOpen={createModalOpen}\n onClose={() => setCreateModalOpen(false)}\n onCreate={handleCreateSecurityGroup}\n isLoading={createSecurityGroupMutation.isPending}\n error={createError}\n />\n </div>\n )\n}\n","import { createFileRoute } from \"@tanstack/react-router\"\nimport { t } from \"@lingui/core/macro\"\nimport { useLingui } from \"@lingui/react/macro\"\nimport { SecurityGroups } from \"./-components/SecurityGroupsList\"\nimport type { RouteInfo } from \"@/client/routes/routeInfo\"\nimport { ContentHeading } from \"@cloudoperators/juno-ui-components\"\n\nexport const Route = createFileRoute(\"/_auth/projects/$projectId/network/securitygroups/\")({\n staticData: {\n section: \"network\",\n service: \"securitygroups\",\n sectionCrumb: { labelKey: \"Network\" },\n crumb: { labelKey: \"Security Groups\" },\n } satisfies RouteInfo,\n head: () => ({ meta: [{ title: t`Security Groups` }] }),\n component: RouteComponent,\n})\n\nfunction RouteComponent() {\n const { t } = useLingui()\n return (\n <>\n <ContentHeading>{t`Security Groups`}</ContentHeading>\n <SecurityGroups />\n </>\n )\n}\n"],"mappings":"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"}
|
package/dist/client/{useListWithFiltering-CEDh1LO-.mjs.map → useListWithFiltering-CqQbAjEe.mjs.map}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useListWithFiltering-
|
|
1
|
+
{"version":3,"file":"useListWithFiltering-CqQbAjEe.mjs","names":["startTransition","useState","useListWithFiltering","defaultSortKey","defaultSortDir","sortOptions","filterSettings","initialFilterSettings","searchTerm","setSearchTerm","handleSearchChange","term","searchValue","sortSettings","setSortSettings","options","sortBy","sortDirection","handleSortChange","newSortSettings","settings","toString","setFilterSettings","handleFilterChange","newFilterSettings"],"sources":["../../src/client/utils/useListWithFiltering.ts"],"sourcesContent":["import { startTransition, useState } from \"react\"\nimport { FilterSettings, SortOption, SortSettings } from \"@/client/components/ListToolbar/types\"\n\n/**\n * Sort direction enumeration\n * Used across all sort-enabled list views\n */\nexport type SortDirection = \"asc\" | \"desc\"\n\n/**\n * Generic required sort settings with guaranteed non-optional properties\n * Used by components to maintain a fully-defined sort state\n *\n * Type parameter K is the sort key type (string literal union of allowed sort fields)\n *\n * @example\n * // For floating IPs\n * type FloatingIpListSortSettings = ListSortConfig<FloatingIpsSortKey>\n *\n * // For security groups\n * type SecurityGroupListSortSettings = ListSortConfig<\"name\" | \"project_id\">\n */\nexport type ListSortConfig<T extends string = string> = {\n /**\n * Array of available sort options to display in the UI\n */\n options: SortOption[]\n /**\n * The currently selected sort field (guaranteed to be one of the available options)\n */\n sortBy: T\n /**\n * The currently active sort direction (guaranteed to be either \"asc\" or \"desc\")\n */\n sortDirection: SortDirection\n}\n\n/**\n * Configuration options for the useListWithFiltering hook\n */\nexport interface UseListWithFilteringOptions<T extends string> {\n /** Default sort key to use on initial render */\n defaultSortKey: T\n /** Default sort direction to use on initial render */\n defaultSortDir: SortDirection\n /** Available sort options to display in the sort dropdown */\n sortOptions: Array<{ label: string; value: string }>\n /** Initial filter settings configuration */\n filterSettings: FilterSettings\n}\n\n/**\n * Return value from the useListWithFiltering hook\n */\nexport interface UseListWithFilteringReturn<T extends string> {\n // State\n searchTerm: string\n sortSettings: ListSortConfig<T>\n filterSettings: FilterSettings\n\n // Handlers\n handleSearchChange: (term: string | number | string[] | undefined) => void\n handleSortChange: (newSortSettings: SortSettings) => void\n handleFilterChange: (newFilterSettings: FilterSettings) => void\n}\n\n/**\n * Custom hook to manage common list view state: search, sort, and filter\n *\n * Extracts shared logic from list components to ensure consistent behavior\n * across all list pages and reduce code duplication.\n *\n * @example\n * ```tsx\n * const listState = useListWithFiltering({\n * defaultSortKey: \"name\",\n * defaultSortDir: \"asc\",\n * sortOptions: [\n * { label: t`Name`, value: \"name\" },\n * { label: t`Created`, value: \"created_at\" },\n * ],\n * filterSettings: {\n * filters: [\n * { displayName: t`Status`, filterName: \"status\", values: [\"active\", \"inactive\"] }\n * ]\n * }\n * })\n * ```\n */\nexport function useListWithFiltering<T extends string>({\n defaultSortKey,\n defaultSortDir,\n sortOptions,\n filterSettings: initialFilterSettings,\n}: UseListWithFilteringOptions<T>): UseListWithFilteringReturn<T> {\n // Search\n const [searchTerm, setSearchTerm] = useState(\"\")\n const handleSearchChange = (term: string | number | string[] | undefined) => {\n const searchValue = typeof term === \"string\" ? term : \"\"\n startTransition(() => setSearchTerm(searchValue))\n }\n\n // Sort\n const [sortSettings, setSortSettings] = useState<ListSortConfig<T>>({\n options: sortOptions,\n sortBy: defaultSortKey,\n sortDirection: defaultSortDir,\n })\n const handleSortChange = (newSortSettings: SortSettings) => {\n const settings: ListSortConfig<T> = {\n options: newSortSettings.options ?? sortSettings.options,\n sortBy: (newSortSettings.sortBy?.toString() as T) || defaultSortKey,\n sortDirection: (newSortSettings.sortDirection as SortDirection) || defaultSortDir,\n }\n setSortSettings(settings)\n }\n\n // Filter\n const [filterSettings, setFilterSettings] = useState<FilterSettings>(initialFilterSettings)\n const handleFilterChange = (newFilterSettings: FilterSettings) => {\n startTransition(() => setFilterSettings(newFilterSettings))\n }\n\n return {\n searchTerm,\n sortSettings,\n filterSettings,\n handleSearchChange,\n handleSortChange,\n handleFilterChange,\n }\n}\n"],"mappings":";;AAyFA,SAAgBE,EAAuC,EACrDC,mBACAC,mBACAC,gBACAC,gBAAgBC,KACe;CAE/B,IAAM,CAACC,GAAYC,KAAiBR,EAAS,GAAA,EACvCS,KAAsBC,MAAAA;EAC1B,IAAMC,IAAc,OAAOD,KAAS,WAAWA,IAAO;AACtDX,UAAsBS,EAAcG,EAAAA,CAAAA;IAIhC,CAACC,GAAcC,KAAmBb,EAA4B;EAClEc,SAASV;EACTW,QAAQb;EACRc,eAAeb;EACjB,CAAA,EACMc,KAAoBC,MAAAA;AAMxBL,IALoC;GAClCC,SAASI,EAAgBJ,WAAWF,EAAaE;GACjDC,QAAQ,EAAiBA,QAAQK,UAAAA,IAAoBlB;GACrDc,eAAe,EAAiBA,iBAAmCb;GACrE,CACgBgB;IAIZ,CAACd,GAAgBgB,KAAqBrB,EAAyBM,EAAAA;AAKrE,QAAO;EACLC;EACAK;EACAP;EACAI;EACAQ;EACAK,qBAV0BC,MAAAA;AAC1BxB,WAAsBsB,EAAkBE,EAAAA,CAAAA;;EAU1C"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cobaltcore-dev/aurora",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Aurora OpenStack dashboard — server and client library",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
"zod": "^4.0.0"
|
|
72
72
|
},
|
|
73
73
|
"devDependencies": {
|
|
74
|
-
"@cloudoperators/juno-ui-components": "
|
|
74
|
+
"@cloudoperators/juno-ui-components": "7.0.0",
|
|
75
75
|
"@fastify/vite": "^8.4.1",
|
|
76
76
|
"@lingui/cli": "^5.9.5",
|
|
77
77
|
"@lingui/format-po": "^5.9.5",
|
|
@@ -1,223 +0,0 @@
|
|
|
1
|
-
import { $ as e, _ as t, at as n, f as r, i, m as a, o, p as s, v as c, x as l, y as u } from "./build-Cf7iWbpH.mjs";
|
|
2
|
-
import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
|
|
3
|
-
import { useCallback as m, useEffect as h, useRef as g, useState as _ } from "react";
|
|
4
|
-
import { Trans as v, useLingui as y } from "@lingui/react";
|
|
5
|
-
//#region src/client/components/ListToolbar/SelectedFilters.tsx
|
|
6
|
-
var b = ({ selectedFilters: n, onDelete: r, onClear: i }) => {
|
|
7
|
-
let { i18n: a, _: o } = y();
|
|
8
|
-
return /* @__PURE__ */ p(e, {
|
|
9
|
-
gap: "2",
|
|
10
|
-
wrap: !0,
|
|
11
|
-
alignment: "start",
|
|
12
|
-
distribution: "start",
|
|
13
|
-
children: [n.map((e) => /* @__PURE__ */ f(t, {
|
|
14
|
-
closeable: !0,
|
|
15
|
-
pillKey: e.name,
|
|
16
|
-
pillValue: e.value,
|
|
17
|
-
onClose: () => r(e)
|
|
18
|
-
}, `${e.name}:${e.value}`)), n.length > 1 && /* @__PURE__ */ f(t, {
|
|
19
|
-
pillValue: a._({ id: "yYxB17" }),
|
|
20
|
-
className: "ml-2",
|
|
21
|
-
onClick: i
|
|
22
|
-
})]
|
|
23
|
-
});
|
|
24
|
-
};
|
|
25
|
-
//#endregion
|
|
26
|
-
//#region src/client/components/ListToolbar/FiltersInput.tsx
|
|
27
|
-
function x(e) {
|
|
28
|
-
return e == null ? !0 : typeof e == "string" || Array.isArray(e) ? e.length === 0 : e instanceof Map || e instanceof Set ? e.size === 0 : typeof e == "object" ? Object.keys(e).length === 0 : !1;
|
|
29
|
-
}
|
|
30
|
-
var S = ({ filters: e, onChange: t }) => {
|
|
31
|
-
let { i18n: s, _: c } = y(), [l, u] = _(""), [d, h] = _(""), g = e.find((e) => e.filterName === l)?.values?.filter((e) => e), v = m((e) => {
|
|
32
|
-
h(e), !x(l) && !x(e) && t({
|
|
33
|
-
name: l,
|
|
34
|
-
value: e
|
|
35
|
-
}), setTimeout(() => {
|
|
36
|
-
h("");
|
|
37
|
-
}, 0);
|
|
38
|
-
}, [
|
|
39
|
-
l,
|
|
40
|
-
h,
|
|
41
|
-
t
|
|
42
|
-
]), b = () => ({
|
|
43
|
-
className: "w-full sm:flex-1 sm:min-w-0",
|
|
44
|
-
name: "filter",
|
|
45
|
-
"data-testid": "select-filterValue",
|
|
46
|
-
label: s._({ id: "0cVgUw" }),
|
|
47
|
-
value: l,
|
|
48
|
-
onChange: (e) => {
|
|
49
|
-
u(String(e));
|
|
50
|
-
}
|
|
51
|
-
}), S = () => ({
|
|
52
|
-
className: "w-full sm:flex-1 sm:min-w-0",
|
|
53
|
-
name: "filterValue",
|
|
54
|
-
"data-testid": "combobox-filterValue",
|
|
55
|
-
value: d,
|
|
56
|
-
disabled: !l,
|
|
57
|
-
onChange: v
|
|
58
|
-
});
|
|
59
|
-
return /* @__PURE__ */ p(n, {
|
|
60
|
-
className: "flex w-full flex-col sm:w-auto sm:flex-row sm:items-end",
|
|
61
|
-
children: [/* @__PURE__ */ f(i, {
|
|
62
|
-
...b(),
|
|
63
|
-
children: e?.map(({ displayName: e, filterName: t }) => /* @__PURE__ */ f(r, {
|
|
64
|
-
value: t,
|
|
65
|
-
label: e,
|
|
66
|
-
"data-testid": t
|
|
67
|
-
}, t))
|
|
68
|
-
}), /* @__PURE__ */ f(o, {
|
|
69
|
-
...S(),
|
|
70
|
-
children: g?.map((e) => /* @__PURE__ */ f(a, {
|
|
71
|
-
value: e,
|
|
72
|
-
label: e,
|
|
73
|
-
"data-testid": e
|
|
74
|
-
}, e))
|
|
75
|
-
})]
|
|
76
|
-
});
|
|
77
|
-
}, C = ({ sortBy: e, onSortByChange: t, sortDirection: a, onSortDirectionChange: o, options: s }) => {
|
|
78
|
-
let { i18n: c, _: u } = y(), d = () => ({
|
|
79
|
-
className: "flex-grow",
|
|
80
|
-
onChange: t,
|
|
81
|
-
value: e,
|
|
82
|
-
"data-testid": "sort-select",
|
|
83
|
-
label: c._({ id: "/HgF9q" })
|
|
84
|
-
}), m = () => ({
|
|
85
|
-
"data-testid": "direction-toggle",
|
|
86
|
-
order: a,
|
|
87
|
-
onChange: o
|
|
88
|
-
});
|
|
89
|
-
return /* @__PURE__ */ p(n, {
|
|
90
|
-
className: "flex w-full items-end sm:w-auto",
|
|
91
|
-
children: [/* @__PURE__ */ f(i, {
|
|
92
|
-
...d(),
|
|
93
|
-
children: s.map((e) => /* @__PURE__ */ f(r, {
|
|
94
|
-
value: e.value,
|
|
95
|
-
children: e.label
|
|
96
|
-
}, e.value))
|
|
97
|
-
}), /* @__PURE__ */ f(l, {
|
|
98
|
-
...m(),
|
|
99
|
-
className: "shadow-none"
|
|
100
|
-
})]
|
|
101
|
-
});
|
|
102
|
-
}, w = ({ filterSettings: t, onFilter: n, sortSettings: r, onSort: i, searchTerm: a, onSearch: o, searchInputProps: l = {}, actions: _, tabs: x, totalCount: w, filteredCount: T, itemName: E = "items", lastUpdated: D }) => {
|
|
103
|
-
let { i18n: O, _: k } = y(), A = g(void 0);
|
|
104
|
-
h(() => () => {
|
|
105
|
-
A.current && clearTimeout(A.current);
|
|
106
|
-
}, []);
|
|
107
|
-
let j = (e) => e ? (typeof e == "string" ? new Date(e) : e).toLocaleString() : "", M = w !== void 0 && T !== void 0, N = m((e) => {
|
|
108
|
-
!n || !t || n({
|
|
109
|
-
...t,
|
|
110
|
-
selectedFilters: t.selectedFilters?.filter((t) => !(t.name === e.name && t.value === e.value))
|
|
111
|
-
});
|
|
112
|
-
}, [t, n]), P = (e) => {
|
|
113
|
-
if (!n || !t || t.selectedFilters?.some((t) => t.name === e.name && t.value === e.value)) return;
|
|
114
|
-
let r = t.filters.find((t) => e.name === t.filterName)?.supportsMultiValue ? [...t.selectedFilters || [], e] : [...(t.selectedFilters || []).filter((t) => t.name !== e.name), e];
|
|
115
|
-
n({
|
|
116
|
-
...t,
|
|
117
|
-
selectedFilters: r
|
|
118
|
-
});
|
|
119
|
-
}, F = m((e) => {
|
|
120
|
-
let t = typeof e == "string" ? e : "";
|
|
121
|
-
A.current && clearTimeout(A.current), o?.(t);
|
|
122
|
-
}, [o]), I = m((e) => {
|
|
123
|
-
let t = e.currentTarget.value;
|
|
124
|
-
A.current && clearTimeout(A.current), A.current = window.setTimeout(() => o?.(t), 500);
|
|
125
|
-
}, [o]), L = m(() => {
|
|
126
|
-
A.current && clearTimeout(A.current), o?.("");
|
|
127
|
-
}, [o]), R = t && n ? {
|
|
128
|
-
filters: t.filters,
|
|
129
|
-
onChange: P
|
|
130
|
-
} : null, z = r && i ? {
|
|
131
|
-
options: r.options,
|
|
132
|
-
sortBy: r.sortBy,
|
|
133
|
-
sortDirection: r.sortDirection || "asc",
|
|
134
|
-
onSortByChange: (e) => i({
|
|
135
|
-
...r,
|
|
136
|
-
sortBy: e,
|
|
137
|
-
sortDirection: r.sortDirection || "asc"
|
|
138
|
-
}),
|
|
139
|
-
onSortDirectionChange: (e) => i({
|
|
140
|
-
...r,
|
|
141
|
-
sortDirection: e
|
|
142
|
-
})
|
|
143
|
-
} : null, B = o ? {
|
|
144
|
-
placeholder: O._({ id: "YIix5Y" }),
|
|
145
|
-
"data-testid": "searchbar",
|
|
146
|
-
value: a,
|
|
147
|
-
onInput: I,
|
|
148
|
-
onClear: L,
|
|
149
|
-
onSearch: F,
|
|
150
|
-
...l
|
|
151
|
-
} : null;
|
|
152
|
-
return /* @__PURE__ */ p(d, { children: [x && /* @__PURE__ */ f("div", {
|
|
153
|
-
className: "w-full",
|
|
154
|
-
children: /* @__PURE__ */ f(c, {
|
|
155
|
-
activeItem: x.activeItem,
|
|
156
|
-
onActiveItemChange: x.onActiveItemChange,
|
|
157
|
-
children: x.items.map((e) => /* @__PURE__ */ f(u, {
|
|
158
|
-
label: e.label,
|
|
159
|
-
value: e.value
|
|
160
|
-
}, e.value))
|
|
161
|
-
})
|
|
162
|
-
}), /* @__PURE__ */ p(e, {
|
|
163
|
-
alignment: "center",
|
|
164
|
-
gap: "6",
|
|
165
|
-
className: "bg-theme-background-lvl-1 flex w-full flex-col p-4",
|
|
166
|
-
children: [
|
|
167
|
-
_ && /* @__PURE__ */ f(e, {
|
|
168
|
-
direction: "horizontal",
|
|
169
|
-
className: "w-full justify-end",
|
|
170
|
-
children: _
|
|
171
|
-
}),
|
|
172
|
-
/* @__PURE__ */ p("div", {
|
|
173
|
-
className: "flex w-full flex-col items-stretch gap-4 md:flex-row md:items-center",
|
|
174
|
-
children: [
|
|
175
|
-
R && /* @__PURE__ */ f("div", {
|
|
176
|
-
className: "w-full md:w-auto md:min-w-37.5",
|
|
177
|
-
children: /* @__PURE__ */ f(S, { ...R })
|
|
178
|
-
}),
|
|
179
|
-
z && /* @__PURE__ */ f("div", {
|
|
180
|
-
className: "w-full md:w-auto md:min-w-45",
|
|
181
|
-
children: /* @__PURE__ */ f(C, { ...z })
|
|
182
|
-
}),
|
|
183
|
-
B && /* @__PURE__ */ f("div", {
|
|
184
|
-
className: "w-full md:ml-auto md:w-auto md:min-w-25",
|
|
185
|
-
children: /* @__PURE__ */ f(s, { ...B })
|
|
186
|
-
})
|
|
187
|
-
]
|
|
188
|
-
}),
|
|
189
|
-
t?.selectedFilters && t.selectedFilters.length > 0 && n && /* @__PURE__ */ f("div", {
|
|
190
|
-
className: "w-full",
|
|
191
|
-
children: /* @__PURE__ */ f(b, {
|
|
192
|
-
selectedFilters: t.selectedFilters,
|
|
193
|
-
onDelete: N,
|
|
194
|
-
onClear: () => n({
|
|
195
|
-
...t,
|
|
196
|
-
selectedFilters: []
|
|
197
|
-
})
|
|
198
|
-
})
|
|
199
|
-
}),
|
|
200
|
-
(M || D) && /* @__PURE__ */ f("div", {
|
|
201
|
-
className: "text-theme-secondary flex w-full items-center justify-between text-sm",
|
|
202
|
-
children: /* @__PURE__ */ p("div", {
|
|
203
|
-
className: "flex items-center gap-2",
|
|
204
|
-
children: [M && /* @__PURE__ */ f("span", { children: /* @__PURE__ */ f(v, {
|
|
205
|
-
id: "Vg0k6h",
|
|
206
|
-
values: {
|
|
207
|
-
filteredCount: T,
|
|
208
|
-
totalCount: w,
|
|
209
|
-
itemName: E
|
|
210
|
-
}
|
|
211
|
-
}) }), D && /* @__PURE__ */ f("span", { children: /* @__PURE__ */ f(v, {
|
|
212
|
-
id: "wlUDbB",
|
|
213
|
-
values: { formattedDate: j(D) }
|
|
214
|
-
}) })]
|
|
215
|
-
})
|
|
216
|
-
})
|
|
217
|
-
]
|
|
218
|
-
})] });
|
|
219
|
-
};
|
|
220
|
-
//#endregion
|
|
221
|
-
export { w as t };
|
|
222
|
-
|
|
223
|
-
//# sourceMappingURL=ListToolbar-DuazvsAu.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ListToolbar-DuazvsAu.mjs","names":["Pill","Stack","SelectedFilters","selectedFilters","onDelete","onClear","useLingui","gap","wrap","alignment","distribution","map","filter","closeable","pillKey","name","pillValue","value","onClose","length","t","className","onClick","useCallback","useState","InputGroup","ComboBox","ComboBoxOption","SelectOption","Select","isEmpty","value","Array","isArray","length","Map","Set","size","Object","keys","FiltersInput","filters","onChange","useLingui","selectedFilterName","setSelectedFilterName","selectedFilterValue","setSelectedFilterValue","filterValues","find","filter","filterName","values","handleValueChange","name","setTimeout","getSelectProps","className","label","t","String","getComboBoxProps","disabled","map","displayName","data-testid","React","Select","SelectOption","SortButton","InputGroup","SortInput","sortBy","onSortByChange","sortDirection","onSortDirectionChange","options","useLingui","getSelectProps","className","onChange","value","label","t","getSortButtonProps","order","map","option","useCallback","useRef","useEffect","SearchInput","Stack","TabNavigation","TabNavigationItem","SelectedFilters","FiltersInput","SortInput","ListToolbar","filterSettings","onFilter","sortSettings","onSort","searchTerm","onSearch","searchInputProps","actions","tabs","totalCount","filteredCount","itemName","lastUpdated","useLingui","debounceTimerRef","undefined","current","clearTimeout","formatLastUpdated","date","dateObj","Date","toLocaleString","showCountInfo","handleFilterDelete","filterToRemove","selectedFilters","filter","name","value","handleSelect","selectedFilter","filterExists","some","supportsMultiValue","filters","find","filterName","newSelected","handleSearch","searchValue","handleSearchInput","event","currentTarget","window","setTimeout","handleSearchClear","filtersProps","onChange","sortProps","options","sortBy","sortDirection","onSortByChange","param","onSortDirectionChange","direction","searchProps","placeholder","t","onInput","onClear","div","className","activeItem","onActiveItemChange","items","map","item","label","alignment","gap","length","onDelete","span","formattedDate"],"sources":["../../src/client/components/ListToolbar/SelectedFilters.tsx","../../src/client/components/ListToolbar/FiltersInput.tsx","../../src/client/components/ListToolbar/SortInput.tsx","../../src/client/components/ListToolbar/index.tsx"],"sourcesContent":["import { useLingui } from \"@lingui/react/macro\"\nimport { Pill, Stack } from \"@cloudoperators/juno-ui-components\"\nimport { SelectedFilter } from \"./types\"\n\nexport type SelectedFiltersProps = {\n /**\n * Array of currently active filters to be displayed as closeable pills.\n */\n selectedFilters: SelectedFilter[]\n\n /**\n * Callback function invoked when a user removes an individual filter pill.\n */\n onDelete: (filter: SelectedFilter) => void\n\n /**\n * Callback function invoked when the \"Clear all\" button is clicked.\n */\n onClear: () => void\n}\n\n/**\n * SelectedFilters Component\n *\n * Displays currently active filters as closeable pill components with individual\n * remove buttons and an optional \"Clear all\" button (shown when 2+ filters are active).\n *\n * The pills are arranged in a flexible, wrapping layout that adapts to available space.\n */\nexport const SelectedFilters = ({ selectedFilters, onDelete, onClear }: SelectedFiltersProps) => {\n const { t } = useLingui()\n\n return (\n <Stack gap=\"2\" wrap={true} alignment=\"start\" distribution=\"start\">\n {/* Render a closeable pill for each selected filter */}\n {selectedFilters.map((filter) => (\n <Pill\n key={`${filter.name}:${filter.value}`}\n closeable\n pillKey={filter.name}\n pillValue={filter.value}\n onClose={() => onDelete(filter)}\n />\n ))}\n {selectedFilters.length > 1 && <Pill pillValue={t`Clear all`} className=\"ml-2\" onClick={onClear} />}\n </Stack>\n )\n}\n","import { useCallback, useState } from \"react\"\nimport { useLingui } from \"@lingui/react/macro\"\nimport {\n InputGroup,\n ComboBox,\n ComboBoxProps,\n ComboBoxOption,\n SelectOption,\n Select,\n SelectProps,\n} from \"@cloudoperators/juno-ui-components\"\nimport { Filter, SelectedFilter } from \"./types\"\n\nexport type FiltersInputProps = {\n filters: Filter[]\n onChange: (filter: SelectedFilter) => void\n}\n\nfunction isEmpty(value: unknown) {\n if (value == null) return true\n if (typeof value === \"string\" || Array.isArray(value)) return value.length === 0\n if (value instanceof Map || value instanceof Set) return value.size === 0\n if (typeof value === \"object\") return Object.keys(value).length === 0\n return false\n}\n\nexport const FiltersInput = ({ filters, onChange }: FiltersInputProps) => {\n const { t } = useLingui()\n\n const [selectedFilterName, setSelectedFilterName] = useState<string>(\"\")\n const [selectedFilterValue, setSelectedFilterValue] = useState<string>(\"\")\n\n const filterValues: string[] | undefined = filters\n .find((filter) => filter.filterName === selectedFilterName)\n ?.values?.filter((value) => value)\n\n const handleValueChange = useCallback(\n (value: string) => {\n setSelectedFilterValue(value)\n if (!isEmpty(selectedFilterName) && !isEmpty(value)) {\n onChange({\n name: selectedFilterName,\n value: value,\n })\n }\n setTimeout(() => {\n setSelectedFilterValue(\"\")\n }, 0)\n },\n [selectedFilterName, setSelectedFilterValue, onChange]\n )\n\n const getSelectProps = (): SelectProps & { \"data-testid\"?: string } => ({\n className: \"w-full sm:flex-1 sm:min-w-0\",\n name: \"filter\",\n \"data-testid\": \"select-filterValue\",\n label: t`Filter by`,\n value: selectedFilterName,\n onChange: (value: string | number | string[] | undefined) => {\n setSelectedFilterName(String(value))\n },\n })\n\n const getComboBoxProps = (): ComboBoxProps & { \"data-testid\"?: string } => ({\n className: \"w-full sm:flex-1 sm:min-w-0\",\n name: \"filterValue\",\n \"data-testid\": \"combobox-filterValue\",\n value: selectedFilterValue,\n disabled: !selectedFilterName,\n onChange: handleValueChange,\n })\n\n return (\n <InputGroup className=\"flex w-full flex-col sm:w-auto sm:flex-row sm:items-end\">\n <Select {...getSelectProps()}>\n {filters?.map(({ displayName, filterName }) => (\n <SelectOption value={filterName} label={displayName} key={filterName} data-testid={filterName} />\n ))}\n </Select>\n <ComboBox {...getComboBoxProps()}>\n {filterValues?.map((value) => (\n <ComboBoxOption value={value} key={value} label={value} data-testid={value} />\n ))}\n </ComboBox>\n </InputGroup>\n )\n}\n","import React from \"react\"\nimport { useLingui } from \"@lingui/react/macro\"\nimport {\n Select,\n SelectOption,\n SortButton,\n InputGroup,\n SelectProps,\n ButtonProps,\n} from \"@cloudoperators/juno-ui-components\"\nimport { SortOption } from \"./types\"\n\nexport interface SortInputProps {\n sortBy?: string | number | string[]\n onSortByChange: (param?: string | number | string[]) => void\n sortDirection: \"asc\" | \"desc\"\n onSortDirectionChange: (direction: \"asc\" | \"desc\") => void\n options: SortOption[]\n}\n\nexport const SortInput: React.FC<SortInputProps> = ({\n sortBy,\n onSortByChange,\n sortDirection,\n onSortDirectionChange,\n options,\n}) => {\n const { t } = useLingui()\n\n const getSelectProps = (): SelectProps & { \"data-testid\"?: string } => ({\n className: \"flex-grow\",\n onChange: onSortByChange,\n value: sortBy,\n \"data-testid\": \"sort-select\",\n label: t`Sort by`,\n })\n\n const getSortButtonProps = (): Omit<ButtonProps, \"onChange\"> & {\n \"data-testid\"?: string\n order: \"asc\" | \"desc\"\n onChange: (order: \"asc\" | \"desc\") => void\n } => ({\n \"data-testid\": \"direction-toggle\",\n order: sortDirection,\n onChange: onSortDirectionChange,\n })\n\n return (\n <InputGroup className=\"flex w-full items-end sm:w-auto\">\n <Select {...getSelectProps()}>\n {options.map((option) => (\n <SelectOption key={option.value} value={option.value}>\n {option.label}\n </SelectOption>\n ))}\n </Select>\n <SortButton {...getSortButtonProps()} className=\"shadow-none\" />\n </InputGroup>\n )\n}\n","import { ReactNode, useCallback, useRef, useEffect } from \"react\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport {\n SearchInput,\n SearchInputProps,\n Stack,\n TabNavigation,\n TabNavigationItem,\n} from \"@cloudoperators/juno-ui-components\"\nimport { SelectedFilters } from \"./SelectedFilters\"\nimport { FiltersInput } from \"./FiltersInput\"\nimport { SortInput } from \"./SortInput\"\nimport { FilterSettings, SelectedFilter, SortSettings } from \"./types\"\n\nexport type ListToolbarProps = {\n filterSettings?: FilterSettings\n onFilter?: (filterSettings: FilterSettings) => void\n sortSettings?: SortSettings\n onSort?: (sortSettings: SortSettings) => void\n searchTerm?: string\n onSearch?: (searchTerm: string) => void\n searchInputProps?: Omit<SearchInputProps, \"value\" | \"onSearch\" | \"onClear\" | \"onInput\">\n actions?: ReactNode\n tabs?: {\n items: Array<{ label: string; value: string }>\n activeItem: string\n onActiveItemChange: (value: ReactNode) => void\n }\n // Count information\n totalCount?: number\n itemName?: string // e.g. \"items\", \"users\", \"projects\" - used in count display\n filteredCount?: number\n // Last updated timestamp\n lastUpdated?: Date | string\n}\n\nexport const ListToolbar = ({\n filterSettings,\n onFilter,\n sortSettings,\n onSort,\n searchTerm,\n onSearch,\n searchInputProps = {},\n actions,\n tabs,\n totalCount,\n filteredCount,\n itemName = \"items\",\n lastUpdated,\n}: ListToolbarProps) => {\n const { t } = useLingui()\n\n const debounceTimerRef = useRef<number | undefined>(undefined)\n\n useEffect(() => {\n return () => {\n if (debounceTimerRef.current) {\n clearTimeout(debounceTimerRef.current)\n }\n }\n }, [])\n\n // Format last updated time\n const formatLastUpdated = (date: Date | string | undefined): string => {\n if (!date) return \"\"\n const dateObj = typeof date === \"string\" ? new Date(date) : date\n return dateObj.toLocaleString()\n }\n\n const showCountInfo = totalCount !== undefined && filteredCount !== undefined\n\n const handleFilterDelete = useCallback(\n (filterToRemove: SelectedFilter) => {\n if (!onFilter || !filterSettings) return\n onFilter({\n ...filterSettings,\n selectedFilters: filterSettings.selectedFilters?.filter(\n (filter) => !(filter.name === filterToRemove.name && filter.value === filterToRemove.value)\n ),\n })\n },\n [filterSettings, onFilter]\n )\n\n const handleSelect = (selectedFilter: SelectedFilter) => {\n if (!onFilter || !filterSettings) return\n const filterExists = filterSettings.selectedFilters?.some(\n (filter) => filter.name === selectedFilter.name && filter.value === selectedFilter.value\n )\n if (filterExists) return\n\n const supportsMultiValue = filterSettings.filters.find(\n (filter) => selectedFilter.name === filter.filterName\n )?.supportsMultiValue\n\n const newSelected = supportsMultiValue\n ? [...(filterSettings.selectedFilters || []), selectedFilter]\n : [\n ...(filterSettings.selectedFilters || []).filter((filter) => filter.name !== selectedFilter.name),\n selectedFilter,\n ]\n\n onFilter({ ...filterSettings, selectedFilters: newSelected })\n }\n\n const handleSearch = useCallback(\n (value: string | number | string[] | undefined) => {\n const searchValue = typeof value === \"string\" ? value : \"\"\n\n if (debounceTimerRef.current) {\n clearTimeout(debounceTimerRef.current)\n }\n\n onSearch?.(searchValue)\n },\n [onSearch]\n )\n\n const handleSearchInput = useCallback(\n (event: React.FormEvent<HTMLInputElement>) => {\n const searchValue = event.currentTarget.value\n if (debounceTimerRef.current) clearTimeout(debounceTimerRef.current)\n debounceTimerRef.current = window.setTimeout(() => onSearch?.(searchValue), 500)\n },\n [onSearch]\n )\n\n const handleSearchClear = useCallback(() => {\n if (debounceTimerRef.current) clearTimeout(debounceTimerRef.current)\n onSearch?.(\"\")\n }, [onSearch])\n\n const filtersProps = filterSettings && onFilter ? { filters: filterSettings.filters, onChange: handleSelect } : null\n const sortProps =\n sortSettings && onSort\n ? {\n options: sortSettings.options,\n sortBy: sortSettings.sortBy,\n sortDirection: sortSettings.sortDirection || \"asc\",\n onSortByChange: (param: string | number | string[] | undefined) =>\n onSort({ ...sortSettings, sortBy: param, sortDirection: sortSettings.sortDirection || \"asc\" }),\n onSortDirectionChange: (direction: \"asc\" | \"desc\") => onSort({ ...sortSettings, sortDirection: direction }),\n }\n : null\n\n const searchProps: (SearchInputProps & { \"data-testid\"?: string }) | null = onSearch\n ? {\n placeholder: t`Search...`,\n \"data-testid\": \"searchbar\",\n value: searchTerm,\n onInput: handleSearchInput,\n onClear: handleSearchClear,\n onSearch: handleSearch,\n ...searchInputProps,\n }\n : null\n\n return (\n <>\n {tabs && (\n <div className=\"w-full\">\n <TabNavigation activeItem={tabs.activeItem} onActiveItemChange={tabs.onActiveItemChange}>\n {tabs.items.map((item) => (\n <TabNavigationItem key={item.value} label={item.label} value={item.value} />\n ))}\n </TabNavigation>\n </div>\n )}\n <Stack alignment=\"center\" gap=\"6\" className=\"bg-theme-background-lvl-1 flex w-full flex-col p-4\">\n {actions && (\n <Stack direction=\"horizontal\" className=\"w-full justify-end\">\n {actions}\n </Stack>\n )}\n\n <div className=\"flex w-full flex-col items-stretch gap-4 md:flex-row md:items-center\">\n {filtersProps && (\n <div className=\"w-full md:w-auto md:min-w-37.5\">\n <FiltersInput {...filtersProps} />\n </div>\n )}\n {sortProps && (\n <div className=\"w-full md:w-auto md:min-w-45\">\n <SortInput {...sortProps} />\n </div>\n )}\n {searchProps && (\n <div className=\"w-full md:ml-auto md:w-auto md:min-w-25\">\n <SearchInput {...searchProps} />\n </div>\n )}\n </div>\n\n {filterSettings?.selectedFilters && filterSettings.selectedFilters.length > 0 && onFilter && (\n <div className=\"w-full\">\n <SelectedFilters\n selectedFilters={filterSettings.selectedFilters}\n onDelete={handleFilterDelete}\n onClear={() => onFilter({ ...filterSettings, selectedFilters: [] })}\n />\n </div>\n )}\n {/* Count and Last Updated Info */}\n {(showCountInfo || lastUpdated) && (\n <div className=\"text-theme-secondary flex w-full items-center justify-between text-sm\">\n <div className=\"flex items-center gap-2\">\n {showCountInfo && (\n <span>\n <Trans>\n Showing {filteredCount} of {totalCount} {itemName}\n </Trans>\n </span>\n )}\n {lastUpdated &&\n (() => {\n const formattedDate = formatLastUpdated(lastUpdated)\n return (\n <span>\n <Trans>Last updated: {formattedDate}</Trans>\n </span>\n )\n })()}\n </div>\n </div>\n )}\n </Stack>\n </>\n )\n}\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"_flavorId-B-1fYadl.mjs","names":["React","Stack","DescriptionList","DescriptionTerm","DescriptionDefinition","ContentHeading","FlavorDetailsView","flavor","formatBytes","bytes","unit","direction","gap","className","alignTerms","id","name","description","vcpus","ram","disk","swap","Number","rxtx_factor","extra_specs","Object","keys","length","entries","map","key","value","Fragment","Button","ButtonRow","Stack","Spinner","PopupMenu","PopupMenuToggle","PopupMenuOptions","PopupMenuItem","useNavigate","useParams","Trans","useLingui","trpcReact","FlavorDetailsView","StatusError","useErrorTranslation","EditSpecModal","ManageAccessModal","DeleteFlavorModal","useModal","ContentHeader","Route","RouteComponent","projectId","flavorId","from","trpcClient","useRouteContext","navigate","t","translateError","isRetryableError","data","flavor","status","error","refetch","compute","getFlavorById","useQuery","project_id","permissionsData","canUser","permission","canDeleteFlavor","canManageAccess","canManageSpecs","specModalOpen","toggleSpecModal","accessModalOpen","toggleAccessModal","deleteModalOpen","toggleDeleteModal","handleBack","to","params","handleHome","handleRetry","errorCode","message","translatedError","canRetry","getStatusCode","code","includes","undefined","hasMoreActions","headerActions","name","component"],"sources":["../../src/client/routes/_auth/projects/$projectId/compute/flavors/-components/FlavorDetailsView.tsx","../../src/client/routes/_auth/projects/$projectId/compute/flavors/$flavorId.tsx?tsr-split=component"],"sourcesContent":["import React from \"react\"\nimport {\n Stack,\n DescriptionList,\n DescriptionTerm,\n DescriptionDefinition,\n ContentHeading,\n} from \"@cloudoperators/juno-ui-components/index\"\nimport { Trans } from \"@lingui/react/macro\"\nimport type { Flavor } from \"@/server/Compute/types/flavor\"\n\ninterface FlavorDetailsViewProps {\n flavor: Flavor\n}\n\nexport function FlavorDetailsView({ flavor }: FlavorDetailsViewProps) {\n const formatBytes = (bytes: number, unit: string = \"MB\") => {\n if (bytes === 0) return `0 ${unit}`\n return `${bytes} ${unit}`\n }\n\n return (\n <Stack direction=\"vertical\" gap=\"6\" className=\"mt-6\">\n <Stack direction=\"vertical\" gap=\"2\">\n <ContentHeading>\n <Trans>Basic Information</Trans>\n </ContentHeading>\n <DescriptionList alignTerms=\"right\">\n <DescriptionTerm>\n <Trans>ID</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{flavor.id}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Name</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{flavor.name}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Description</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{flavor?.description}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Public</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>\n {flavor[\"os-flavor-access:is_public\"] ? <Trans>Yes</Trans> : <Trans>No</Trans>}\n </DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Disabled</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>\n {flavor[\"OS-FLV-DISABLED:disabled\"] ? <Trans>Yes</Trans> : <Trans>No</Trans>}\n </DescriptionDefinition>\n </DescriptionList>\n </Stack>\n\n <Stack direction=\"vertical\" gap=\"2\">\n <ContentHeading>\n <Trans>Hardware Specifications</Trans>\n </ContentHeading>\n <DescriptionList alignTerms=\"right\">\n <DescriptionTerm>\n <Trans>VCPUs</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{flavor.vcpus}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>RAM</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{formatBytes(flavor.ram, \"MiB\")}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Disk</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{formatBytes(flavor.disk, \"GiB\")}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Ephemeral Disk</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{formatBytes(flavor[\"OS-FLV-EXT-DATA:ephemeral\"] || 0, \"GiB\")}</DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>Swap</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>\n {flavor.swap === 0 || flavor.swap === \"\" ? <Trans>None</Trans> : formatBytes(Number(flavor.swap), \"MiB\")}\n </DescriptionDefinition>\n\n <DescriptionTerm>\n <Trans>RX/TX Factor</Trans>\n </DescriptionTerm>\n <DescriptionDefinition>{flavor.rxtx_factor}</DescriptionDefinition>\n </DescriptionList>\n </Stack>\n\n {flavor.extra_specs && Object.keys(flavor.extra_specs).length > 0 && (\n <Stack direction=\"vertical\" gap=\"2\">\n <ContentHeading>\n <Trans>Extra Specs</Trans>\n </ContentHeading>\n <DescriptionList alignTerms=\"right\">\n {Object.entries(flavor.extra_specs).map(([key, value]) => (\n <React.Fragment key={key}>\n <DescriptionTerm>{key}</DescriptionTerm>\n <DescriptionDefinition>{value}</DescriptionDefinition>\n </React.Fragment>\n ))}\n </DescriptionList>\n </Stack>\n )}\n </Stack>\n )\n}\n","import {\n Button,\n ButtonRow,\n Stack,\n Spinner,\n PopupMenu,\n PopupMenuToggle,\n PopupMenuOptions,\n PopupMenuItem,\n} from \"@cloudoperators/juno-ui-components/index\"\nimport { createFileRoute, redirect, useNavigate, useParams } from \"@tanstack/react-router\"\nimport type { RouteInfo } from \"@/client/routes/routeInfo\"\nimport { Trans, useLingui } from \"@lingui/react/macro\"\nimport { getServiceIndex } from \"@/server/Authentication/helpers\"\nimport { trpcReact } from \"@/client/trpcClient\"\nimport { FlavorDetailsView } from \"./-components/FlavorDetailsView\"\nimport { StatusError } from \"@/client/components/Error/StatusError\"\nimport { useErrorTranslation } from \"@/client/utils/useErrorTranslation\"\nimport { EditSpecModal } from \"../-components/Flavors/-components/EditSpecModal\"\nimport { ManageAccessModal } from \"../-components/Flavors/-components/ManageAccessModal\"\nimport { DeleteFlavorModal } from \"../-components/Flavors/-components/DeleteFlavorModal\"\nimport { useModal } from \"@/client/utils/useModal\"\nimport { ContentHeader } from \"@/client/components/ContentHeader/ContentHeader\"\n\nexport const Route = createFileRoute(\"/_auth/projects/$projectId/compute/flavors/$flavorId\")({\n staticData: {\n section: \"compute\",\n service: \"flavors\",\n isDetail: true,\n sectionCrumb: { labelKey: \"Compute\" },\n crumb: { labelKey: \"Flavors\", to: \"/projects/$projectId/compute/flavors\" },\n } satisfies RouteInfo,\n loader: async ({ context, params }) => {\n const flavor = await context.trpcClient?.compute.getFlavorById.query({\n project_id: params.projectId,\n flavorId: params.flavorId,\n })\n return { flavorName: flavor?.name ?? null }\n },\n head: ({ loaderData }) => ({\n meta: [{ title: loaderData?.flavorName ?? \"Flavor Details\" }],\n }),\n component: RouteComponent,\n beforeLoad: async ({ context, params }) => {\n const { trpcClient } = context\n const { projectId } = params\n\n const availableServices = (await trpcClient?.auth.getAvailableServices.query()) || []\n\n const serviceIndex = getServiceIndex(availableServices)\n\n if (!serviceIndex[\"flavor\"] && !serviceIndex[\"compute\"]) {\n throw redirect({\n to: \"/projects/$projectId/compute/overview\",\n params: { projectId },\n })\n }\n },\n})\n\nfunction RouteComponent() {\n const { projectId, flavorId } = useParams({\n from: \"/_auth/projects/$projectId/compute/flavors/$flavorId\",\n })\n const { trpcClient } = Route.useRouteContext()\n const navigate = useNavigate()\n const { t } = useLingui()\n const { translateError, isRetryableError } = useErrorTranslation()\n\n const {\n data: flavor,\n status,\n error,\n refetch,\n } = trpcReact.compute.getFlavorById.useQuery({\n project_id: projectId,\n flavorId,\n })\n\n const { data: permissionsData } = trpcReact.compute.canUser.useQuery({\n project_id: projectId,\n permission: [\"flavors:delete\", \"flavors:list_projects\", \"flavor_specs:create\", \"flavor_specs:delete\"],\n })\n\n const canDeleteFlavor = permissionsData?.[0] ?? false\n const canManageAccess = permissionsData?.[1] ?? false\n const canManageSpecs = (permissionsData?.[2] ?? false) || (permissionsData?.[3] ?? false)\n\n const [specModalOpen, toggleSpecModal] = useModal()\n const [accessModalOpen, toggleAccessModal] = useModal()\n const [deleteModalOpen, toggleDeleteModal] = useModal()\n\n const handleBack = () => {\n navigate({\n to: \"/projects/$projectId/compute/flavors\",\n params: { projectId },\n })\n }\n\n const handleHome = () => {\n navigate({\n to: \"/projects/$projectId/compute/overview\",\n params: { projectId },\n })\n }\n\n const handleRetry = () => {\n refetch()\n }\n\n if (status === \"pending\") {\n return (\n <Stack className=\"fixed inset-0\" distribution=\"center\" alignment=\"center\" direction=\"vertical\">\n <Spinner variant=\"primary\" size=\"large\" className=\"mb-2\" />\n <Trans>Loading Flavor Details...</Trans>\n </Stack>\n )\n }\n\n if (status === \"error\") {\n const errorCode = error?.message || \"UNKNOWN_ERROR\"\n const translatedError = translateError(errorCode)\n const canRetry = isRetryableError(errorCode)\n\n const getStatusCode = (code: string): number | undefined => {\n if (code.includes(\"UNAUTHORIZED\")) return 401\n if (code.includes(\"FORBIDDEN\")) return 403\n if (code.includes(\"NOT_FOUND\")) return 404\n if (code.includes(\"SERVER_ERROR\")) return 500\n return undefined\n }\n\n return (\n <StatusError\n message={translatedError}\n statusCode={getStatusCode(errorCode)}\n title={t`Error Loading Flavor`}\n onBackClick={handleBack}\n onHomeClick={handleHome}\n reset={canRetry ? handleRetry : undefined}\n />\n )\n }\n\n if (!flavor) {\n return (\n <StatusError\n message={t`The requested flavor could not be found. It may have been deleted or you may not have access to it.`}\n statusCode={404}\n title={t`Flavor Not Found`}\n onBackClick={handleBack}\n onHomeClick={handleHome}\n />\n )\n }\n\n const hasMoreActions = canManageAccess || canDeleteFlavor\n\n const headerActions =\n hasMoreActions || canManageSpecs ? (\n <ButtonRow>\n {hasMoreActions && (\n <PopupMenu>\n <PopupMenuToggle as=\"div\">\n <Button icon=\"moreVert\">\n <Trans>More Actions</Trans>\n </Button>\n </PopupMenuToggle>\n <PopupMenuOptions>\n {canManageAccess && <PopupMenuItem label={t`Manage Access`} onClick={toggleAccessModal} />}\n {canDeleteFlavor && <PopupMenuItem label={t`Delete Flavor`} onClick={toggleDeleteModal} />}\n </PopupMenuOptions>\n </PopupMenu>\n )}\n {canManageSpecs && (\n <Button onClick={toggleSpecModal} variant=\"primary\">\n <Trans>Metadata</Trans>\n </Button>\n )}\n </ButtonRow>\n ) : undefined\n\n return (\n <>\n <ContentHeader title={flavor.name} projectId={projectId} actions={headerActions} />\n <Stack direction=\"vertical\">\n <FlavorDetailsView flavor={flavor} />\n </Stack>\n\n {trpcClient && (\n <>\n {specModalOpen && (\n <EditSpecModal\n client={trpcClient}\n isOpen={specModalOpen}\n onClose={toggleSpecModal}\n project={projectId}\n flavor={flavor}\n />\n )}\n\n {accessModalOpen && (\n <ManageAccessModal\n client={trpcClient}\n isOpen={accessModalOpen}\n onClose={toggleAccessModal}\n project={projectId}\n flavor={flavor}\n />\n )}\n\n {deleteModalOpen && (\n <DeleteFlavorModal\n client={trpcClient}\n isOpen={deleteModalOpen}\n onClose={toggleDeleteModal}\n project={projectId}\n flavor={flavor}\n onSuccess={handleBack}\n />\n )}\n </>\n )}\n </>\n )\n}\n"],"mappings":"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"}
|