@backstage-community/plugin-announcements 0.13.0 → 0.14.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 +20 -0
- package/dist/alpha.d.ts +111 -5
- package/dist/alpha.esm.js.map +1 -1
- package/dist/components/AnnouncementForm/CategoryInput.esm.js.map +1 -1
- package/dist/components/MarkdownRenderer/MarkdownRenderer.esm.js +18 -0
- package/dist/components/MarkdownRenderer/MarkdownRenderer.esm.js.map +1 -1
- package/dist/components/NewAnnouncementBanner/NewAnnouncementBanner.esm.js +3 -2
- package/dist/components/NewAnnouncementBanner/NewAnnouncementBanner.esm.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# @backstage-community/plugin-announcements
|
|
2
2
|
|
|
3
|
+
## 0.14.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- d34e875: Added updated_at field, extended sorting capabilities NewAnnouncementsBanner
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [d34e875]
|
|
12
|
+
- @backstage-community/plugin-announcements-common@0.11.0
|
|
13
|
+
- @backstage-community/plugin-announcements-react@0.13.0
|
|
14
|
+
|
|
15
|
+
## 0.13.1
|
|
16
|
+
|
|
17
|
+
### Patch Changes
|
|
18
|
+
|
|
19
|
+
- 93bb787: Fixed the typings for the Announcements new frontend system plugin, which previously prevented correct overriding.
|
|
20
|
+
- 6efe1a3: - Fixed table rendering in `<AnnouncementsPage markdownRenderer="md-editor" />`. Table styling was not correctly applied when using the Backstage Light theme.
|
|
21
|
+
- Updated `@uiw/react-md-editor` dependency to `^4.0.8`.
|
|
22
|
+
|
|
3
23
|
## 0.13.0
|
|
4
24
|
|
|
5
25
|
### Minor Changes
|
package/dist/alpha.d.ts
CHANGED
|
@@ -1,13 +1,119 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import * as _backstage_plugin_search_react_alpha from '@backstage/plugin-search-react/alpha';
|
|
3
|
+
import * as _backstage_catalog_model from '@backstage/catalog-model';
|
|
4
|
+
import * as react from 'react';
|
|
5
|
+
import * as _backstage_plugin_catalog_react_alpha from '@backstage/plugin-catalog-react/alpha';
|
|
6
|
+
import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
|
|
1
7
|
import * as _backstage_frontend_plugin_api from '@backstage/frontend-plugin-api';
|
|
2
|
-
import { FrontendPlugin } from '@backstage/frontend-plugin-api';
|
|
3
8
|
|
|
4
9
|
/**
|
|
5
10
|
* @alpha
|
|
6
11
|
*/
|
|
7
|
-
declare const _default:
|
|
8
|
-
|
|
9
|
-
}, {
|
|
10
|
-
|
|
12
|
+
declare const _default: _backstage_frontend_plugin_api.OverridableFrontendPlugin<{
|
|
13
|
+
root: _backstage_frontend_plugin_api.RouteRef<undefined>;
|
|
14
|
+
}, {}, {
|
|
15
|
+
"api:announcements": _backstage_frontend_plugin_api.ExtensionDefinition<{
|
|
16
|
+
kind: "api";
|
|
17
|
+
name: undefined;
|
|
18
|
+
config: {};
|
|
19
|
+
configInput: {};
|
|
20
|
+
output: _backstage_frontend_plugin_api.ExtensionDataRef<_backstage_core_plugin_api.AnyApiFactory, "core.api.factory", {}>;
|
|
21
|
+
inputs: {};
|
|
22
|
+
params: <TApi, TImpl extends TApi, TDeps extends {
|
|
23
|
+
[x: string]: unknown;
|
|
24
|
+
}>(params: _backstage_core_plugin_api.ApiFactory<TApi, TImpl, TDeps>) => _backstage_frontend_plugin_api.ExtensionBlueprintParams<_backstage_core_plugin_api.AnyApiFactory>;
|
|
25
|
+
}>;
|
|
26
|
+
"entity-card:announcements/announcements": _backstage_frontend_plugin_api.ExtensionDefinition<{
|
|
27
|
+
kind: "entity-card";
|
|
28
|
+
name: "announcements";
|
|
29
|
+
config: {
|
|
30
|
+
filter: _backstage_plugin_catalog_react_alpha.EntityPredicate | undefined;
|
|
31
|
+
type: "content" | "summary" | "info" | undefined;
|
|
32
|
+
};
|
|
33
|
+
configInput: {
|
|
34
|
+
filter?: _backstage_plugin_catalog_react_alpha.EntityPredicate | undefined;
|
|
35
|
+
type?: "content" | "summary" | "info" | undefined;
|
|
36
|
+
};
|
|
37
|
+
output: _backstage_frontend_plugin_api.ExtensionDataRef<react.JSX.Element, "core.reactElement", {}> | _backstage_frontend_plugin_api.ExtensionDataRef<(entity: _backstage_catalog_model.Entity) => boolean, "catalog.entity-filter-function", {
|
|
38
|
+
optional: true;
|
|
39
|
+
}> | _backstage_frontend_plugin_api.ExtensionDataRef<string, "catalog.entity-filter-expression", {
|
|
40
|
+
optional: true;
|
|
41
|
+
}> | _backstage_frontend_plugin_api.ExtensionDataRef<_backstage_plugin_catalog_react_alpha.EntityCardType, "catalog.entity-card-type", {
|
|
42
|
+
optional: true;
|
|
43
|
+
}>;
|
|
44
|
+
inputs: {};
|
|
45
|
+
params: {
|
|
46
|
+
loader: () => Promise<JSX.Element>;
|
|
47
|
+
filter?: _backstage_plugin_catalog_react_alpha.EntityPredicate | ((entity: _backstage_catalog_model.Entity) => boolean) | undefined;
|
|
48
|
+
type?: _backstage_plugin_catalog_react_alpha.EntityCardType | undefined;
|
|
49
|
+
};
|
|
50
|
+
}>;
|
|
51
|
+
"nav-item:announcements": _backstage_frontend_plugin_api.ExtensionDefinition<{
|
|
52
|
+
kind: "nav-item";
|
|
53
|
+
name: undefined;
|
|
54
|
+
config: {};
|
|
55
|
+
configInput: {};
|
|
56
|
+
output: _backstage_frontend_plugin_api.ExtensionDataRef<{
|
|
57
|
+
title: string;
|
|
58
|
+
icon: _backstage_core_plugin_api.IconComponent;
|
|
59
|
+
routeRef: _backstage_frontend_plugin_api.RouteRef<undefined>;
|
|
60
|
+
}, "core.nav-item.target", {}>;
|
|
61
|
+
inputs: {};
|
|
62
|
+
params: {
|
|
63
|
+
title: string;
|
|
64
|
+
icon: _backstage_core_plugin_api.IconComponent;
|
|
65
|
+
routeRef: _backstage_frontend_plugin_api.RouteRef<undefined>;
|
|
66
|
+
};
|
|
67
|
+
}>;
|
|
68
|
+
"page:announcements": _backstage_frontend_plugin_api.ExtensionDefinition<{
|
|
69
|
+
kind: "page";
|
|
70
|
+
name: undefined;
|
|
71
|
+
config: {
|
|
72
|
+
path: string | undefined;
|
|
73
|
+
};
|
|
74
|
+
configInput: {
|
|
75
|
+
path?: string | undefined;
|
|
76
|
+
};
|
|
77
|
+
output: _backstage_frontend_plugin_api.ExtensionDataRef<react.JSX.Element, "core.reactElement", {}> | _backstage_frontend_plugin_api.ExtensionDataRef<string, "core.routing.path", {}> | _backstage_frontend_plugin_api.ExtensionDataRef<_backstage_frontend_plugin_api.RouteRef<_backstage_frontend_plugin_api.AnyRouteRefParams>, "core.routing.ref", {
|
|
78
|
+
optional: true;
|
|
79
|
+
}>;
|
|
80
|
+
inputs: {};
|
|
81
|
+
params: {
|
|
82
|
+
defaultPath?: [Error: "Use the 'path' param instead"] | undefined;
|
|
83
|
+
path: string;
|
|
84
|
+
loader: () => Promise<JSX.Element>;
|
|
85
|
+
routeRef?: _backstage_frontend_plugin_api.RouteRef<_backstage_frontend_plugin_api.AnyRouteRefParams> | undefined;
|
|
86
|
+
};
|
|
87
|
+
}>;
|
|
88
|
+
"search-filter-result-type:announcements": _backstage_frontend_plugin_api.ExtensionDefinition<{
|
|
89
|
+
kind: "search-filter-result-type";
|
|
90
|
+
name: undefined;
|
|
91
|
+
config: {};
|
|
92
|
+
configInput: {};
|
|
93
|
+
output: _backstage_frontend_plugin_api.ExtensionDataRef<{
|
|
94
|
+
value: string;
|
|
95
|
+
name: string;
|
|
96
|
+
icon: JSX.Element;
|
|
97
|
+
}, "search.filters.result-types.type", {}>;
|
|
98
|
+
inputs: {};
|
|
99
|
+
params: _backstage_plugin_search_react_alpha.SearchFilterResultTypeBlueprintParams;
|
|
100
|
+
}>;
|
|
101
|
+
"search-result-list-item:announcements": _backstage_frontend_plugin_api.ExtensionDefinition<{
|
|
102
|
+
kind: "search-result-list-item";
|
|
103
|
+
name: undefined;
|
|
104
|
+
config: {
|
|
105
|
+
noTrack: boolean;
|
|
106
|
+
};
|
|
107
|
+
configInput: {
|
|
108
|
+
noTrack?: boolean | undefined;
|
|
109
|
+
};
|
|
110
|
+
output: _backstage_frontend_plugin_api.ExtensionDataRef<{
|
|
111
|
+
predicate?: _backstage_plugin_search_react_alpha.SearchResultItemExtensionPredicate | undefined;
|
|
112
|
+
component: _backstage_plugin_search_react_alpha.SearchResultItemExtensionComponent;
|
|
113
|
+
}, "search.search-result-list-item.item", {}>;
|
|
114
|
+
inputs: {};
|
|
115
|
+
params: _backstage_plugin_search_react_alpha.SearchResultListItemBlueprintParams;
|
|
116
|
+
}>;
|
|
11
117
|
}>;
|
|
12
118
|
|
|
13
119
|
export { _default as default };
|
package/dist/alpha.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alpha.esm.js","sources":["../src/alpha.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 { convertLegacyRouteRefs } from '@backstage/core-compat-api';\nimport {
|
|
1
|
+
{"version":3,"file":"alpha.esm.js","sources":["../src/alpha.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 { convertLegacyRouteRefs } from '@backstage/core-compat-api';\nimport { createFrontendPlugin } from '@backstage/frontend-plugin-api';\nimport { announcementsApiExtension } from './alpha/apis';\nimport { entityAnnouncementsCard } from './alpha/entityCards';\nimport { announcementsNavItem } from './alpha/navItems';\nimport { announcementsPage } from './alpha/pages';\nimport {\n announcementsSearchFilterResultType,\n announcementsSearchResultListItem,\n} from './alpha/search';\nimport { rootRouteRef } from './routes';\n\n/**\n * @alpha\n */\nexport default createFrontendPlugin({\n pluginId: 'announcements',\n routes: convertLegacyRouteRefs({\n root: rootRouteRef,\n }),\n extensions: [\n announcementsApiExtension,\n entityAnnouncementsCard,\n announcementsPage,\n announcementsNavItem,\n announcementsSearchResultListItem,\n announcementsSearchFilterResultType,\n ],\n});\n"],"names":[],"mappings":";;;;;;;;;AA8BA,YAAe,oBAAqB,CAAA;AAAA,EAClC,QAAU,EAAA,eAAA;AAAA,EACV,QAAQ,sBAAuB,CAAA;AAAA,IAC7B,IAAM,EAAA;AAAA,GACP,CAAA;AAAA,EACD,UAAY,EAAA;AAAA,IACV,yBAAA;AAAA,IACA,uBAAA;AAAA,IACA,iBAAA;AAAA,IACA,oBAAA;AAAA,IACA,iCAAA;AAAA,IACA;AAAA;AAEJ,CAAC,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoryInput.esm.js","sources":["../../../src/components/AnnouncementForm/CategoryInput.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 { SetStateAction } from 'react';\nimport TextField from '@mui/material/TextField';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';\nimport { Category } from '@backstage-community/plugin-announcements-common';\nimport {\n useAnnouncementsTranslation,\n useCategories,\n} from '@backstage-community/plugin-announcements-react';\nimport CircularProgress from '@mui/material/CircularProgress';\n\ntype CategoryInputProps = {\n setForm: (\n value: SetStateAction<{\n category: string | undefined;\n tags: string[] | undefined;\n id: string;\n publisher: string;\n title: string;\n excerpt: string;\n body: string;\n created_at: string;\n active: boolean;\n start_at: string;\n until_date: string;\n sendNotification: boolean;\n }>,\n ) => void;\n form: {\n category: string | undefined;\n tags: string[] | undefined;\n id: string;\n publisher: string;\n title: string;\n excerpt: string;\n body: string;\n created_at: string;\n active: boolean;\n start_at: string;\n until_date: string;\n sendNotification: boolean;\n };\n initialValue: string;\n};\n\nconst filter = createFilterOptions<Category>();\n\nfunction prepareCategoryFromInput(\n inputCategory: Category | string,\n localizedCreate?: string,\n): string {\n return (\n typeof inputCategory === 'string' ? inputCategory : inputCategory.title\n )\n .replace(localizedCreate ? `${localizedCreate} ` : 'Create ', '')\n .replaceAll('\"', '');\n}\n\nexport default function CategoryInput({\n setForm,\n form,\n initialValue,\n}: CategoryInputProps) {\n const { categories, loading: categoriesLoading } = useCategories();\n const { t } = useAnnouncementsTranslation();\n\n return (\n <Autocomplete\n fullWidth\n value={initialValue ?? ''}\n onChange={async (_, newValue) => {\n if (!newValue) {\n setForm({ ...form, category: undefined });\n return;\n }\n\n const newCategory = prepareCategoryFromInput(\n newValue,\n t('announcementForm.categoryInput.create'),\n );\n setForm({ ...form, category: newCategory });\n }}\n filterOptions={(options, params) => {\n const filtered = filter(options, params);\n const { inputValue } = params;\n\n /*\n Suggest the creation of a new category. This adds the new value to the list of options\n and creates the new category when the form is submitted.\n */\n const isExisting = options.some(\n option =>\n inputValue.toLocaleLowerCase('en-US') ===\n option.title.toLocaleLowerCase('en-US'),\n );\n if (inputValue !== '' && !isExisting) {\n filtered.push({\n title: `${t(\n 'announcementForm.categoryInput.create',\n )} \"${inputValue}\"`,\n slug: inputValue.toLocaleLowerCase('en-US'),\n });\n }\n\n return filtered;\n }}\n selectOnFocus\n handleHomeEndKeys\n loading={categoriesLoading}\n id=\"category-input-field\"\n options={categories || []}\n getOptionLabel={option => {\n // Value selected with enter, right from the input\n return prepareCategoryFromInput(option);\n }}\n renderOption={(props, option) => <li {...props}>{option.title}</li>}\n freeSolo\n renderInput={params => (\n <TextField\n {...params}\n id=\"category\"\n label={t('announcementForm.categoryInput.label')}\n variant=\"outlined\"\n fullWidth\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <>\n {categoriesLoading ? (\n <CircularProgress color=\"inherit\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </>\n ),\n }}\n />\n )}\n />\n );\n}\n"],"names":[],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"CategoryInput.esm.js","sources":["../../../src/components/AnnouncementForm/CategoryInput.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 { SetStateAction } from 'react';\nimport TextField from '@mui/material/TextField';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';\nimport { Category } from '@backstage-community/plugin-announcements-common';\nimport {\n useAnnouncementsTranslation,\n useCategories,\n} from '@backstage-community/plugin-announcements-react';\nimport CircularProgress from '@mui/material/CircularProgress';\n\ntype CategoryInputProps = {\n setForm: (\n value: SetStateAction<{\n category: string | undefined;\n tags: string[] | undefined;\n id: string;\n publisher: string;\n title: string;\n excerpt: string;\n body: string;\n created_at: string;\n active: boolean;\n start_at: string;\n until_date: string;\n sendNotification: boolean;\n updated_at: string;\n }>,\n ) => void;\n form: {\n category: string | undefined;\n tags: string[] | undefined;\n id: string;\n publisher: string;\n title: string;\n excerpt: string;\n body: string;\n created_at: string;\n active: boolean;\n start_at: string;\n until_date: string;\n sendNotification: boolean;\n updated_at: string;\n };\n initialValue: string;\n};\n\nconst filter = createFilterOptions<Category>();\n\nfunction prepareCategoryFromInput(\n inputCategory: Category | string,\n localizedCreate?: string,\n): string {\n return (\n typeof inputCategory === 'string' ? inputCategory : inputCategory.title\n )\n .replace(localizedCreate ? `${localizedCreate} ` : 'Create ', '')\n .replaceAll('\"', '');\n}\n\nexport default function CategoryInput({\n setForm,\n form,\n initialValue,\n}: CategoryInputProps) {\n const { categories, loading: categoriesLoading } = useCategories();\n const { t } = useAnnouncementsTranslation();\n\n return (\n <Autocomplete\n fullWidth\n value={initialValue ?? ''}\n onChange={async (_, newValue) => {\n if (!newValue) {\n setForm({ ...form, category: undefined });\n return;\n }\n\n const newCategory = prepareCategoryFromInput(\n newValue,\n t('announcementForm.categoryInput.create'),\n );\n setForm({ ...form, category: newCategory });\n }}\n filterOptions={(options, params) => {\n const filtered = filter(options, params);\n const { inputValue } = params;\n\n /*\n Suggest the creation of a new category. This adds the new value to the list of options\n and creates the new category when the form is submitted.\n */\n const isExisting = options.some(\n option =>\n inputValue.toLocaleLowerCase('en-US') ===\n option.title.toLocaleLowerCase('en-US'),\n );\n if (inputValue !== '' && !isExisting) {\n filtered.push({\n title: `${t(\n 'announcementForm.categoryInput.create',\n )} \"${inputValue}\"`,\n slug: inputValue.toLocaleLowerCase('en-US'),\n });\n }\n\n return filtered;\n }}\n selectOnFocus\n handleHomeEndKeys\n loading={categoriesLoading}\n id=\"category-input-field\"\n options={categories || []}\n getOptionLabel={option => {\n // Value selected with enter, right from the input\n return prepareCategoryFromInput(option);\n }}\n renderOption={(props, option) => <li {...props}>{option.title}</li>}\n freeSolo\n renderInput={params => (\n <TextField\n {...params}\n id=\"category\"\n label={t('announcementForm.categoryInput.label')}\n variant=\"outlined\"\n fullWidth\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <>\n {categoriesLoading ? (\n <CircularProgress color=\"inherit\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </>\n ),\n }}\n />\n )}\n />\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -22,6 +22,24 @@ const useStyles = makeStyles((theme) => ({
|
|
|
22
22
|
"& blockquote": {
|
|
23
23
|
paddingLeft: theme.spacing(1),
|
|
24
24
|
color: theme.palette.text.secondary
|
|
25
|
+
},
|
|
26
|
+
"& table": {
|
|
27
|
+
"& thead th": {
|
|
28
|
+
color: theme.palette.text.primary,
|
|
29
|
+
backgroundColor: theme.palette.type === "dark" ? theme.palette.background.default : theme.palette.background.paper
|
|
30
|
+
},
|
|
31
|
+
"& th, & td": {
|
|
32
|
+
border: 0
|
|
33
|
+
},
|
|
34
|
+
"& tbody tr:nth-of-type(odd)": {
|
|
35
|
+
backgroundColor: theme.palette.type === "dark" ? theme.palette.action.selected : theme.palette.action.hover
|
|
36
|
+
},
|
|
37
|
+
"& tbody tr:nth-of-type(even)": {
|
|
38
|
+
backgroundColor: theme.palette.type === "dark" ? theme.palette.background.paper : theme.palette.background.paper
|
|
39
|
+
},
|
|
40
|
+
"& tbody td": {
|
|
41
|
+
borderTop: `1px solid ${theme.palette.divider}`
|
|
42
|
+
}
|
|
25
43
|
}
|
|
26
44
|
}
|
|
27
45
|
}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownRenderer.esm.js","sources":["../../../src/components/MarkdownRenderer/MarkdownRenderer.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 */\nimport { MarkdownContent } from '@backstage/core-components';\nimport MDEditor from '@uiw/react-md-editor';\nimport { makeStyles, useTheme } from '@material-ui/core';\n\n/**\n * @public\n * Use this props to specify which rendering mode the MarkdownRenderer should operate in.\n *\n * - `'backstage'`: Indicates that the renderer should use the Backstage built-in style.\n * - `'md-editor'`: Indicates that the renderer should use the Markdown Editor (WYSIWYG) style.\n *\n */\nexport type MarkdownRendererTypeProps = 'backstage' | 'md-editor';\n\nexport interface MarkdownRendererProps {\n content: string;\n rendererType?: MarkdownRendererTypeProps;\n}\n\n// Custom styles for the MDEditor to match Backstage MUI theme\nconst useStyles = makeStyles(theme => ({\n mdEditor: {\n color: theme.palette.text.primary,\n '& a': {\n color: theme.palette.primary.main,\n },\n '& code': {\n backgroundColor: theme.palette.background.default,\n color: theme.palette.text.primary,\n borderRadius: theme.shape.borderRadius,\n },\n '& pre': {\n backgroundColor: theme.palette.background.default,\n padding: theme.spacing(1),\n borderRadius: theme.shape.borderRadius,\n },\n '& blockquote': {\n paddingLeft: theme.spacing(1),\n color: theme.palette.text.secondary,\n },\n },\n}));\n\nexport const MarkdownRenderer = ({\n content,\n rendererType = 'backstage',\n}: MarkdownRendererProps) => {\n const theme = useTheme();\n const classes = useStyles();\n\n switch (rendererType) {\n case 'md-editor':\n return (\n <MDEditor.Markdown\n source={content}\n className={classes.mdEditor}\n style={{\n backgroundColor: 'transparent',\n color: theme.palette.text.primary,\n fontFamily: theme.typography.fontFamily,\n }}\n />\n );\n case 'backstage':\n default:\n return <MarkdownContent content={content} />;\n }\n};\n"],"names":[],"mappings":";;;;;AAmCA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,QAAU,EAAA;AAAA,IACR,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,IAC1B,KAAO,EAAA;AAAA,MACL,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,OAAQ,CAAA;AAAA,KAC/B;AAAA,IACA,QAAU,EAAA;AAAA,MACR,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,OAAA;AAAA,MAC1C,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,MAC1B,YAAA,EAAc,MAAM,KAAM,CAAA;AAAA,KAC5B;AAAA,IACA,OAAS,EAAA;AAAA,MACP,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,OAAA;AAAA,MAC1C,OAAA,EAAS,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACxB,YAAA,EAAc,MAAM,KAAM,CAAA;AAAA,KAC5B;AAAA,IACA,cAAgB,EAAA;AAAA,MACd,WAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MAC5B,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA;AAAA;
|
|
1
|
+
{"version":3,"file":"MarkdownRenderer.esm.js","sources":["../../../src/components/MarkdownRenderer/MarkdownRenderer.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 */\nimport { MarkdownContent } from '@backstage/core-components';\nimport MDEditor from '@uiw/react-md-editor';\nimport { makeStyles, useTheme } from '@material-ui/core';\n\n/**\n * @public\n * Use this props to specify which rendering mode the MarkdownRenderer should operate in.\n *\n * - `'backstage'`: Indicates that the renderer should use the Backstage built-in style.\n * - `'md-editor'`: Indicates that the renderer should use the Markdown Editor (WYSIWYG) style.\n *\n */\nexport type MarkdownRendererTypeProps = 'backstage' | 'md-editor';\n\nexport interface MarkdownRendererProps {\n content: string;\n rendererType?: MarkdownRendererTypeProps;\n}\n\n// Custom styles for the MDEditor to match Backstage MUI theme\nconst useStyles = makeStyles(theme => ({\n mdEditor: {\n color: theme.palette.text.primary,\n '& a': {\n color: theme.palette.primary.main,\n },\n '& code': {\n backgroundColor: theme.palette.background.default,\n color: theme.palette.text.primary,\n borderRadius: theme.shape.borderRadius,\n },\n '& pre': {\n backgroundColor: theme.palette.background.default,\n padding: theme.spacing(1),\n borderRadius: theme.shape.borderRadius,\n },\n '& blockquote': {\n paddingLeft: theme.spacing(1),\n color: theme.palette.text.secondary,\n },\n '& table': {\n '& thead th': {\n color: theme.palette.text.primary,\n backgroundColor:\n theme.palette.type === 'dark'\n ? theme.palette.background.default\n : theme.palette.background.paper,\n },\n '& th, & td': {\n border: 0,\n },\n '& tbody tr:nth-of-type(odd)': {\n backgroundColor:\n theme.palette.type === 'dark'\n ? theme.palette.action.selected\n : theme.palette.action.hover,\n },\n '& tbody tr:nth-of-type(even)': {\n backgroundColor:\n theme.palette.type === 'dark'\n ? theme.palette.background.paper\n : theme.palette.background.paper,\n },\n '& tbody td': {\n borderTop: `1px solid ${theme.palette.divider}`,\n },\n },\n },\n}));\n\nexport const MarkdownRenderer = ({\n content,\n rendererType = 'backstage',\n}: MarkdownRendererProps) => {\n const theme = useTheme();\n const classes = useStyles();\n\n switch (rendererType) {\n case 'md-editor':\n return (\n <MDEditor.Markdown\n source={content}\n className={classes.mdEditor}\n style={{\n backgroundColor: 'transparent',\n color: theme.palette.text.primary,\n fontFamily: theme.typography.fontFamily,\n }}\n />\n );\n case 'backstage':\n default:\n return <MarkdownContent content={content} />;\n }\n};\n"],"names":[],"mappings":";;;;;AAmCA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,QAAU,EAAA;AAAA,IACR,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,IAC1B,KAAO,EAAA;AAAA,MACL,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,OAAQ,CAAA;AAAA,KAC/B;AAAA,IACA,QAAU,EAAA;AAAA,MACR,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,OAAA;AAAA,MAC1C,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,MAC1B,YAAA,EAAc,MAAM,KAAM,CAAA;AAAA,KAC5B;AAAA,IACA,OAAS,EAAA;AAAA,MACP,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,OAAA;AAAA,MAC1C,OAAA,EAAS,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACxB,YAAA,EAAc,MAAM,KAAM,CAAA;AAAA,KAC5B;AAAA,IACA,cAAgB,EAAA;AAAA,MACd,WAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MAC5B,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA;AAAA,KAC5B;AAAA,IACA,SAAW,EAAA;AAAA,MACT,YAAc,EAAA;AAAA,QACZ,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,QAC1B,eAAA,EACE,KAAM,CAAA,OAAA,CAAQ,IAAS,KAAA,MAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,OAAA,GACzB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA;AAAA,OACjC;AAAA,MACA,YAAc,EAAA;AAAA,QACZ,MAAQ,EAAA;AAAA,OACV;AAAA,MACA,6BAA+B,EAAA;AAAA,QAC7B,eAAA,EACE,KAAM,CAAA,OAAA,CAAQ,IAAS,KAAA,MAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA,QAAA,GACrB,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,OAC7B;AAAA,MACA,8BAAgC,EAAA;AAAA,QAC9B,eAAA,EACE,KAAM,CAAA,OAAA,CAAQ,IAAS,KAAA,MAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,KAAA,GACzB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA;AAAA,OACjC;AAAA,MACA,YAAc,EAAA;AAAA,QACZ,SAAW,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,OAAO,CAAA;AAAA;AAC/C;AACF;AAEJ,CAAE,CAAA,CAAA;AAEK,MAAM,mBAAmB,CAAC;AAAA,EAC/B,OAAA;AAAA,EACA,YAAe,GAAA;AACjB,CAA6B,KAAA;AAC3B,EAAA,MAAM,QAAQ,QAAS,EAAA;AACvB,EAAA,MAAM,UAAU,SAAU,EAAA;AAE1B,EAAA,QAAQ,YAAc;AAAA,IACpB,KAAK,WAAA;AACH,MACE,uBAAA,GAAA;AAAA,QAAC,QAAS,CAAA,QAAA;AAAA,QAAT;AAAA,UACC,MAAQ,EAAA,OAAA;AAAA,UACR,WAAW,OAAQ,CAAA,QAAA;AAAA,UACnB,KAAO,EAAA;AAAA,YACL,eAAiB,EAAA,aAAA;AAAA,YACjB,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,YAC1B,UAAA,EAAY,MAAM,UAAW,CAAA;AAAA;AAC/B;AAAA,OACF;AAAA,IAEJ,KAAK,WAAA;AAAA,IACL;AACE,MAAO,uBAAA,GAAA,CAAC,mBAAgB,OAAkB,EAAA,CAAA;AAAA;AAEhD;;;;"}
|
|
@@ -108,7 +108,7 @@ const AnnouncementBanner = (props) => {
|
|
|
108
108
|
);
|
|
109
109
|
};
|
|
110
110
|
const NewAnnouncementBanner = (props) => {
|
|
111
|
-
const { max, category, tags, active, variant, current } = props;
|
|
111
|
+
const { max, category, tags, active, variant, current, sortBy } = props;
|
|
112
112
|
const announcementsApi = useApi(announcementsApiRef);
|
|
113
113
|
const [signaledAnnouncement, setSignaledAnnouncement] = useState();
|
|
114
114
|
const { announcements, loading, error } = useAnnouncements({
|
|
@@ -116,7 +116,8 @@ const NewAnnouncementBanner = (props) => {
|
|
|
116
116
|
category,
|
|
117
117
|
tags,
|
|
118
118
|
active,
|
|
119
|
-
current
|
|
119
|
+
current,
|
|
120
|
+
sortBy
|
|
120
121
|
});
|
|
121
122
|
const lastSeen = announcementsApi.lastSeenDate();
|
|
122
123
|
const { lastSignal } = useSignal(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NewAnnouncementBanner.esm.js","sources":["../../../src/components/NewAnnouncementBanner/NewAnnouncementBanner.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 { useEffect, useState } from 'react';\nimport { DateTime } from 'luxon';\nimport { Link } from '@backstage/core-components';\nimport { useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { announcementViewRouteRef } from '../../routes';\nimport {\n announcementsApiRef,\n useAnnouncements,\n useAnnouncementsTranslation,\n} from '@backstage-community/plugin-announcements-react';\nimport {\n Announcement,\n AnnouncementSignal,\n SIGNALS_CHANNEL_ANNOUNCEMENTS,\n} from '@backstage-community/plugin-announcements-common';\nimport { useSignal } from '@backstage/plugin-signals-react';\nimport {\n makeStyles,\n Snackbar,\n SnackbarContent,\n IconButton,\n Typography,\n} from '@material-ui/core';\nimport Close from '@material-ui/icons/Close';\nimport { Alert } from '@material-ui/lab';\n\nconst useStyles = makeStyles(theme => {\n return {\n // showing on top, as a block\n blockPositioning: {\n padding: theme?.spacing?.(0) ?? 0,\n position: 'relative',\n marginBottom: theme?.spacing?.(4) ?? 32,\n marginTop: theme?.spacing?.(3) ?? -24,\n zIndex: 'unset',\n },\n // showing on top, as a floating alert\n floatingPositioning: {},\n icon: {\n fontSize: 20,\n },\n bannerIcon: {\n fontSize: 20,\n marginRight: '0.5rem',\n },\n content: {\n width: '100%',\n maxWidth: 'inherit',\n flexWrap: 'nowrap',\n backgroundColor: theme?.palette?.banner?.info ?? '#f0f0f0',\n display: 'flex',\n alignItems: 'center',\n color: theme?.palette?.banner?.text ?? '#000000',\n '& a': {\n color: theme?.palette?.banner?.link ?? '#0068c8',\n },\n },\n };\n});\n\ntype AnnouncementBannerProps = {\n announcement: Announcement;\n variant?: 'block' | 'floating';\n};\n\nconst AnnouncementBanner = (props: AnnouncementBannerProps) => {\n const classes = useStyles();\n const announcementsApi = useApi(announcementsApiRef);\n const viewAnnouncementLink = useRouteRef(announcementViewRouteRef);\n const { t } = useAnnouncementsTranslation();\n const [bannerOpen, setBannerOpen] = useState(true);\n const variant = props.variant || 'block';\n const announcement = props.announcement;\n\n const handleClick = () => {\n announcementsApi.markLastSeenDate(\n DateTime.fromISO(announcement.created_at),\n );\n setBannerOpen(false);\n };\n\n const message = (\n <>\n <Typography\n component=\"span\"\n className={classes.bannerIcon}\n variant=\"inherit\"\n >\n 📣\n </Typography>\n <Link\n to={viewAnnouncementLink({ id: announcement.id })}\n variant=\"inherit\"\n >\n {announcement.title}\n </Link>\n – {announcement.excerpt}\n </>\n );\n\n return (\n <Snackbar\n anchorOrigin={{ vertical: 'top', horizontal: 'center' }}\n open={bannerOpen}\n className={\n variant === 'block'\n ? classes.blockPositioning\n : classes.floatingPositioning\n }\n >\n <SnackbarContent\n className={classes.content}\n message={message}\n action={[\n <IconButton\n key=\"dismiss\"\n title={t('newAnnouncementBanner.markAsSeen')}\n color=\"inherit\"\n onClick={handleClick}\n >\n <Close className={classes.icon} />\n </IconButton>,\n ]}\n />\n </Snackbar>\n );\n};\n\ntype NewAnnouncementBannerProps = {\n variant?: 'block' | 'floating';\n max?: number;\n category?: string;\n active?: boolean;\n current?: boolean;\n tags?: string[];\n};\n\nexport const NewAnnouncementBanner = (props: NewAnnouncementBannerProps) => {\n const { max, category, tags, active, variant, current } = props;\n\n const announcementsApi = useApi(announcementsApiRef);\n\n const [signaledAnnouncement, setSignaledAnnouncement] = useState<\n AnnouncementSignal['data'] | undefined\n >();\n\n const { announcements, loading, error } = useAnnouncements({\n max: max ?? 1,\n category,\n tags,\n active,\n current,\n });\n const lastSeen = announcementsApi.lastSeenDate();\n\n const { lastSignal } = useSignal<AnnouncementSignal>(\n SIGNALS_CHANNEL_ANNOUNCEMENTS,\n );\n\n useEffect(() => {\n if (!lastSignal) {\n return;\n }\n\n setSignaledAnnouncement(lastSignal?.data);\n }, [lastSignal]);\n\n if (loading) {\n return null;\n } else if (error) {\n return <Alert severity=\"error\">{error.message}</Alert>;\n }\n\n if (announcements.count === 0) {\n return null;\n }\n\n const unseenAnnouncements = announcements.results.filter(announcement => {\n return lastSeen < DateTime.fromISO(announcement.created_at);\n });\n\n if (signaledAnnouncement) {\n unseenAnnouncements.push(signaledAnnouncement);\n }\n\n if (unseenAnnouncements?.length === 0) {\n return null;\n }\n\n return (\n <>\n {unseenAnnouncements.map(announcement => (\n <AnnouncementBanner\n key={announcement.id}\n announcement={announcement}\n variant={variant}\n />\n ))}\n </>\n );\n};\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"NewAnnouncementBanner.esm.js","sources":["../../../src/components/NewAnnouncementBanner/NewAnnouncementBanner.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 { useEffect, useState } from 'react';\nimport { DateTime } from 'luxon';\nimport { Link } from '@backstage/core-components';\nimport { useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { announcementViewRouteRef } from '../../routes';\nimport {\n announcementsApiRef,\n useAnnouncements,\n useAnnouncementsTranslation,\n} from '@backstage-community/plugin-announcements-react';\nimport {\n Announcement,\n AnnouncementSignal,\n SIGNALS_CHANNEL_ANNOUNCEMENTS,\n} from '@backstage-community/plugin-announcements-common';\nimport { useSignal } from '@backstage/plugin-signals-react';\nimport {\n makeStyles,\n Snackbar,\n SnackbarContent,\n IconButton,\n Typography,\n} from '@material-ui/core';\nimport Close from '@material-ui/icons/Close';\nimport { Alert } from '@material-ui/lab';\n\nconst useStyles = makeStyles(theme => {\n return {\n // showing on top, as a block\n blockPositioning: {\n padding: theme?.spacing?.(0) ?? 0,\n position: 'relative',\n marginBottom: theme?.spacing?.(4) ?? 32,\n marginTop: theme?.spacing?.(3) ?? -24,\n zIndex: 'unset',\n },\n // showing on top, as a floating alert\n floatingPositioning: {},\n icon: {\n fontSize: 20,\n },\n bannerIcon: {\n fontSize: 20,\n marginRight: '0.5rem',\n },\n content: {\n width: '100%',\n maxWidth: 'inherit',\n flexWrap: 'nowrap',\n backgroundColor: theme?.palette?.banner?.info ?? '#f0f0f0',\n display: 'flex',\n alignItems: 'center',\n color: theme?.palette?.banner?.text ?? '#000000',\n '& a': {\n color: theme?.palette?.banner?.link ?? '#0068c8',\n },\n },\n };\n});\n\ntype AnnouncementBannerProps = {\n announcement: Announcement;\n variant?: 'block' | 'floating';\n};\n\nconst AnnouncementBanner = (props: AnnouncementBannerProps) => {\n const classes = useStyles();\n const announcementsApi = useApi(announcementsApiRef);\n const viewAnnouncementLink = useRouteRef(announcementViewRouteRef);\n const { t } = useAnnouncementsTranslation();\n const [bannerOpen, setBannerOpen] = useState(true);\n const variant = props.variant || 'block';\n const announcement = props.announcement;\n\n const handleClick = () => {\n announcementsApi.markLastSeenDate(\n DateTime.fromISO(announcement.created_at),\n );\n setBannerOpen(false);\n };\n\n const message = (\n <>\n <Typography\n component=\"span\"\n className={classes.bannerIcon}\n variant=\"inherit\"\n >\n 📣\n </Typography>\n <Link\n to={viewAnnouncementLink({ id: announcement.id })}\n variant=\"inherit\"\n >\n {announcement.title}\n </Link>\n – {announcement.excerpt}\n </>\n );\n\n return (\n <Snackbar\n anchorOrigin={{ vertical: 'top', horizontal: 'center' }}\n open={bannerOpen}\n className={\n variant === 'block'\n ? classes.blockPositioning\n : classes.floatingPositioning\n }\n >\n <SnackbarContent\n className={classes.content}\n message={message}\n action={[\n <IconButton\n key=\"dismiss\"\n title={t('newAnnouncementBanner.markAsSeen')}\n color=\"inherit\"\n onClick={handleClick}\n >\n <Close className={classes.icon} />\n </IconButton>,\n ]}\n />\n </Snackbar>\n );\n};\n\ntype NewAnnouncementBannerProps = {\n variant?: 'block' | 'floating';\n max?: number;\n category?: string;\n active?: boolean;\n current?: boolean;\n tags?: string[];\n sortBy?: 'created_at' | 'updated_at';\n};\n\nexport const NewAnnouncementBanner = (props: NewAnnouncementBannerProps) => {\n const { max, category, tags, active, variant, current, sortBy } = props;\n\n const announcementsApi = useApi(announcementsApiRef);\n\n const [signaledAnnouncement, setSignaledAnnouncement] = useState<\n AnnouncementSignal['data'] | undefined\n >();\n\n const { announcements, loading, error } = useAnnouncements({\n max: max ?? 1,\n category,\n tags,\n active,\n current,\n sortBy,\n });\n const lastSeen = announcementsApi.lastSeenDate();\n\n const { lastSignal } = useSignal<AnnouncementSignal>(\n SIGNALS_CHANNEL_ANNOUNCEMENTS,\n );\n\n useEffect(() => {\n if (!lastSignal) {\n return;\n }\n\n setSignaledAnnouncement(lastSignal?.data);\n }, [lastSignal]);\n\n if (loading) {\n return null;\n } else if (error) {\n return <Alert severity=\"error\">{error.message}</Alert>;\n }\n\n if (announcements.count === 0) {\n return null;\n }\n\n const unseenAnnouncements = announcements.results.filter(announcement => {\n return lastSeen < DateTime.fromISO(announcement.created_at);\n });\n\n if (signaledAnnouncement) {\n unseenAnnouncements.push(signaledAnnouncement);\n }\n\n if (unseenAnnouncements?.length === 0) {\n return null;\n }\n\n return (\n <>\n {unseenAnnouncements.map(announcement => (\n <AnnouncementBanner\n key={announcement.id}\n announcement={announcement}\n variant={variant}\n />\n ))}\n </>\n );\n};\n"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -130,6 +130,7 @@ declare const NewAnnouncementBanner: (props: {
|
|
|
130
130
|
active?: boolean | undefined;
|
|
131
131
|
current?: boolean | undefined;
|
|
132
132
|
tags?: string[] | undefined;
|
|
133
|
+
sortBy?: "created_at" | "updated_at" | undefined;
|
|
133
134
|
}) => react_jsx_runtime.JSX.Element | null;
|
|
134
135
|
/**
|
|
135
136
|
* @public
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@backstage-community/plugin-announcements",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.14.0",
|
|
4
4
|
"main": "./dist/index.esm.js",
|
|
5
5
|
"types": "./dist/index.d.ts",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -61,8 +61,8 @@
|
|
|
61
61
|
"postpack": "backstage-cli package postpack"
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
|
-
"@backstage-community/plugin-announcements-common": "^0.
|
|
65
|
-
"@backstage-community/plugin-announcements-react": "^0.
|
|
64
|
+
"@backstage-community/plugin-announcements-common": "^0.11.0",
|
|
65
|
+
"@backstage-community/plugin-announcements-react": "^0.13.0",
|
|
66
66
|
"@backstage/catalog-model": "^1.7.5",
|
|
67
67
|
"@backstage/core-app-api": "^1.19.0",
|
|
68
68
|
"@backstage/core-compat-api": "^0.5.2",
|
|
@@ -82,7 +82,7 @@
|
|
|
82
82
|
"@mui/icons-material": "^5.15.6",
|
|
83
83
|
"@mui/material": "^5.15.6",
|
|
84
84
|
"@types/react": "^17.0.0 || ^18.0.0",
|
|
85
|
-
"@uiw/react-md-editor": "^4.0.
|
|
85
|
+
"@uiw/react-md-editor": "^4.0.8",
|
|
86
86
|
"add": "^2.0.6",
|
|
87
87
|
"luxon": "^3.2.0",
|
|
88
88
|
"react-use": "^17.2.4",
|