@backstage-community/plugin-announcements 1.1.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +38 -0
- package/dist/alpha/Router.esm.js +73 -0
- package/dist/alpha/Router.esm.js.map +1 -0
- package/dist/alpha/components/admin/AnnouncementsAdminPage.esm.js +43 -0
- package/dist/alpha/components/admin/AnnouncementsAdminPage.esm.js.map +1 -0
- package/dist/alpha/components/admin/categories/CategoriesContent.esm.js +105 -0
- package/dist/alpha/components/admin/categories/CategoriesContent.esm.js.map +1 -0
- package/dist/alpha/components/admin/categories/CategoriesTable.esm.js +52 -0
- package/dist/alpha/components/admin/categories/CategoriesTable.esm.js.map +1 -0
- package/dist/alpha/components/admin/categories/CategoriesTableCard.esm.js +44 -0
- package/dist/alpha/components/admin/categories/CategoriesTableCard.esm.js.map +1 -0
- package/dist/alpha/components/admin/categories/CreateCatagoryDialog.esm.js +30 -0
- package/dist/alpha/components/admin/categories/CreateCatagoryDialog.esm.js.map +1 -0
- package/dist/alpha/components/admin/shared/CreateTitleDialog/CreateTitleDialog.esm.js +87 -0
- package/dist/alpha/components/admin/shared/CreateTitleDialog/CreateTitleDialog.esm.js.map +1 -0
- package/dist/alpha/components/admin/shared/DeleteConfirmationDialog/DeleteConfirmationDialog.esm.js +43 -0
- package/dist/alpha/components/admin/shared/DeleteConfirmationDialog/DeleteConfirmationDialog.esm.js.map +1 -0
- package/dist/alpha/components/admin/shared/DeleteConfirmationDialog/useDeleteConfirmationDialogState.esm.js +29 -0
- package/dist/alpha/components/admin/shared/DeleteConfirmationDialog/useDeleteConfirmationDialogState.esm.js.map +1 -0
- package/dist/alpha/components/admin/tags/CreateTagDialog.esm.js +30 -0
- package/dist/alpha/components/admin/tags/CreateTagDialog.esm.js.map +1 -0
- package/dist/alpha/components/admin/tags/TagsContent.esm.js +112 -0
- package/dist/alpha/components/admin/tags/TagsContent.esm.js.map +1 -0
- package/dist/alpha/components/admin/tags/TagsTable.esm.js +46 -0
- package/dist/alpha/components/admin/tags/TagsTable.esm.js.map +1 -0
- package/dist/alpha/components/admin/tags/TagsTableCard.esm.js +44 -0
- package/dist/alpha/components/admin/tags/TagsTableCard.esm.js.map +1 -0
- package/dist/alpha/components/announcements/AnnouncementCard.esm.js +77 -0
- package/dist/alpha/components/announcements/AnnouncementCard.esm.js.map +1 -0
- package/dist/alpha/components/announcements/AnnouncementsGrid.esm.js +65 -0
- package/dist/alpha/components/announcements/AnnouncementsGrid.esm.js.map +1 -0
- package/dist/alpha/components/announcements/AnnouncementsPage.esm.js +47 -0
- package/dist/alpha/components/announcements/AnnouncementsPage.esm.js.map +1 -0
- package/dist/alpha/components/announcements/ContextMenu.esm.js +19 -0
- package/dist/alpha/components/announcements/ContextMenu.esm.js.map +1 -0
- package/dist/alpha/components/announcements/ViewAnnouncementPage.esm.js +187 -0
- package/dist/alpha/components/announcements/ViewAnnouncementPage.esm.js.map +1 -0
- package/dist/alpha/navItems.esm.js +1 -1
- package/dist/alpha/navItems.esm.js.map +1 -1
- package/dist/alpha/pages.esm.js +1 -1
- package/dist/alpha/pages.esm.js.map +1 -1
- package/dist/alpha.d.ts +5 -13
- package/dist/alpha.esm.js +1 -1
- package/dist/alpha.esm.js.map +1 -1
- package/dist/components/Admin/AnnouncementsContent/AnnouncementForm/OnBehalfTeamDropdown.esm.js +0 -2
- package/dist/components/Admin/AnnouncementsContent/AnnouncementForm/OnBehalfTeamDropdown.esm.js.map +1 -1
- package/dist/components/Admin/AnnouncementsContent/AnnouncementsContent.esm.js +3 -3
- package/dist/components/Admin/AnnouncementsContent/AnnouncementsContent.esm.js.map +1 -1
- package/dist/components/Admin/CategoriesContent/CategoriesContent.esm.js +16 -4
- package/dist/components/Admin/CategoriesContent/CategoriesContent.esm.js.map +1 -1
- package/dist/components/Admin/TagsContent/TagsContent.esm.js +21 -4
- package/dist/components/Admin/TagsContent/TagsContent.esm.js.map +1 -1
- package/dist/components/Admin/shared/DeleteDialog/DeleteDialog.esm.js.map +1 -0
- package/dist/components/Admin/shared/DeleteDialog/useDeleteDialogState.esm.js.map +1 -0
- package/dist/components/Admin/shared/TitleForm/TitleForm.esm.js +71 -0
- package/dist/components/Admin/shared/TitleForm/TitleForm.esm.js.map +1 -0
- package/dist/components/index.esm.js +1 -0
- package/dist/components/index.esm.js.map +1 -1
- package/dist/index.d.ts +13 -5
- package/dist/plugin.esm.js.map +1 -1
- package/dist/routes.esm.js +14 -4
- package/dist/routes.esm.js.map +1 -1
- package/package.json +21 -19
- package/dist/components/Admin/CategoriesContent/CategoriesForm.esm.js +0 -71
- package/dist/components/Admin/CategoriesContent/CategoriesForm.esm.js.map +0 -1
- package/dist/components/Admin/DeleteDialog/DeleteDialog.esm.js.map +0 -1
- package/dist/components/Admin/DeleteDialog/useDeleteDialogState.esm.js.map +0 -1
- package/dist/components/Admin/TagsContent/TagsForm.esm.js +0 -81
- package/dist/components/Admin/TagsContent/TagsForm.esm.js.map +0 -1
- /package/dist/components/Admin/{DeleteDialog → shared/DeleteDialog}/DeleteDialog.esm.js +0 -0
- /package/dist/components/Admin/{DeleteDialog → shared/DeleteDialog}/useDeleteDialogState.esm.js +0 -0
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { useState, useCallback } from 'react';
|
|
2
|
+
|
|
3
|
+
function useDeleteConfirmationDialogState() {
|
|
4
|
+
const [state, setState] = useState({ open: false });
|
|
5
|
+
const setOpen = useCallback(
|
|
6
|
+
(t) => {
|
|
7
|
+
setState({
|
|
8
|
+
open: true,
|
|
9
|
+
item: t
|
|
10
|
+
});
|
|
11
|
+
},
|
|
12
|
+
[setState]
|
|
13
|
+
);
|
|
14
|
+
const setClosed = useCallback(() => {
|
|
15
|
+
setState({
|
|
16
|
+
open: false,
|
|
17
|
+
item: void 0
|
|
18
|
+
});
|
|
19
|
+
}, [setState]);
|
|
20
|
+
return {
|
|
21
|
+
open: setOpen,
|
|
22
|
+
close: setClosed,
|
|
23
|
+
item: state.item,
|
|
24
|
+
isOpen: state.open
|
|
25
|
+
};
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
export { useDeleteConfirmationDialogState };
|
|
29
|
+
//# sourceMappingURL=useDeleteConfirmationDialogState.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDeleteConfirmationDialogState.esm.js","sources":["../../../../../../src/alpha/components/admin/shared/DeleteConfirmationDialog/useDeleteConfirmationDialogState.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useState, useCallback } from 'react';\n\ntype DeleteConfirmationDialogState<T> = {\n open: (t: T) => void;\n close: () => void;\n isOpen: boolean;\n item?: T;\n};\n\nexport function useDeleteConfirmationDialogState<\n T,\n>(): DeleteConfirmationDialogState<T> {\n const [state, setState] = useState<{\n open: boolean;\n item?: T;\n }>({ open: false });\n\n const setOpen = useCallback(\n (t: T) => {\n setState({\n open: true,\n item: t,\n });\n },\n [setState],\n );\n\n const setClosed = useCallback(() => {\n setState({\n open: false,\n item: undefined,\n });\n }, [setState]);\n\n return {\n open: setOpen,\n close: setClosed,\n\n item: state.item,\n isOpen: state.open,\n };\n}\n"],"names":[],"mappings":";;AAwBO,SAAS,gCAEsB,GAAA;AACpC,EAAM,MAAA,CAAC,OAAO,QAAQ,CAAA,GAAI,SAGvB,EAAE,IAAA,EAAM,OAAO,CAAA;AAElB,EAAA,MAAM,OAAU,GAAA,WAAA;AAAA,IACd,CAAC,CAAS,KAAA;AACR,MAAS,QAAA,CAAA;AAAA,QACP,IAAM,EAAA,IAAA;AAAA,QACN,IAAM,EAAA;AAAA,OACP,CAAA;AAAA,KACH;AAAA,IACA,CAAC,QAAQ;AAAA,GACX;AAEA,EAAM,MAAA,SAAA,GAAY,YAAY,MAAM;AAClC,IAAS,QAAA,CAAA;AAAA,MACP,IAAM,EAAA,KAAA;AAAA,MACN,IAAM,EAAA,KAAA;AAAA,KACP,CAAA;AAAA,GACH,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,EAAO,OAAA;AAAA,IACL,IAAM,EAAA,OAAA;AAAA,IACN,KAAO,EAAA,SAAA;AAAA,IAEP,MAAM,KAAM,CAAA,IAAA;AAAA,IACZ,QAAQ,KAAM,CAAA;AAAA,GAChB;AACF;;;;"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
|
|
3
|
+
import 'react';
|
|
4
|
+
import '@backstage/ui';
|
|
5
|
+
import { CreateTitleDialog } from '../shared/CreateTitleDialog/CreateTitleDialog.esm.js';
|
|
6
|
+
|
|
7
|
+
const CreateTagDialog = (props) => {
|
|
8
|
+
const { open, onConfirm, onCancel, canSubmit } = props;
|
|
9
|
+
const { t } = useAnnouncementsTranslation();
|
|
10
|
+
const translationKeys = {
|
|
11
|
+
new: t("tagsForm.newTag"),
|
|
12
|
+
edit: t("tagsForm.editTag"),
|
|
13
|
+
titleLabel: t("tagsForm.titleLabel"),
|
|
14
|
+
submit: t("tagsForm.submit"),
|
|
15
|
+
cancel: t("admin.tagsContent.cancelButton")
|
|
16
|
+
};
|
|
17
|
+
return /* @__PURE__ */ jsx(
|
|
18
|
+
CreateTitleDialog,
|
|
19
|
+
{
|
|
20
|
+
open,
|
|
21
|
+
onCancel,
|
|
22
|
+
translationKeys,
|
|
23
|
+
onSubmit: onConfirm,
|
|
24
|
+
canSubmit
|
|
25
|
+
}
|
|
26
|
+
);
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
export { CreateTagDialog };
|
|
30
|
+
//# sourceMappingURL=CreateTagDialog.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CreateTagDialog.esm.js","sources":["../../../../../src/alpha/components/admin/tags/CreateTagDialog.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n CreateTagRequest,\n useAnnouncementsTranslation,\n} from '@backstage-community/plugin-announcements-react';\nimport { CreateTitleDialog } from '../shared';\n\n/**\n * @internal\n */\ntype CreateTagDialogProps = {\n open: boolean;\n onConfirm: (request: CreateTagRequest) => Promise<void>;\n onCancel: () => void;\n canSubmit?: boolean;\n};\n\n/**\n * @internal\n */\nexport const CreateTagDialog = (props: CreateTagDialogProps) => {\n const { open, onConfirm, onCancel, canSubmit } = props;\n\n const { t } = useAnnouncementsTranslation();\n\n const translationKeys = {\n new: t('tagsForm.newTag'),\n edit: t('tagsForm.editTag'),\n titleLabel: t('tagsForm.titleLabel'),\n submit: t('tagsForm.submit'),\n cancel: t('admin.tagsContent.cancelButton'),\n };\n\n return (\n <CreateTitleDialog<CreateTagRequest>\n open={open}\n onCancel={onCancel}\n translationKeys={translationKeys}\n onSubmit={onConfirm}\n canSubmit={canSubmit}\n />\n );\n};\n"],"names":[],"mappings":";;;;;;AAmCa,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAA,MAAM,EAAE,IAAA,EAAM,SAAW,EAAA,QAAA,EAAU,WAAc,GAAA,KAAA;AAEjD,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAA,MAAM,eAAkB,GAAA;AAAA,IACtB,GAAA,EAAK,EAAE,iBAAiB,CAAA;AAAA,IACxB,IAAA,EAAM,EAAE,kBAAkB,CAAA;AAAA,IAC1B,UAAA,EAAY,EAAE,qBAAqB,CAAA;AAAA,IACnC,MAAA,EAAQ,EAAE,iBAAiB,CAAA;AAAA,IAC3B,MAAA,EAAQ,EAAE,gCAAgC;AAAA,GAC5C;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,iBAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,QAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAU,EAAA,SAAA;AAAA,MACV;AAAA;AAAA,GACF;AAEJ;;;;"}
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useState } from 'react';
|
|
3
|
+
import { useTags, announcementsApiRef, useAnnouncementsTranslation, useAnnouncementsPermissions } from '@backstage-community/plugin-announcements-react';
|
|
4
|
+
import { useApi, alertApiRef } from '@backstage/core-plugin-api';
|
|
5
|
+
import { useDeleteConfirmationDialogState } from '../shared/DeleteConfirmationDialog/useDeleteConfirmationDialogState.esm.js';
|
|
6
|
+
import { DeleteConfirmationDialog } from '../shared/DeleteConfirmationDialog/DeleteConfirmationDialog.esm.js';
|
|
7
|
+
import '@backstage/ui';
|
|
8
|
+
import { CreateTagDialog } from './CreateTagDialog.esm.js';
|
|
9
|
+
import { TagsTableCard } from './TagsTableCard.esm.js';
|
|
10
|
+
|
|
11
|
+
const TagsContent = () => {
|
|
12
|
+
const [showNewTagForm, setShowNewTagForm] = useState(false);
|
|
13
|
+
const { tags, retry: refresh } = useTags();
|
|
14
|
+
const announcementsApi = useApi(announcementsApiRef);
|
|
15
|
+
const alertApi = useApi(alertApiRef);
|
|
16
|
+
const { t } = useAnnouncementsTranslation();
|
|
17
|
+
const permissions = useAnnouncementsPermissions();
|
|
18
|
+
const {
|
|
19
|
+
isOpen: isDeleteDialogOpen,
|
|
20
|
+
close: closeDeleteDialog,
|
|
21
|
+
open: openDeleteDialog,
|
|
22
|
+
item: tagToDelete
|
|
23
|
+
} = useDeleteConfirmationDialogState();
|
|
24
|
+
const onConfirmCreate = async (request) => {
|
|
25
|
+
const { title } = request;
|
|
26
|
+
try {
|
|
27
|
+
await announcementsApi.createTag({
|
|
28
|
+
title
|
|
29
|
+
});
|
|
30
|
+
alertApi.post({
|
|
31
|
+
message: `${title} ${t("admin.tagsContent.createdMessage")}`,
|
|
32
|
+
severity: "success"
|
|
33
|
+
});
|
|
34
|
+
setShowNewTagForm(false);
|
|
35
|
+
refresh();
|
|
36
|
+
} catch (err) {
|
|
37
|
+
if (err.response?.status === 409) {
|
|
38
|
+
alertApi.post({
|
|
39
|
+
message: t("admin.tagsContent.errors.alreadyExists"),
|
|
40
|
+
severity: "error"
|
|
41
|
+
});
|
|
42
|
+
} else {
|
|
43
|
+
alertApi.post({ message: err.message, severity: "error" });
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
const onCreateButtonClick = () => {
|
|
48
|
+
setShowNewTagForm(true);
|
|
49
|
+
};
|
|
50
|
+
const onCancelCreate = () => {
|
|
51
|
+
setShowNewTagForm(false);
|
|
52
|
+
};
|
|
53
|
+
const onCancelDelete = () => {
|
|
54
|
+
closeDeleteDialog();
|
|
55
|
+
};
|
|
56
|
+
const onConfirmDelete = async () => {
|
|
57
|
+
closeDeleteDialog();
|
|
58
|
+
try {
|
|
59
|
+
await announcementsApi.deleteTag(tagToDelete.slug);
|
|
60
|
+
alertApi.post({
|
|
61
|
+
message: t("admin.tagsContent.table.tagDeleted"),
|
|
62
|
+
severity: "success"
|
|
63
|
+
});
|
|
64
|
+
} catch (err) {
|
|
65
|
+
alertApi.post({
|
|
66
|
+
message: err.body.error.message,
|
|
67
|
+
severity: "error"
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
refresh();
|
|
71
|
+
};
|
|
72
|
+
const onDeleteClick = (tag) => {
|
|
73
|
+
openDeleteDialog(tag);
|
|
74
|
+
};
|
|
75
|
+
const canCreate = !permissions.create.loading && permissions.create.allowed;
|
|
76
|
+
const canDelete = !permissions.delete.loading && permissions.delete.allowed;
|
|
77
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
78
|
+
/* @__PURE__ */ jsx(
|
|
79
|
+
TagsTableCard,
|
|
80
|
+
{
|
|
81
|
+
tags: tags ?? [],
|
|
82
|
+
onCreateClick: onCreateButtonClick,
|
|
83
|
+
onDeleteClick,
|
|
84
|
+
canCreate,
|
|
85
|
+
canDelete
|
|
86
|
+
}
|
|
87
|
+
),
|
|
88
|
+
/* @__PURE__ */ jsx(
|
|
89
|
+
CreateTagDialog,
|
|
90
|
+
{
|
|
91
|
+
open: showNewTagForm,
|
|
92
|
+
onConfirm: onConfirmCreate,
|
|
93
|
+
onCancel: onCancelCreate,
|
|
94
|
+
canSubmit: canCreate
|
|
95
|
+
}
|
|
96
|
+
),
|
|
97
|
+
/* @__PURE__ */ jsx(
|
|
98
|
+
DeleteConfirmationDialog,
|
|
99
|
+
{
|
|
100
|
+
type: "tag",
|
|
101
|
+
itemTitle: tagToDelete?.title,
|
|
102
|
+
open: isDeleteDialogOpen,
|
|
103
|
+
onCancel: onCancelDelete,
|
|
104
|
+
onConfirm: onConfirmDelete,
|
|
105
|
+
canDelete
|
|
106
|
+
}
|
|
107
|
+
)
|
|
108
|
+
] });
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
export { TagsContent };
|
|
112
|
+
//# sourceMappingURL=TagsContent.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagsContent.esm.js","sources":["../../../../../src/alpha/components/admin/tags/TagsContent.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useState } from 'react';\nimport {\n CreateTagRequest,\n announcementsApiRef,\n useAnnouncementsTranslation,\n useTags,\n useAnnouncementsPermissions,\n} from '@backstage-community/plugin-announcements-react';\nimport { Tag } from '@backstage-community/plugin-announcements-common';\nimport { useApi, alertApiRef } from '@backstage/core-plugin-api';\nimport { ResponseError } from '@backstage/errors';\n\nimport {\n useDeleteConfirmationDialogState,\n DeleteConfirmationDialog,\n} from '../shared';\nimport { CreateTagDialog } from './CreateTagDialog';\nimport { TagsTableCard } from './TagsTableCard';\n\n/**\n * @internal\n */\nexport const TagsContent = () => {\n const [showNewTagForm, setShowNewTagForm] = useState(false);\n const { tags, retry: refresh } = useTags();\n const announcementsApi = useApi(announcementsApiRef);\n const alertApi = useApi(alertApiRef);\n const { t } = useAnnouncementsTranslation();\n const permissions = useAnnouncementsPermissions();\n\n const {\n isOpen: isDeleteDialogOpen,\n close: closeDeleteDialog,\n open: openDeleteDialog,\n item: tagToDelete,\n } = useDeleteConfirmationDialogState<Tag>();\n\n const onConfirmCreate = async (request: CreateTagRequest) => {\n const { title } = request;\n\n try {\n await announcementsApi.createTag({\n title,\n });\n\n alertApi.post({\n message: `${title} ${t('admin.tagsContent.createdMessage')}`,\n severity: 'success',\n });\n\n setShowNewTagForm(false);\n refresh();\n } catch (err: any) {\n if (err.response?.status === 409) {\n alertApi.post({\n message: t('admin.tagsContent.errors.alreadyExists'),\n severity: 'error',\n });\n } else {\n alertApi.post({ message: (err as Error).message, severity: 'error' });\n }\n }\n };\n\n const onCreateButtonClick = () => {\n setShowNewTagForm(true);\n };\n\n const onCancelCreate = () => {\n setShowNewTagForm(false);\n };\n\n const onCancelDelete = () => {\n closeDeleteDialog();\n };\n\n const onConfirmDelete = async () => {\n closeDeleteDialog();\n\n try {\n await announcementsApi.deleteTag(tagToDelete!.slug);\n\n alertApi.post({\n message: t('admin.tagsContent.table.tagDeleted'),\n severity: 'success',\n });\n } catch (err) {\n alertApi.post({\n message: (err as ResponseError).body.error.message,\n severity: 'error',\n });\n }\n\n refresh();\n };\n\n const onDeleteClick = (tag: Tag) => {\n openDeleteDialog(tag);\n };\n\n const canCreate = !permissions.create.loading && permissions.create.allowed;\n const canDelete = !permissions.delete.loading && permissions.delete.allowed;\n\n return (\n <>\n <TagsTableCard\n tags={tags ?? []}\n onCreateClick={onCreateButtonClick}\n onDeleteClick={onDeleteClick}\n canCreate={canCreate}\n canDelete={canDelete}\n />\n\n <CreateTagDialog\n open={showNewTagForm}\n onConfirm={onConfirmCreate}\n onCancel={onCancelCreate}\n canSubmit={canCreate}\n />\n\n <DeleteConfirmationDialog\n type=\"tag\"\n itemTitle={tagToDelete?.title}\n open={isDeleteDialogOpen}\n onCancel={onCancelDelete}\n onConfirm={onConfirmDelete}\n canDelete={canDelete}\n />\n </>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
|
|
3
|
+
import { Table, TableHeader, Column, TableBody, Row, CellText, Cell, ButtonIcon } from '@backstage/ui';
|
|
4
|
+
import { RiDeleteBinLine } from '@remixicon/react';
|
|
5
|
+
|
|
6
|
+
const TagsTableEmptyState = () => {
|
|
7
|
+
const { t } = useAnnouncementsTranslation();
|
|
8
|
+
return /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(CellText, { colSpan: 3, title: t("admin.tagsContent.table.noTagsFound") }) });
|
|
9
|
+
};
|
|
10
|
+
const TagTableRow = (props) => {
|
|
11
|
+
const { tag, onDeleteClick } = props;
|
|
12
|
+
return /* @__PURE__ */ jsxs(Row, { children: [
|
|
13
|
+
/* @__PURE__ */ jsx(CellText, { title: tag.title }),
|
|
14
|
+
/* @__PURE__ */ jsx(CellText, { title: tag.slug }),
|
|
15
|
+
/* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsx(
|
|
16
|
+
ButtonIcon,
|
|
17
|
+
{
|
|
18
|
+
icon: /* @__PURE__ */ jsx(RiDeleteBinLine, {}),
|
|
19
|
+
variant: "tertiary",
|
|
20
|
+
onClick: () => onDeleteClick(tag)
|
|
21
|
+
}
|
|
22
|
+
) })
|
|
23
|
+
] }, tag.slug);
|
|
24
|
+
};
|
|
25
|
+
const TagsTable = (props) => {
|
|
26
|
+
const { data, onDeleteClick } = props;
|
|
27
|
+
const { t } = useAnnouncementsTranslation();
|
|
28
|
+
return /* @__PURE__ */ jsxs(Table, { children: [
|
|
29
|
+
/* @__PURE__ */ jsxs(TableHeader, { children: [
|
|
30
|
+
/* @__PURE__ */ jsx(Column, { id: "title", isRowHeader: true, children: t("admin.tagsContent.table.title") }),
|
|
31
|
+
/* @__PURE__ */ jsx(Column, { id: "slug", children: t("admin.tagsContent.table.slug") }),
|
|
32
|
+
/* @__PURE__ */ jsx(Column, { id: "actions", children: t("admin.tagsContent.table.actions") })
|
|
33
|
+
] }),
|
|
34
|
+
/* @__PURE__ */ jsx(TableBody, { children: data.length > 0 ? data.map((tag) => /* @__PURE__ */ jsx(
|
|
35
|
+
TagTableRow,
|
|
36
|
+
{
|
|
37
|
+
tag,
|
|
38
|
+
onDeleteClick
|
|
39
|
+
},
|
|
40
|
+
tag.slug
|
|
41
|
+
)) : /* @__PURE__ */ jsx(TagsTableEmptyState, {}) })
|
|
42
|
+
] });
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
export { TagsTable };
|
|
46
|
+
//# sourceMappingURL=TagsTable.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagsTable.esm.js","sources":["../../../../../src/alpha/components/admin/tags/TagsTable.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Tag } from '@backstage-community/plugin-announcements-common';\nimport { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';\nimport {\n CellText,\n Column,\n Row,\n Table,\n TableBody,\n TableHeader,\n Cell,\n ButtonIcon,\n} from '@backstage/ui';\nimport { RiDeleteBinLine } from '@remixicon/react';\n\nconst TagsTableEmptyState = () => {\n const { t } = useAnnouncementsTranslation();\n\n return (\n <Row>\n <CellText colSpan={3} title={t('admin.tagsContent.table.noTagsFound')} />\n </Row>\n );\n};\n\ntype TagTableRowProps = {\n tag: Tag;\n onDeleteClick?: (tag: Tag) => void;\n};\n\nconst TagTableRow = (props: TagTableRowProps) => {\n const { tag, onDeleteClick } = props;\n\n return (\n <Row key={tag.slug}>\n <CellText title={tag.title} />\n <CellText title={tag.slug} />\n <Cell>\n <ButtonIcon\n icon={<RiDeleteBinLine />}\n variant=\"tertiary\"\n onClick={() => onDeleteClick!(tag)}\n />\n </Cell>\n </Row>\n );\n};\n\n/**\n * @internal\n */\ntype TagsTableProps = {\n data: Tag[];\n onDeleteClick?: (tag: Tag) => void;\n};\n\n/**\n * @internal\n */\nexport const TagsTable = (props: TagsTableProps) => {\n const { data, onDeleteClick } = props;\n const { t } = useAnnouncementsTranslation();\n\n return (\n <Table>\n <TableHeader>\n <Column id=\"title\" isRowHeader>\n {t('admin.tagsContent.table.title')}\n </Column>\n <Column id=\"slug\">{t('admin.tagsContent.table.slug')}</Column>\n <Column id=\"actions\">{t('admin.tagsContent.table.actions')}</Column>\n </TableHeader>\n <TableBody>\n {data.length > 0 ? (\n data.map(tag => (\n <TagTableRow\n key={tag.slug}\n tag={tag}\n onDeleteClick={onDeleteClick}\n />\n ))\n ) : (\n <TagsTableEmptyState />\n )}\n </TableBody>\n </Table>\n );\n};\n"],"names":[],"mappings":";;;;;AA8BA,MAAM,sBAAsB,MAAM;AAChC,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EACE,uBAAA,GAAA,CAAC,GACC,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,QAAS,EAAA,EAAA,OAAA,EAAS,GAAG,KAAO,EAAA,CAAA,CAAE,qCAAqC,CAAA,EAAG,CACzE,EAAA,CAAA;AAEJ,CAAA;AAOA,MAAM,WAAA,GAAc,CAAC,KAA4B,KAAA;AAC/C,EAAM,MAAA,EAAE,GAAK,EAAA,aAAA,EAAkB,GAAA,KAAA;AAE/B,EAAA,4BACG,GACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,GAAA,CAAI,KAAO,EAAA,CAAA;AAAA,oBAC3B,GAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,GAAA,CAAI,IAAM,EAAA,CAAA;AAAA,wBAC1B,IACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,IAAA,sBAAO,eAAgB,EAAA,EAAA,CAAA;AAAA,QACvB,OAAQ,EAAA,UAAA;AAAA,QACR,OAAA,EAAS,MAAM,aAAA,CAAe,GAAG;AAAA;AAAA,KAErC,EAAA;AAAA,GAAA,EAAA,EATQ,IAAI,IAUd,CAAA;AAEJ,CAAA;AAaa,MAAA,SAAA,GAAY,CAAC,KAA0B,KAAA;AAClD,EAAM,MAAA,EAAE,IAAM,EAAA,aAAA,EAAkB,GAAA,KAAA;AAChC,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAA,4BACG,KACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,WACC,EAAA,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,UAAO,EAAG,EAAA,OAAA,EAAQ,aAAW,IAC3B,EAAA,QAAA,EAAA,CAAA,CAAE,+BAA+B,CACpC,EAAA,CAAA;AAAA,0BACC,MAAO,EAAA,EAAA,EAAA,EAAG,MAAQ,EAAA,QAAA,EAAA,CAAA,CAAE,8BAA8B,CAAE,EAAA,CAAA;AAAA,0BACpD,MAAO,EAAA,EAAA,EAAA,EAAG,SAAW,EAAA,QAAA,EAAA,CAAA,CAAE,iCAAiC,CAAE,EAAA;AAAA,KAC7D,EAAA,CAAA;AAAA,wBACC,SACE,EAAA,EAAA,QAAA,EAAA,IAAA,CAAK,SAAS,CACb,GAAA,IAAA,CAAK,IAAI,CACP,GAAA,qBAAA,GAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QAEC,GAAA;AAAA,QACA;AAAA,OAAA;AAAA,MAFK,GAAI,CAAA;AAAA,KAIZ,CAAA,mBAEA,GAAA,CAAA,mBAAA,EAAA,EAAoB,CAEzB,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useState, useMemo } from 'react';
|
|
3
|
+
import { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
|
|
4
|
+
import { Card, CardHeader, Flex, Text, Button, CardBody, CardFooter, TablePagination } from '@backstage/ui';
|
|
5
|
+
import { TagsTable } from './TagsTable.esm.js';
|
|
6
|
+
|
|
7
|
+
const TagsTableCard = (props) => {
|
|
8
|
+
const { tags, onCreateClick, onDeleteClick, canCreate, canDelete } = props;
|
|
9
|
+
const [pageSize, setPageSize] = useState(5);
|
|
10
|
+
const [offset, setOffset] = useState(0);
|
|
11
|
+
const { t } = useAnnouncementsTranslation();
|
|
12
|
+
const paginatedTags = useMemo(() => {
|
|
13
|
+
const start = offset;
|
|
14
|
+
const end = offset + pageSize;
|
|
15
|
+
return tags.slice(start, end);
|
|
16
|
+
}, [tags, offset, pageSize]);
|
|
17
|
+
const title = `${t("tagsPage.title")} (${tags.length})`;
|
|
18
|
+
return /* @__PURE__ */ jsxs(Card, { children: [
|
|
19
|
+
/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(Flex, { justify: "between", align: "center", children: [
|
|
20
|
+
/* @__PURE__ */ jsx(Text, { variant: "title-x-small", children: title }),
|
|
21
|
+
/* @__PURE__ */ jsx(Button, { isDisabled: !canCreate, onClick: onCreateClick, children: t("admin.tagsContent.createButton") })
|
|
22
|
+
] }) }),
|
|
23
|
+
/* @__PURE__ */ jsx(CardBody, { children: /* @__PURE__ */ jsx(
|
|
24
|
+
TagsTable,
|
|
25
|
+
{
|
|
26
|
+
data: paginatedTags,
|
|
27
|
+
onDeleteClick: canDelete ? onDeleteClick : void 0
|
|
28
|
+
}
|
|
29
|
+
) }),
|
|
30
|
+
tags.length > 0 && /* @__PURE__ */ jsx(CardFooter, { children: /* @__PURE__ */ jsx(
|
|
31
|
+
TablePagination,
|
|
32
|
+
{
|
|
33
|
+
offset,
|
|
34
|
+
pageSize,
|
|
35
|
+
setOffset,
|
|
36
|
+
setPageSize,
|
|
37
|
+
rowCount: tags.length
|
|
38
|
+
}
|
|
39
|
+
) })
|
|
40
|
+
] });
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
export { TagsTableCard };
|
|
44
|
+
//# sourceMappingURL=TagsTableCard.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagsTableCard.esm.js","sources":["../../../../../src/alpha/components/admin/tags/TagsTableCard.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useState, useMemo } from 'react';\nimport { Tag } from '@backstage-community/plugin-announcements-common';\nimport { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';\nimport {\n Button,\n TablePagination,\n Card,\n CardBody,\n CardFooter,\n CardHeader,\n Text,\n Flex,\n} from '@backstage/ui';\n\nimport { TagsTable } from './TagsTable';\n\n/**\n * @internal\n */\ntype TagsTableCardProps = {\n tags: Tag[];\n onCreateClick: () => void;\n onDeleteClick: (tag: Tag) => void;\n canCreate: boolean;\n canDelete: boolean;\n};\n\n/**\n * @internal\n */\nexport const TagsTableCard = (props: TagsTableCardProps) => {\n const { tags, onCreateClick, onDeleteClick, canCreate, canDelete } = props;\n\n const [pageSize, setPageSize] = useState(5);\n const [offset, setOffset] = useState(0);\n const { t } = useAnnouncementsTranslation();\n\n const paginatedTags = useMemo(() => {\n const start = offset;\n const end = offset + pageSize;\n return tags.slice(start, end);\n }, [tags, offset, pageSize]);\n\n const title = `${t('tagsPage.title')} (${tags.length})`;\n\n return (\n <Card>\n <CardHeader>\n <Flex justify=\"between\" align=\"center\">\n <Text variant=\"title-x-small\">{title}</Text>\n <Button isDisabled={!canCreate} onClick={onCreateClick}>\n {t('admin.tagsContent.createButton')}\n </Button>\n </Flex>\n </CardHeader>\n\n <CardBody>\n <TagsTable\n data={paginatedTags}\n onDeleteClick={canDelete ? onDeleteClick : undefined}\n />\n </CardBody>\n\n {tags.length > 0 && (\n <CardFooter>\n <TablePagination\n offset={offset}\n pageSize={pageSize}\n setOffset={setOffset}\n setPageSize={setPageSize}\n rowCount={tags.length}\n />\n </CardFooter>\n )}\n </Card>\n );\n};\n"],"names":[],"mappings":";;;;;;AA6Ca,MAAA,aAAA,GAAgB,CAAC,KAA8B,KAAA;AAC1D,EAAA,MAAM,EAAE,IAAM,EAAA,aAAA,EAAe,aAAe,EAAA,SAAA,EAAW,WAAc,GAAA,KAAA;AAErE,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAAS,CAAC,CAAA;AAC1C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,CAAC,CAAA;AACtC,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAM,MAAA,aAAA,GAAgB,QAAQ,MAAM;AAClC,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAA,MAAM,MAAM,MAAS,GAAA,QAAA;AACrB,IAAO,OAAA,IAAA,CAAK,KAAM,CAAA,KAAA,EAAO,GAAG,CAAA;AAAA,GAC3B,EAAA,CAAC,IAAM,EAAA,MAAA,EAAQ,QAAQ,CAAC,CAAA;AAE3B,EAAA,MAAM,QAAQ,CAAG,EAAA,CAAA,CAAE,gBAAgB,CAAC,CAAA,EAAA,EAAK,KAAK,MAAM,CAAA,CAAA,CAAA;AAEpD,EAAA,4BACG,IACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,cACC,QAAC,kBAAA,IAAA,CAAA,IAAA,EAAA,EAAK,OAAQ,EAAA,SAAA,EAAU,OAAM,QAC5B,EAAA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,IAAA,EAAA,EAAK,OAAQ,EAAA,eAAA,EAAiB,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,sBACrC,GAAA,CAAC,UAAO,UAAY,EAAA,CAAC,WAAW,OAAS,EAAA,aAAA,EACtC,QAAE,EAAA,CAAA,CAAA,gCAAgC,CACrC,EAAA;AAAA,KAAA,EACF,CACF,EAAA,CAAA;AAAA,wBAEC,QACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QACC,IAAM,EAAA,aAAA;AAAA,QACN,aAAA,EAAe,YAAY,aAAgB,GAAA,KAAA;AAAA;AAAA,KAE/C,EAAA,CAAA;AAAA,IAEC,IAAK,CAAA,MAAA,GAAS,CACb,oBAAA,GAAA,CAAC,UACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,eAAA;AAAA,MAAA;AAAA,QACC,MAAA;AAAA,QACA,QAAA;AAAA,QACA,SAAA;AAAA,QACA,WAAA;AAAA,QACA,UAAU,IAAK,CAAA;AAAA;AAAA,KAEnB,EAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
|
+
import { DateTime } from 'luxon';
|
|
3
|
+
import { useRouteRef } from '@backstage/core-plugin-api';
|
|
4
|
+
import { EntityRefLink } from '@backstage/plugin-catalog-react';
|
|
5
|
+
import { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
|
|
6
|
+
import { Box, Text, Link, Card, CardHeader, Flex, CardBody, CardFooter, TagGroup, Tag } from '@backstage/ui';
|
|
7
|
+
import { formatAnnouncementStartTime } from '../../../components/utils/announcementDateUtils.esm.js';
|
|
8
|
+
import { rootRouteRef, announcementViewRouteRef } from '../../../routes.esm.js';
|
|
9
|
+
|
|
10
|
+
const AnnouncementCard = ({
|
|
11
|
+
announcement,
|
|
12
|
+
hideStartAt
|
|
13
|
+
}) => {
|
|
14
|
+
const announcementsLink = useRouteRef(rootRouteRef);
|
|
15
|
+
const viewAnnouncementLink = useRouteRef(announcementViewRouteRef);
|
|
16
|
+
const { t } = useAnnouncementsTranslation();
|
|
17
|
+
const subTitle = /* @__PURE__ */ jsxs(Box, { mt: "1", children: [
|
|
18
|
+
/* @__PURE__ */ jsxs(Text, { variant: "body-small", as: "span", children: [
|
|
19
|
+
t("announcementsPage.card.by"),
|
|
20
|
+
" ",
|
|
21
|
+
/* @__PURE__ */ jsx(
|
|
22
|
+
EntityRefLink,
|
|
23
|
+
{
|
|
24
|
+
entityRef: announcement.on_behalf_of || announcement.publisher,
|
|
25
|
+
hideIcon: true
|
|
26
|
+
}
|
|
27
|
+
),
|
|
28
|
+
announcement.category && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
29
|
+
" ",
|
|
30
|
+
t("announcementsPage.card.in"),
|
|
31
|
+
" ",
|
|
32
|
+
/* @__PURE__ */ jsx(
|
|
33
|
+
Link,
|
|
34
|
+
{
|
|
35
|
+
href: `${announcementsLink()}?category=${announcement.category.slug}`,
|
|
36
|
+
children: announcement.category.title
|
|
37
|
+
}
|
|
38
|
+
)
|
|
39
|
+
] }),
|
|
40
|
+
", ",
|
|
41
|
+
DateTime.fromISO(announcement.created_at).toRelative()
|
|
42
|
+
] }),
|
|
43
|
+
!hideStartAt && /* @__PURE__ */ jsx(Text, { variant: "body-x-small", as: "p", children: formatAnnouncementStartTime(
|
|
44
|
+
announcement.start_at,
|
|
45
|
+
t("announcementsCard.occurred"),
|
|
46
|
+
t("announcementsCard.scheduled"),
|
|
47
|
+
t("announcementsCard.today")
|
|
48
|
+
) })
|
|
49
|
+
] });
|
|
50
|
+
return /* @__PURE__ */ jsxs(Card, { children: [
|
|
51
|
+
/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", children: [
|
|
52
|
+
/* @__PURE__ */ jsx(
|
|
53
|
+
Link,
|
|
54
|
+
{
|
|
55
|
+
variant: "title-x-small",
|
|
56
|
+
href: viewAnnouncementLink({ id: announcement.id }),
|
|
57
|
+
truncate: true,
|
|
58
|
+
children: announcement.title
|
|
59
|
+
}
|
|
60
|
+
),
|
|
61
|
+
subTitle
|
|
62
|
+
] }) }),
|
|
63
|
+
/* @__PURE__ */ jsx(CardBody, { children: /* @__PURE__ */ jsx(Text, { children: announcement.excerpt }) }),
|
|
64
|
+
/* @__PURE__ */ jsx(CardFooter, { children: announcement.tags && announcement.tags.length > 0 && /* @__PURE__ */ jsx(TagGroup, { "aria-label": "Announcement Tags", children: announcement.tags.map((tag) => /* @__PURE__ */ jsx(
|
|
65
|
+
Tag,
|
|
66
|
+
{
|
|
67
|
+
size: "small",
|
|
68
|
+
href: `${announcementsLink()}?tags=${tag.slug}`,
|
|
69
|
+
children: tag.title
|
|
70
|
+
},
|
|
71
|
+
tag.slug
|
|
72
|
+
)) }) })
|
|
73
|
+
] });
|
|
74
|
+
};
|
|
75
|
+
|
|
76
|
+
export { AnnouncementCard };
|
|
77
|
+
//# sourceMappingURL=AnnouncementCard.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AnnouncementCard.esm.js","sources":["../../../../src/alpha/components/announcements/AnnouncementCard.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Announcement } from '@backstage-community/plugin-announcements-common';\nimport { DateTime } from 'luxon';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';\nimport {\n Box,\n CardFooter,\n Text,\n Card,\n CardHeader,\n CardBody,\n Link,\n Tag,\n TagGroup,\n Flex,\n} from '@backstage/ui';\nimport { formatAnnouncementStartTime } from '../../../components/utils/announcementDateUtils';\nimport { rootRouteRef, announcementViewRouteRef } from '../../../routes';\n\ntype AnnouncementCardProps = {\n announcement: Announcement;\n hideStartAt?: boolean;\n};\n\nexport const AnnouncementCard = ({\n announcement,\n hideStartAt,\n}: AnnouncementCardProps) => {\n const announcementsLink = useRouteRef(rootRouteRef);\n const viewAnnouncementLink = useRouteRef(announcementViewRouteRef);\n const { t } = useAnnouncementsTranslation();\n\n const subTitle = (\n <Box mt=\"1\">\n <Text variant=\"body-small\" as=\"span\">\n {t('announcementsPage.card.by')}{' '}\n <EntityRefLink\n entityRef={announcement.on_behalf_of || announcement.publisher}\n hideIcon\n />\n {announcement.category && (\n <>\n {' '}\n {t('announcementsPage.card.in')}{' '}\n <Link\n href={`${announcementsLink()}?category=${\n announcement.category.slug\n }`}\n >\n {announcement.category.title}\n </Link>\n </>\n )}\n , {DateTime.fromISO(announcement.created_at).toRelative()}\n </Text>\n\n {!hideStartAt && (\n <Text variant=\"body-x-small\" as=\"p\">\n {formatAnnouncementStartTime(\n announcement.start_at,\n t('announcementsCard.occurred'),\n t('announcementsCard.scheduled'),\n t('announcementsCard.today'),\n )}\n </Text>\n )}\n </Box>\n );\n\n return (\n <Card>\n <CardHeader>\n <Flex direction=\"column\" gap=\"2\">\n <Link\n variant=\"title-x-small\"\n href={viewAnnouncementLink({ id: announcement.id })}\n truncate\n >\n {announcement.title}\n </Link>\n\n {subTitle}\n </Flex>\n </CardHeader>\n\n <CardBody>\n <Text>{announcement.excerpt}</Text>\n </CardBody>\n\n <CardFooter>\n {announcement.tags && announcement.tags.length > 0 && (\n <TagGroup aria-label=\"Announcement Tags\">\n {announcement.tags.map(tag => (\n <Tag\n key={tag.slug}\n size=\"small\"\n href={`${announcementsLink()}?tags=${tag.slug}`}\n >\n {tag.title}\n </Tag>\n ))}\n </TagGroup>\n )}\n </CardFooter>\n </Card>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
+
import { useState, useMemo } from 'react';
|
|
3
|
+
import { useLocation } from 'react-router-dom';
|
|
4
|
+
import { useAnnouncements } from '@backstage-community/plugin-announcements-react';
|
|
5
|
+
import { Pagination } from '@material-ui/lab';
|
|
6
|
+
import { Skeleton, Box, Text, Grid, Flex } from '@backstage/ui';
|
|
7
|
+
import { AnnouncementCard } from './AnnouncementCard.esm.js';
|
|
8
|
+
|
|
9
|
+
const AnnouncementsGrid = ({
|
|
10
|
+
maxPerPage,
|
|
11
|
+
category,
|
|
12
|
+
tags,
|
|
13
|
+
active,
|
|
14
|
+
sortBy,
|
|
15
|
+
order,
|
|
16
|
+
hideStartAt
|
|
17
|
+
}) => {
|
|
18
|
+
const location = useLocation();
|
|
19
|
+
const queryParams = new URLSearchParams(location.search);
|
|
20
|
+
const [page, setPage] = useState(1);
|
|
21
|
+
const handleChange = (_event, value) => {
|
|
22
|
+
setPage(value);
|
|
23
|
+
};
|
|
24
|
+
const tagsParam = queryParams.get("tags");
|
|
25
|
+
const tagsFromUrl = useMemo(() => {
|
|
26
|
+
return tagsParam ? tagsParam.split(",") : void 0;
|
|
27
|
+
}, [tagsParam]);
|
|
28
|
+
const { announcements, loading, error } = useAnnouncements(
|
|
29
|
+
{
|
|
30
|
+
max: maxPerPage,
|
|
31
|
+
page,
|
|
32
|
+
category,
|
|
33
|
+
tags: tags || tagsFromUrl,
|
|
34
|
+
active,
|
|
35
|
+
sortBy,
|
|
36
|
+
order
|
|
37
|
+
},
|
|
38
|
+
{ dependencies: [maxPerPage, page, category, tagsFromUrl] }
|
|
39
|
+
);
|
|
40
|
+
if (loading) {
|
|
41
|
+
return /* @__PURE__ */ jsx(Skeleton, {});
|
|
42
|
+
} else if (error) {
|
|
43
|
+
return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, { children: "Error loading announcements" }) });
|
|
44
|
+
}
|
|
45
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
46
|
+
/* @__PURE__ */ jsx(Grid.Root, { columns: { xs: "12", md: "2", lg: "3" }, children: announcements.results.map((announcement) => /* @__PURE__ */ jsx(Grid.Item, { children: /* @__PURE__ */ jsx(
|
|
47
|
+
AnnouncementCard,
|
|
48
|
+
{
|
|
49
|
+
announcement,
|
|
50
|
+
hideStartAt
|
|
51
|
+
}
|
|
52
|
+
) }, announcement.id)) }),
|
|
53
|
+
announcements.count > 0 && /* @__PURE__ */ jsx(Flex, { justify: "center", my: "10", children: /* @__PURE__ */ jsx(
|
|
54
|
+
Pagination,
|
|
55
|
+
{
|
|
56
|
+
count: Math.ceil(announcements.count / maxPerPage),
|
|
57
|
+
page,
|
|
58
|
+
onChange: handleChange
|
|
59
|
+
}
|
|
60
|
+
) })
|
|
61
|
+
] });
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
export { AnnouncementsGrid };
|
|
65
|
+
//# sourceMappingURL=AnnouncementsGrid.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AnnouncementsGrid.esm.js","sources":["../../../../src/alpha/components/announcements/AnnouncementsGrid.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useState, useMemo } from 'react';\nimport { useLocation } from 'react-router-dom';\nimport { useAnnouncements } from '@backstage-community/plugin-announcements-react';\nimport { Pagination } from '@material-ui/lab';\nimport { Flex, Grid, Box, Skeleton, Text } from '@backstage/ui';\nimport { AnnouncementCard } from './AnnouncementCard';\n\ntype AnnouncementsGridProps = {\n maxPerPage: number;\n category?: string;\n tags?: string[];\n active?: boolean;\n sortBy?: 'created_at' | 'start_at';\n order?: 'asc' | 'desc';\n hideStartAt?: boolean;\n};\n\nexport const AnnouncementsGrid = ({\n maxPerPage,\n category,\n tags,\n active,\n sortBy,\n order,\n hideStartAt,\n}: AnnouncementsGridProps) => {\n const location = useLocation();\n const queryParams = new URLSearchParams(location.search);\n\n const [page, setPage] = useState(1);\n const handleChange = (_event: any, value: number) => {\n setPage(value);\n };\n\n const tagsParam = queryParams.get('tags');\n const tagsFromUrl = useMemo(() => {\n return tagsParam ? tagsParam.split(',') : undefined;\n }, [tagsParam]);\n\n const { announcements, loading, error } = useAnnouncements(\n {\n max: maxPerPage,\n page: page,\n category,\n tags: tags || tagsFromUrl,\n active,\n sortBy,\n order,\n },\n { dependencies: [maxPerPage, page, category, tagsFromUrl] },\n );\n\n if (loading) {\n return <Skeleton />;\n } else if (error) {\n return (\n <Box>\n <Text>Error loading announcements</Text>\n </Box>\n );\n }\n\n return (\n <>\n <Grid.Root columns={{ xs: '12', md: '2', lg: '3' }}>\n {announcements.results.map(announcement => (\n <Grid.Item key={announcement.id}>\n <AnnouncementCard\n announcement={announcement}\n hideStartAt={hideStartAt}\n />\n </Grid.Item>\n ))}\n </Grid.Root>\n\n {announcements.count > 0 && (\n <Flex justify=\"center\" my=\"10\">\n <Pagination\n count={Math.ceil(announcements.count / maxPerPage)}\n page={page}\n onChange={handleChange}\n />\n </Flex>\n )}\n </>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAgCO,MAAM,oBAAoB,CAAC;AAAA,EAChC,UAAA;AAAA,EACA,QAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAA,MAAM,WAAc,GAAA,IAAI,eAAgB,CAAA,QAAA,CAAS,MAAM,CAAA;AAEvD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAClC,EAAM,MAAA,YAAA,GAAe,CAAC,MAAA,EAAa,KAAkB,KAAA;AACnD,IAAA,OAAA,CAAQ,KAAK,CAAA;AAAA,GACf;AAEA,EAAM,MAAA,SAAA,GAAY,WAAY,CAAA,GAAA,CAAI,MAAM,CAAA;AACxC,EAAM,MAAA,WAAA,GAAc,QAAQ,MAAM;AAChC,IAAA,OAAO,SAAY,GAAA,SAAA,CAAU,KAAM,CAAA,GAAG,CAAI,GAAA,KAAA,CAAA;AAAA,GAC5C,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAA,MAAM,EAAE,aAAA,EAAe,OAAS,EAAA,KAAA,EAAU,GAAA,gBAAA;AAAA,IACxC;AAAA,MACE,GAAK,EAAA,UAAA;AAAA,MACL,IAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAM,IAAQ,IAAA,WAAA;AAAA,MACd,MAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,EAAE,YAAc,EAAA,CAAC,YAAY,IAAM,EAAA,QAAA,EAAU,WAAW,CAAE;AAAA,GAC5D;AAEA,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,2BAAQ,QAAS,EAAA,EAAA,CAAA;AAAA,aACR,KAAO,EAAA;AAChB,IAAA,uBACG,GAAA,CAAA,GAAA,EAAA,EACC,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,yCAA2B,CACnC,EAAA,CAAA;AAAA;AAIJ,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAK,IAAL,EAAA,EAAU,SAAS,EAAE,EAAA,EAAI,MAAM,EAAI,EAAA,GAAA,EAAK,IAAI,GAAI,EAAA,EAC9C,wBAAc,OAAQ,CAAA,GAAA,CAAI,kCACxB,GAAA,CAAA,IAAA,CAAK,MAAL,EACC,QAAA,kBAAA,GAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,YAAA;AAAA,QACA;AAAA;AAAA,KAHY,EAAA,EAAA,YAAA,CAAa,EAK7B,CACD,CACH,EAAA,CAAA;AAAA,IAEC,aAAA,CAAc,QAAQ,CACrB,oBAAA,GAAA,CAAC,QAAK,OAAQ,EAAA,QAAA,EAAS,IAAG,IACxB,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,KAAO,EAAA,IAAA,CAAK,IAAK,CAAA,aAAA,CAAc,QAAQ,UAAU,CAAA;AAAA,QACjD,IAAA;AAAA,QACA,QAAU,EAAA;AAAA;AAAA,KAEd,EAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useLocation } from 'react-router-dom';
|
|
3
|
+
import { useAnnouncementsPermissions, useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
|
|
4
|
+
import { HeaderPage, Container } from '@backstage/ui';
|
|
5
|
+
import { AnnouncementsGrid } from './AnnouncementsGrid.esm.js';
|
|
6
|
+
import { ContextMenu } from './ContextMenu.esm.js';
|
|
7
|
+
|
|
8
|
+
const AnnouncementsPage = (props) => {
|
|
9
|
+
const location = useLocation();
|
|
10
|
+
const queryParams = new URLSearchParams(location.search);
|
|
11
|
+
const permissions = useAnnouncementsPermissions();
|
|
12
|
+
const { t } = useAnnouncementsTranslation();
|
|
13
|
+
const {
|
|
14
|
+
hideInactive,
|
|
15
|
+
hideStartAt,
|
|
16
|
+
title,
|
|
17
|
+
maxPerPage,
|
|
18
|
+
category,
|
|
19
|
+
sortby,
|
|
20
|
+
order
|
|
21
|
+
} = props;
|
|
22
|
+
const canManageAnnouncements = !permissions.create.loading && permissions.create.allowed;
|
|
23
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
24
|
+
/* @__PURE__ */ jsx(
|
|
25
|
+
HeaderPage,
|
|
26
|
+
{
|
|
27
|
+
title: title ?? t("announcementsPage.announcements"),
|
|
28
|
+
customActions: canManageAnnouncements && /* @__PURE__ */ jsx(ContextMenu, {})
|
|
29
|
+
}
|
|
30
|
+
),
|
|
31
|
+
/* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsx(
|
|
32
|
+
AnnouncementsGrid,
|
|
33
|
+
{
|
|
34
|
+
maxPerPage: maxPerPage ?? 10,
|
|
35
|
+
category: category ?? queryParams.get("category") ?? void 0,
|
|
36
|
+
tags: props.tags,
|
|
37
|
+
active: !!hideInactive,
|
|
38
|
+
sortBy: sortby ?? "created_at",
|
|
39
|
+
order: order ?? "desc",
|
|
40
|
+
hideStartAt
|
|
41
|
+
}
|
|
42
|
+
) })
|
|
43
|
+
] });
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
export { AnnouncementsPage };
|
|
47
|
+
//# sourceMappingURL=AnnouncementsPage.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AnnouncementsPage.esm.js","sources":["../../../../src/alpha/components/announcements/AnnouncementsPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useLocation } from 'react-router-dom';\nimport {\n useAnnouncementsPermissions,\n useAnnouncementsTranslation,\n} from '@backstage-community/plugin-announcements-react';\nimport { Container, HeaderPage } from '@backstage/ui';\n\nimport { AnnouncementsGrid } from './AnnouncementsGrid';\nimport { ContextMenu } from './ContextMenu';\nimport { MarkdownRendererTypeProps } from '../../../components';\n\nexport type AnnouncementsPageProps = {\n title: string;\n maxPerPage?: number;\n category?: string;\n tags?: string[];\n hideInactive?: boolean;\n hideStartAt?: boolean;\n markdownRenderer?: MarkdownRendererTypeProps;\n sortby?: 'created_at' | 'start_at';\n order?: 'asc' | 'desc';\n};\n\nexport const AnnouncementsPage = (props: AnnouncementsPageProps) => {\n const location = useLocation();\n const queryParams = new URLSearchParams(location.search);\n const permissions = useAnnouncementsPermissions();\n const { t } = useAnnouncementsTranslation();\n\n const {\n hideInactive,\n hideStartAt,\n title,\n maxPerPage,\n category,\n sortby,\n order,\n } = props;\n\n const canManageAnnouncements =\n !permissions.create.loading && permissions.create.allowed;\n\n return (\n <>\n <HeaderPage\n title={title ?? t('announcementsPage.announcements')}\n customActions={canManageAnnouncements && <ContextMenu />}\n />\n\n <Container>\n <AnnouncementsGrid\n maxPerPage={maxPerPage ?? 10}\n category={category ?? queryParams.get('category') ?? undefined}\n tags={props.tags}\n active={!!hideInactive}\n sortBy={sortby ?? 'created_at'}\n order={order ?? 'desc'}\n hideStartAt={hideStartAt}\n />\n </Container>\n </>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAsCa,MAAA,iBAAA,GAAoB,CAAC,KAAkC,KAAA;AAClE,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAA,MAAM,WAAc,GAAA,IAAI,eAAgB,CAAA,QAAA,CAAS,MAAM,CAAA;AACvD,EAAA,MAAM,cAAc,2BAA4B,EAAA;AAChD,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAM,MAAA;AAAA,IACJ,YAAA;AAAA,IACA,WAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA;AAAA,GACE,GAAA,KAAA;AAEJ,EAAA,MAAM,yBACJ,CAAC,WAAA,CAAY,MAAO,CAAA,OAAA,IAAW,YAAY,MAAO,CAAA,OAAA;AAEpD,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,KAAS,IAAA,CAAA,CAAE,iCAAiC,CAAA;AAAA,QACnD,aAAA,EAAe,sBAA0B,oBAAA,GAAA,CAAC,WAAY,EAAA,EAAA;AAAA;AAAA,KACxD;AAAA,wBAEC,SACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,YAAY,UAAc,IAAA,EAAA;AAAA,QAC1B,QAAU,EAAA,QAAA,IAAY,WAAY,CAAA,GAAA,CAAI,UAAU,CAAK,IAAA,KAAA,CAAA;AAAA,QACrD,MAAM,KAAM,CAAA,IAAA;AAAA,QACZ,MAAA,EAAQ,CAAC,CAAC,YAAA;AAAA,QACV,QAAQ,MAAU,IAAA,YAAA;AAAA,QAClB,OAAO,KAAS,IAAA,MAAA;AAAA,QAChB;AAAA;AAAA,KAEJ,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useRouteRef } from '@backstage/core-plugin-api';
|
|
3
|
+
import { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
|
|
4
|
+
import { MenuTrigger, ButtonIcon, Menu, MenuItem } from '@backstage/ui';
|
|
5
|
+
import { RiMore2Fill } from '@remixicon/react';
|
|
6
|
+
import { announcementAdminRouteRef } from '../../../routes.esm.js';
|
|
7
|
+
|
|
8
|
+
const ContextMenu = () => {
|
|
9
|
+
const { t } = useAnnouncementsTranslation();
|
|
10
|
+
const adminRoute = useRouteRef(announcementAdminRouteRef);
|
|
11
|
+
const adminRouteLinkName = t("announcementsPage.contextMenu.admin");
|
|
12
|
+
return /* @__PURE__ */ jsxs(MenuTrigger, { children: [
|
|
13
|
+
/* @__PURE__ */ jsx(ButtonIcon, { icon: /* @__PURE__ */ jsx(RiMore2Fill, {}), variant: "tertiary" }),
|
|
14
|
+
/* @__PURE__ */ jsx(Menu, { placement: "bottom end", children: /* @__PURE__ */ jsx(MenuItem, { href: adminRoute(), children: adminRouteLinkName }) })
|
|
15
|
+
] });
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
export { ContextMenu };
|
|
19
|
+
//# sourceMappingURL=ContextMenu.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ContextMenu.esm.js","sources":["../../../../src/alpha/components/announcements/ContextMenu.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';\nimport { ButtonIcon, Menu, MenuItem, MenuTrigger } from '@backstage/ui';\nimport { RiMore2Fill } from '@remixicon/react';\n\nimport { announcementAdminRouteRef } from '../../../routes';\n\n/**\n * @remarks - does not include permissions check\n * @internal\n */\nexport const ContextMenu = () => {\n const { t } = useAnnouncementsTranslation();\n\n const adminRoute = useRouteRef(announcementAdminRouteRef);\n const adminRouteLinkName = t('announcementsPage.contextMenu.admin');\n\n return (\n <MenuTrigger>\n <ButtonIcon icon={<RiMore2Fill />} variant=\"tertiary\" />\n <Menu placement=\"bottom end\">\n <MenuItem href={adminRoute()}>{adminRouteLinkName}</MenuItem>\n </Menu>\n </MenuTrigger>\n );\n};\n"],"names":[],"mappings":";;;;;;;AA0BO,MAAM,cAAc,MAAM;AAC/B,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAM,MAAA,UAAA,GAAa,YAAY,yBAAyB,CAAA;AACxD,EAAM,MAAA,kBAAA,GAAqB,EAAE,qCAAqC,CAAA;AAElE,EAAA,4BACG,WACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,cAAW,IAAM,kBAAA,GAAA,CAAC,WAAY,EAAA,EAAA,CAAA,EAAI,SAAQ,UAAW,EAAA,CAAA;AAAA,oBACtD,GAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAU,YACd,EAAA,QAAA,kBAAA,GAAA,CAAC,YAAS,IAAM,EAAA,UAAA,EAAe,EAAA,QAAA,EAAA,kBAAA,EAAmB,CACpD,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}
|