@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.
Files changed (130) hide show
  1. package/dist/client/AuroraApp.d.ts +10 -0
  2. package/dist/client/{ContentHeader-DtBiIwRY.mjs → ContentHeader-BXZoN3B9.mjs} +15 -15
  3. package/dist/client/{ContentHeader-DtBiIwRY.mjs.map → ContentHeader-BXZoN3B9.mjs.map} +1 -1
  4. package/dist/client/{DeleteFlavorModal-rmuYIafD.mjs → DeleteFlavorModal-BusYn32r.mjs} +148 -148
  5. package/dist/client/{DeleteFlavorModal-rmuYIafD.mjs.map → DeleteFlavorModal-BusYn32r.mjs.map} +1 -1
  6. package/dist/client/{EditSecurityGroupModal-B7Sz9puM.mjs → EditSecurityGroupModal-Dl6m7wUe.mjs} +16 -16
  7. package/dist/client/{EditSecurityGroupModal-B7Sz9puM.mjs.map → EditSecurityGroupModal-Dl6m7wUe.mjs.map} +1 -1
  8. package/dist/client/FiltersInput-BgNaHFBt.mjs +81 -0
  9. package/dist/client/FiltersInput-BgNaHFBt.mjs.map +1 -0
  10. package/dist/client/{FloatingIpActionModals-CfRJiZqD.mjs → FloatingIpActionModals-By2hXR9m.mjs} +51 -51
  11. package/dist/client/{FloatingIpActionModals-CfRJiZqD.mjs.map → FloatingIpActionModals-By2hXR9m.mjs.map} +1 -1
  12. package/dist/client/{ImageToastNotifications-Cw30RXsw.mjs → ImageToastNotifications-fHI8jB2j.mjs} +369 -369
  13. package/dist/client/{ImageToastNotifications-Cw30RXsw.mjs.map → ImageToastNotifications-fHI8jB2j.mjs.map} +1 -1
  14. package/dist/client/ListToolbar-BvtCo8dk.mjs +129 -0
  15. package/dist/client/ListToolbar-BvtCo8dk.mjs.map +1 -0
  16. package/dist/client/{RouteError-Cyto623-.mjs → RouteError-pDEWC_k7.mjs} +2 -2
  17. package/dist/client/{RouteError-Cyto623-.mjs.map → RouteError-pDEWC_k7.mjs.map} +1 -1
  18. package/dist/client/SortInput-DXWSqSny.mjs +34 -0
  19. package/dist/client/SortInput-DXWSqSny.mjs.map +1 -0
  20. package/dist/client/{_flavorId-B-1fYadl.mjs → _flavorId-BRonXvCo.mjs} +46 -46
  21. package/dist/client/_flavorId-BRonXvCo.mjs.map +1 -0
  22. package/dist/client/{_flavorId-BYfIHIV_.mjs → _flavorId-BoNcxYmF.mjs} +10 -10
  23. package/dist/client/_flavorId-BoNcxYmF.mjs.map +1 -0
  24. package/dist/client/_floatingIpId-BpUfL8Im2.mjs +228 -0
  25. package/dist/client/_floatingIpId-BpUfL8Im2.mjs.map +1 -0
  26. package/dist/client/{_floatingIpId-IrnN-ozB.mjs → _floatingIpId-CwHiXazi.mjs} +2 -2
  27. package/dist/client/{_floatingIpId-IrnN-ozB.mjs.map → _floatingIpId-CwHiXazi.mjs.map} +1 -1
  28. package/dist/client/{_imageId-Tx_9bqEc.mjs → _imageId-CdOOJjw0.mjs} +158 -158
  29. package/dist/client/_imageId-CdOOJjw0.mjs.map +1 -0
  30. package/dist/client/{_pcaId-CFuKY82d.mjs → _pcaId-CwlH1Kvl.mjs} +132 -132
  31. package/dist/client/{_pcaId-CFuKY82d.mjs.map → _pcaId-CwlH1Kvl.mjs.map} +1 -1
  32. package/dist/client/{_pcaId-Bck7S7gJ.mjs → _pcaId-D1ZEaCdp.mjs} +2 -2
  33. package/dist/client/{_pcaId-Bck7S7gJ.mjs.map → _pcaId-D1ZEaCdp.mjs.map} +1 -1
  34. package/dist/client/_projectId-D1gGribM.mjs +316 -0
  35. package/dist/client/_projectId-D1gGribM.mjs.map +1 -0
  36. package/dist/client/{_projectId-PSpuCKO7.mjs → _projectId-DhLpIalx.mjs} +9 -9
  37. package/dist/client/{_projectId-PSpuCKO7.mjs.map → _projectId-DhLpIalx.mjs.map} +1 -1
  38. package/dist/client/{_projectId-B1VjDd0Z.mjs → _projectId-Dj_InfSc.mjs} +3 -3
  39. package/dist/client/{_projectId-B1VjDd0Z.mjs.map → _projectId-Dj_InfSc.mjs.map} +1 -1
  40. package/dist/client/{_projectId-Pxp-RXK4.mjs → _projectId-OW2xkK43.mjs} +2 -2
  41. package/dist/client/{_projectId-Pxp-RXK4.mjs.map → _projectId-OW2xkK43.mjs.map} +1 -1
  42. package/dist/client/{_securityGroupId-VV2lUcGQ.mjs → _securityGroupId-B0llWH9A.mjs} +2 -2
  43. package/dist/client/{_securityGroupId-VV2lUcGQ.mjs.map → _securityGroupId-B0llWH9A.mjs.map} +1 -1
  44. package/dist/client/{_securityGroupId-Dqi6ddw4.mjs → _securityGroupId-gbUnd5Wv.mjs} +363 -363
  45. package/dist/client/{_securityGroupId-Dqi6ddw4.mjs.map → _securityGroupId-gbUnd5Wv.mjs.map} +1 -1
  46. package/dist/client/{about-B2AzqxFI.mjs → about-DCe6LsKz.mjs} +8 -8
  47. package/dist/client/{about-B2AzqxFI.mjs.map → about-DCe6LsKz.mjs.map} +1 -1
  48. package/dist/client/{build-Cf7iWbpH.mjs → build-BJDfnAyi.mjs} +1573 -1564
  49. package/dist/client/{build-Cf7iWbpH.mjs.map → build-BJDfnAyi.mjs.map} +1 -1
  50. package/dist/client/{buildFilterParams-ngVK3ybs.mjs → buildFilterParams-By33pG59.mjs} +1 -1
  51. package/dist/client/{buildFilterParams-ngVK3ybs.mjs.map → buildFilterParams-By33pG59.mjs.map} +1 -1
  52. package/dist/client/{constants-CCgR6fKI.mjs → constants-CAjjRTo_.mjs} +9 -9
  53. package/dist/client/{constants-CCgR6fKI.mjs.map → constants-CAjjRTo_.mjs.map} +1 -1
  54. package/dist/client/{containers-BWERuY0O.mjs → containers-BuXUVb1N.mjs} +811 -811
  55. package/dist/client/{containers-BWERuY0O.mjs.map → containers-BuXUVb1N.mjs.map} +1 -1
  56. package/dist/client/{containers-Cs5vOeR2.mjs → containers-Ca5V1EBS.mjs} +1 -1
  57. package/dist/client/containers-Ca5V1EBS.mjs.map +1 -0
  58. package/dist/client/{containers-DovytjVP.mjs → containers-NW7RnHTI.mjs} +6 -6
  59. package/dist/client/containers-NW7RnHTI.mjs.map +1 -0
  60. package/dist/client/flavors-BXPYAFyQ.mjs.map +1 -1
  61. package/dist/client/{flavors-CUiALHcB.mjs → flavors-D8oElC2K.mjs} +2 -2
  62. package/dist/client/{flavors-CUiALHcB.mjs.map → flavors-D8oElC2K.mjs.map} +1 -1
  63. package/dist/client/flavors-qvgPSI7J.mjs +613 -0
  64. package/dist/client/flavors-qvgPSI7J.mjs.map +1 -0
  65. package/dist/client/{floatingips-BrjDiY2t.mjs → floatingips-Be3zLoaD.mjs} +126 -126
  66. package/dist/client/{floatingips-BrjDiY2t.mjs.map → floatingips-Be3zLoaD.mjs.map} +1 -1
  67. package/dist/client/{images-BZP3pBqj.mjs → images-BiEBENaj.mjs} +2 -2
  68. package/dist/client/{images-BZP3pBqj.mjs.map → images-BiEBENaj.mjs.map} +1 -1
  69. package/dist/client/images-CCYBAphP2.mjs +1900 -0
  70. package/dist/client/images-CCYBAphP2.mjs.map +1 -0
  71. package/dist/client/images-DM9I8G0p.mjs.map +1 -1
  72. package/dist/client/index.d.ts +2 -1
  73. package/dist/client/index.js +410 -412
  74. package/dist/client/index.js.map +1 -1
  75. package/dist/client/{network-SCVadZsv.mjs → network-nbSbl0X0.mjs} +1 -1
  76. package/dist/client/{network-SCVadZsv.mjs.map → network-nbSbl0X0.mjs.map} +1 -1
  77. package/dist/client/{objects-D4zBka5e.mjs → objects-CU5ws07o.mjs} +6 -6
  78. package/dist/client/objects-CU5ws07o.mjs.map +1 -0
  79. package/dist/client/objects-FXN0VWLI.mjs +4760 -0
  80. package/dist/client/{objects-Cw4Vu01M.mjs.map → objects-FXN0VWLI.mjs.map} +1 -1
  81. package/dist/client/{objects-B4yrYf_a.mjs → objects-GmuIOaHd.mjs} +1 -1
  82. package/dist/client/objects-GmuIOaHd.mjs.map +1 -0
  83. package/dist/client/{overview-BtIXpYBo.mjs → overview-B3gdnWTG.mjs} +2 -2
  84. package/dist/client/{overview-BtIXpYBo.mjs.map → overview-B3gdnWTG.mjs.map} +1 -1
  85. package/dist/client/{overview-2J54-loz.mjs → overview-DzYBiNfD.mjs} +2 -2
  86. package/dist/client/{overview-2J54-loz.mjs.map → overview-DzYBiNfD.mjs.map} +1 -1
  87. package/dist/client/{overview-D0AAvsmL.mjs → overview-EhfPY8Je.mjs} +2 -2
  88. package/dist/client/{overview-D0AAvsmL.mjs.map → overview-EhfPY8Je.mjs.map} +1 -1
  89. package/dist/client/{overview-BnmukbFh.mjs → overview-XueZI4LQ.mjs} +7 -7
  90. package/dist/client/{overview-BnmukbFh.mjs.map → overview-XueZI4LQ.mjs.map} +1 -1
  91. package/dist/client/{pca-BqZycwCu.mjs → pca-DSM71LhW.mjs} +2 -2
  92. package/dist/client/{pca-BqZycwCu.mjs.map → pca-DSM71LhW.mjs.map} +1 -1
  93. package/dist/client/{pca-V2aaOxZA.mjs → pca-x9if8xU-.mjs} +59 -59
  94. package/dist/client/{pca-V2aaOxZA.mjs.map → pca-x9if8xU-.mjs.map} +1 -1
  95. package/dist/client/{projects-jyIHL6DE.mjs → projects-B6BPo2Ar.mjs} +2 -2
  96. package/dist/client/projects-B6BPo2Ar.mjs.map +1 -0
  97. package/dist/client/{projects-BsN4bvU2.mjs → projects-BilrmHLu.mjs} +1 -1
  98. package/dist/client/projects-BilrmHLu.mjs.map +1 -0
  99. package/dist/client/{projects-0feOw_b6.mjs → projects-Bt0XptpG.mjs} +2 -2
  100. package/dist/client/projects-Bt0XptpG.mjs.map +1 -0
  101. package/dist/client/projects-CnmZIB2Q.mjs +95 -0
  102. package/dist/client/projects-CnmZIB2Q.mjs.map +1 -0
  103. package/dist/client/{securitygroups-B4MkSBtI.mjs → securitygroups-BdzieS7Z.mjs} +121 -121
  104. package/dist/client/{securitygroups-B4MkSBtI.mjs.map → securitygroups-BdzieS7Z.mjs.map} +1 -1
  105. package/dist/client/{useListWithFiltering-CEDh1LO-.mjs → useListWithFiltering-CqQbAjEe.mjs} +1 -1
  106. package/dist/client/{useListWithFiltering-CEDh1LO-.mjs.map → useListWithFiltering-CqQbAjEe.mjs.map} +1 -1
  107. package/package.json +2 -2
  108. package/dist/client/ListToolbar-DuazvsAu.mjs +0 -223
  109. package/dist/client/ListToolbar-DuazvsAu.mjs.map +0 -1
  110. package/dist/client/_flavorId-B-1fYadl.mjs.map +0 -1
  111. package/dist/client/_flavorId-BYfIHIV_.mjs.map +0 -1
  112. package/dist/client/_floatingIpId-FQ5P2qMV.mjs +0 -228
  113. package/dist/client/_floatingIpId-FQ5P2qMV.mjs.map +0 -1
  114. package/dist/client/_imageId-Tx_9bqEc.mjs.map +0 -1
  115. package/dist/client/_projectId-Bs4W9hos.mjs +0 -283
  116. package/dist/client/_projectId-Bs4W9hos.mjs.map +0 -1
  117. package/dist/client/containers-Cs5vOeR2.mjs.map +0 -1
  118. package/dist/client/containers-DovytjVP.mjs.map +0 -1
  119. package/dist/client/flavors-Bovz-I2U.mjs +0 -565
  120. package/dist/client/flavors-Bovz-I2U.mjs.map +0 -1
  121. package/dist/client/images-DaaCUXMI.mjs +0 -1797
  122. package/dist/client/images-DaaCUXMI.mjs.map +0 -1
  123. package/dist/client/objects-B4yrYf_a.mjs.map +0 -1
  124. package/dist/client/objects-Cw4Vu01M.mjs +0 -4760
  125. package/dist/client/objects-D4zBka5e.mjs.map +0 -1
  126. package/dist/client/projects-0feOw_b6.mjs.map +0 -1
  127. package/dist/client/projects-BsN4bvU2.mjs.map +0 -1
  128. package/dist/client/projects-C1IYOvFQ.mjs +0 -144
  129. package/dist/client/projects-C1IYOvFQ.mjs.map +0 -1
  130. 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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"}
@@ -29,4 +29,4 @@ function n({ defaultSortKey: n, defaultSortDir: r, sortOptions: i, filterSetting
29
29
  //#endregion
30
30
  export { n as t };
31
31
 
32
- //# sourceMappingURL=useListWithFiltering-CEDh1LO-.mjs.map
32
+ //# sourceMappingURL=useListWithFiltering-CqQbAjEe.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useListWithFiltering-CEDh1LO-.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"}
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.2.2",
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": "6.5.0",
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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"}