@red-hat-developer-hub/backstage-plugin-dynamic-home-page 1.4.2 → 1.5.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 +10 -0
- package/dist/components/CustomizableGrid.esm.js +7 -6
- package/dist/components/CustomizableGrid.esm.js.map +1 -1
- package/dist/components/CustomizableHomePage.esm.js +12 -8
- package/dist/components/CustomizableHomePage.esm.js.map +1 -1
- package/dist/components/DynamicCustomizableHomePage.esm.js +2 -2
- package/dist/components/DynamicCustomizableHomePage.esm.js.map +1 -1
- package/dist/components/DynamicHomePage.esm.js +2 -2
- package/dist/components/DynamicHomePage.esm.js.map +1 -1
- package/dist/components/EntitySection/EntityCard.esm.js +60 -58
- package/dist/components/EntitySection/EntityCard.esm.js.map +1 -1
- package/dist/components/EntitySection/EntitySection.esm.js +145 -122
- package/dist/components/EntitySection/EntitySection.esm.js.map +1 -1
- package/dist/components/EntitySection/TagList.esm.js +45 -43
- package/dist/components/EntitySection/TagList.esm.js.map +1 -1
- package/dist/components/EntitySection/ViewMoreLink.esm.js +2 -2
- package/dist/components/EntitySection/ViewMoreLink.esm.js.map +1 -1
- package/dist/components/FeaturedDocsCard.esm.js +2 -2
- package/dist/components/FeaturedDocsCard.esm.js.map +1 -1
- package/dist/components/Header.esm.js +18 -15
- package/dist/components/Header.esm.js.map +1 -1
- package/dist/components/Headline.esm.js +2 -2
- package/dist/components/Headline.esm.js.map +1 -1
- package/dist/components/HomePage.esm.js +12 -8
- package/dist/components/HomePage.esm.js.map +1 -1
- package/dist/components/LocalClock.esm.js +9 -8
- package/dist/components/LocalClock.esm.js.map +1 -1
- package/dist/components/Markdown.esm.js +12 -9
- package/dist/components/Markdown.esm.js.map +1 -1
- package/dist/components/MarkdownCard.esm.js +2 -2
- package/dist/components/MarkdownCard.esm.js.map +1 -1
- package/dist/components/OnboardingSection/OnboardingCard.esm.js +50 -44
- package/dist/components/OnboardingSection/OnboardingCard.esm.js.map +1 -1
- package/dist/components/OnboardingSection/OnboardingSection.esm.js +68 -62
- package/dist/components/OnboardingSection/OnboardingSection.esm.js.map +1 -1
- package/dist/components/Placeholder.esm.js +2 -2
- package/dist/components/Placeholder.esm.js.map +1 -1
- package/dist/components/QuickAccessCard.esm.js +14 -14
- package/dist/components/QuickAccessCard.esm.js.map +1 -1
- package/dist/components/ReadOnlyGrid.esm.js +18 -14
- package/dist/components/ReadOnlyGrid.esm.js.map +1 -1
- package/dist/components/SearchBar.esm.js +3 -2
- package/dist/components/SearchBar.esm.js.map +1 -1
- package/dist/components/TemplateSection/TemplateCard.esm.js +66 -64
- package/dist/components/TemplateSection/TemplateCard.esm.js.map +1 -1
- package/dist/components/TemplateSection/TemplateSection.esm.js +79 -63
- package/dist/components/TemplateSection/TemplateSection.esm.js.map +1 -1
- package/dist/components/TemplateSection/ViewMoreLink.esm.js +2 -2
- package/dist/components/TemplateSection/ViewMoreLink.esm.js.map +1 -1
- package/dist/components/VisitListener.esm.js +4 -3
- package/dist/components/VisitListener.esm.js.map +1 -1
- package/dist/components/WorldClock.esm.js +3 -3
- package/dist/components/WorldClock.esm.js.map +1 -1
- package/dist/hooks/useGreeting.esm.js +3 -3
- package/dist/hooks/useGreeting.esm.js.map +1 -1
- package/dist/index.d.ts +20 -19
- package/dist/plugin.esm.js.map +1 -1
- package/package.json +19 -19
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { useState, useEffect, Fragment } from 'react';
|
|
2
3
|
import { Link, WarningPanel, CodeSnippet } from '@backstage/core-components';
|
|
3
4
|
import { useUserProfile } from '@backstage/plugin-user-settings';
|
|
4
5
|
import Grid from '@mui/material/Grid';
|
|
@@ -28,10 +29,10 @@ const StyledLink = styled(Link)(({ theme }) => ({
|
|
|
28
29
|
const EntitySection = () => {
|
|
29
30
|
const theme = useTheme();
|
|
30
31
|
const { displayName, loading: profileLoading } = useUserProfile();
|
|
31
|
-
const [isRemoveFirstCard, setIsRemoveFirstCard] =
|
|
32
|
-
const [showDiscoveryCard, setShowDiscoveryCard] =
|
|
33
|
-
const [imgLoaded, setImgLoaded] =
|
|
34
|
-
|
|
32
|
+
const [isRemoveFirstCard, setIsRemoveFirstCard] = useState(false);
|
|
33
|
+
const [showDiscoveryCard, setShowDiscoveryCard] = useState(true);
|
|
34
|
+
const [imgLoaded, setImgLoaded] = useState(false);
|
|
35
|
+
useEffect(() => {
|
|
35
36
|
const isUserDismissedEntityIllustration = hasEntityIllustrationUserDismissed(displayName);
|
|
36
37
|
setIsRemoveFirstCard(isUserDismissedEntityIllustration);
|
|
37
38
|
}, [displayName]);
|
|
@@ -48,7 +49,7 @@ const EntitySection = () => {
|
|
|
48
49
|
const entities = data?.items ?? [];
|
|
49
50
|
let content;
|
|
50
51
|
if (isLoading) {
|
|
51
|
-
content = /* @__PURE__ */
|
|
52
|
+
content = /* @__PURE__ */ jsx(
|
|
52
53
|
Box,
|
|
53
54
|
{
|
|
54
55
|
sx: {
|
|
@@ -56,118 +57,138 @@ const EntitySection = () => {
|
|
|
56
57
|
display: "flex",
|
|
57
58
|
alignItems: "center",
|
|
58
59
|
justifyContent: "center"
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
|
|
60
|
+
},
|
|
61
|
+
children: /* @__PURE__ */ jsx(CircularProgress, {})
|
|
62
|
+
}
|
|
62
63
|
);
|
|
63
64
|
} else if (!data) {
|
|
64
|
-
content = /* @__PURE__ */
|
|
65
|
+
content = /* @__PURE__ */ jsx(WarningPanel, { severity: "error", title: "Could not fetch data.", children: /* @__PURE__ */ jsx(
|
|
65
66
|
CodeSnippet,
|
|
66
67
|
{
|
|
67
68
|
language: "text",
|
|
68
69
|
text: error?.toString() ?? "Unknown error"
|
|
69
70
|
}
|
|
70
|
-
));
|
|
71
|
+
) });
|
|
71
72
|
} else {
|
|
72
|
-
content = /* @__PURE__ */
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
73
|
+
content = /* @__PURE__ */ jsx(Box, { sx: { padding: "8px 8px 8px 0" }, children: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
74
|
+
/* @__PURE__ */ jsxs(Grid, { container: true, spacing: 1, alignItems: "stretch", children: [
|
|
75
|
+
!isRemoveFirstCard && !profileLoading && /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, md: 5, children: /* @__PURE__ */ jsxs(
|
|
76
|
+
Card,
|
|
77
|
+
{
|
|
78
|
+
elevation: 0,
|
|
79
|
+
sx: {
|
|
80
|
+
border: `1px solid ${theme.palette.grey[400]}`,
|
|
81
|
+
display: "flex",
|
|
82
|
+
flexDirection: "row",
|
|
83
|
+
alignItems: "center",
|
|
84
|
+
position: "relative",
|
|
85
|
+
transition: "opacity 0.5s ease-out, transform 0.5s ease-in-out",
|
|
86
|
+
opacity: showDiscoveryCard ? 1 : 0,
|
|
87
|
+
transform: showDiscoveryCard ? "translateX(0)" : "translateX(-50px)"
|
|
88
|
+
},
|
|
89
|
+
children: [
|
|
90
|
+
!imgLoaded && /* @__PURE__ */ jsx(
|
|
91
|
+
Skeleton,
|
|
92
|
+
{
|
|
93
|
+
variant: "rectangular",
|
|
94
|
+
height: 300,
|
|
95
|
+
sx: {
|
|
96
|
+
borderRadius: 3,
|
|
97
|
+
width: "clamp(140px, 14vw, 266px)"
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
),
|
|
101
|
+
/* @__PURE__ */ jsx(
|
|
102
|
+
Box,
|
|
103
|
+
{
|
|
104
|
+
component: "img",
|
|
105
|
+
src: HomePageEntityIllustration,
|
|
106
|
+
onLoad: () => setImgLoaded(true),
|
|
107
|
+
alt: "",
|
|
108
|
+
height: 300,
|
|
109
|
+
sx: {
|
|
110
|
+
width: "clamp(140px, 14vw, 266px)"
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
),
|
|
114
|
+
/* @__PURE__ */ jsxs(Box, { sx: { p: 2 }, children: [
|
|
115
|
+
/* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Typography, { variant: "body2", paragraph: true, children: "Browse the Systems, Components, Resources, and APIs that are available in your organization." }) }),
|
|
116
|
+
entities?.length > 0 && /* @__PURE__ */ jsx(
|
|
117
|
+
IconButton,
|
|
118
|
+
{
|
|
119
|
+
onClick: handleClose,
|
|
120
|
+
"aria-label": "close",
|
|
121
|
+
style: {
|
|
122
|
+
position: "absolute",
|
|
123
|
+
top: "8px",
|
|
124
|
+
right: "8px"
|
|
125
|
+
},
|
|
126
|
+
children: /* @__PURE__ */ jsx(CloseIcon, { style: { width: "16px", height: "16px" } })
|
|
127
|
+
}
|
|
128
|
+
)
|
|
129
|
+
] })
|
|
130
|
+
]
|
|
120
131
|
}
|
|
121
|
-
},
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
132
|
+
) }, "entities illustration"),
|
|
133
|
+
entities?.slice(0, isRemoveFirstCard ? 4 : 2).map((item) => /* @__PURE__ */ jsx(
|
|
134
|
+
Grid,
|
|
135
|
+
{
|
|
136
|
+
item: true,
|
|
137
|
+
xs: 12,
|
|
138
|
+
md: isRemoveFirstCard ? 3 : 3.5,
|
|
139
|
+
children: /* @__PURE__ */ jsx(
|
|
140
|
+
EntityCard,
|
|
141
|
+
{
|
|
142
|
+
entity: item,
|
|
143
|
+
title: item.spec?.profile?.displayName ?? item.metadata.name,
|
|
144
|
+
version: "latest",
|
|
145
|
+
description: item.metadata.description ?? "",
|
|
146
|
+
tags: item.metadata?.tags ?? [],
|
|
147
|
+
kind: item.kind
|
|
148
|
+
}
|
|
149
|
+
)
|
|
150
|
+
},
|
|
151
|
+
item.metadata.name
|
|
152
|
+
)),
|
|
153
|
+
entities?.length === 0 && /* @__PURE__ */ jsx(Grid, { item: true, md: isRemoveFirstCard ? 12 : 7, children: /* @__PURE__ */ jsx(
|
|
154
|
+
Box,
|
|
155
|
+
{
|
|
156
|
+
sx: {
|
|
157
|
+
display: "flex",
|
|
158
|
+
alignItems: "center",
|
|
159
|
+
justifyContent: "center",
|
|
160
|
+
minHeight: 300,
|
|
161
|
+
border: (muiTheme) => `1px solid ${muiTheme.palette.grey[400]}`,
|
|
162
|
+
borderRadius: 3,
|
|
163
|
+
overflow: "hidden"
|
|
164
|
+
},
|
|
165
|
+
children: /* @__PURE__ */ jsxs(CardContent, { children: [
|
|
166
|
+
/* @__PURE__ */ jsx(Typography, { sx: { fontSize: "1.125rem", fontWeight: 500 }, children: "No software catalog added yet" }),
|
|
167
|
+
/* @__PURE__ */ jsx(
|
|
168
|
+
Typography,
|
|
169
|
+
{
|
|
170
|
+
sx: {
|
|
171
|
+
fontSize: "0.875rem",
|
|
172
|
+
fontWeight: 400,
|
|
173
|
+
mt: "20px",
|
|
174
|
+
mb: "16px"
|
|
175
|
+
},
|
|
176
|
+
children: "Once software catalogs are added, this space will showcase relevant content tailored to your experience."
|
|
177
|
+
}
|
|
178
|
+
),
|
|
179
|
+
/* @__PURE__ */ jsx(StyledLink, { to: "/catalog-import", underline: "none", children: "Register a component" })
|
|
180
|
+
] })
|
|
164
181
|
}
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
182
|
+
) })
|
|
183
|
+
] }),
|
|
184
|
+
/* @__PURE__ */ jsx(Box, { sx: { pt: 2 }, children: entities?.length > 0 && /* @__PURE__ */ jsxs(ViewMoreLink, { to: "/catalog", children: [
|
|
185
|
+
"View all ",
|
|
186
|
+
data?.totalItems ? data?.totalItems : "",
|
|
187
|
+
" catalog entities"
|
|
188
|
+
] }) })
|
|
189
|
+
] }) });
|
|
169
190
|
}
|
|
170
|
-
return /* @__PURE__ */
|
|
191
|
+
return /* @__PURE__ */ jsxs(
|
|
171
192
|
Card,
|
|
172
193
|
{
|
|
173
194
|
elevation: 0,
|
|
@@ -179,22 +200,24 @@ const EntitySection = () => {
|
|
|
179
200
|
display: "none"
|
|
180
201
|
},
|
|
181
202
|
scrollbarWidth: "none"
|
|
182
|
-
}
|
|
183
|
-
},
|
|
184
|
-
/* @__PURE__ */ React.createElement(
|
|
185
|
-
Typography,
|
|
186
|
-
{
|
|
187
|
-
variant: "h3",
|
|
188
|
-
sx: {
|
|
189
|
-
display: "flex",
|
|
190
|
-
alignItems: "center",
|
|
191
|
-
fontWeight: "500",
|
|
192
|
-
fontSize: "1.5rem"
|
|
193
|
-
}
|
|
194
203
|
},
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
204
|
+
children: [
|
|
205
|
+
/* @__PURE__ */ jsx(
|
|
206
|
+
Typography,
|
|
207
|
+
{
|
|
208
|
+
variant: "h3",
|
|
209
|
+
sx: {
|
|
210
|
+
display: "flex",
|
|
211
|
+
alignItems: "center",
|
|
212
|
+
fontWeight: "500",
|
|
213
|
+
fontSize: "1.5rem"
|
|
214
|
+
},
|
|
215
|
+
children: "Explore Your Software Catalog"
|
|
216
|
+
}
|
|
217
|
+
),
|
|
218
|
+
content
|
|
219
|
+
]
|
|
220
|
+
}
|
|
198
221
|
);
|
|
199
222
|
};
|
|
200
223
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntitySection.esm.js","sources":["../../../src/components/EntitySection/EntitySection.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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 React from 'react';\n\nimport {\n CodeSnippet,\n WarningPanel,\n Link as BackstageLink,\n} from '@backstage/core-components';\nimport { useUserProfile } from '@backstage/plugin-user-settings';\n\nimport Grid from '@mui/material/Grid';\nimport Box from '@mui/material/Box';\nimport Card from '@mui/material/Card';\nimport IconButton from '@mui/material/IconButton';\nimport Skeleton from '@mui/material/Skeleton';\nimport Typography from '@mui/material/Typography';\nimport CloseIcon from '@mui/icons-material/Close';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport CardContent from '@mui/material/CardContent';\nimport { useTheme, styled } from '@mui/material/styles';\n\nimport EntityCard from './EntityCard';\nimport { ViewMoreLink } from './ViewMoreLink';\nimport HomePageEntityIllustration from '../../images/homepage-entities-1.svg';\nimport { useEntities } from '../../hooks/useEntities';\nimport {\n addDismissedEntityIllustrationUsers,\n hasEntityIllustrationUserDismissed,\n} from '../../utils/utils';\n\nconst StyledLink = styled(BackstageLink)(({ theme }) => ({\n textDecoration: 'none',\n padding: theme.spacing(1, 1.5),\n fontSize: '16px',\n display: 'inline-flex',\n border: `1px solid ${theme.palette.primary.main}`,\n borderRadius: 4,\n}));\n\nexport const EntitySection = () => {\n const theme = useTheme();\n const { displayName, loading: profileLoading } = useUserProfile();\n const [isRemoveFirstCard, setIsRemoveFirstCard] = React.useState(false);\n const [showDiscoveryCard, setShowDiscoveryCard] = React.useState(true);\n const [imgLoaded, setImgLoaded] = React.useState(false);\n\n React.useEffect(() => {\n const isUserDismissedEntityIllustration =\n hasEntityIllustrationUserDismissed(displayName);\n setIsRemoveFirstCard(isUserDismissedEntityIllustration);\n }, [displayName]);\n\n const handleClose = () => {\n setShowDiscoveryCard(false);\n setTimeout(() => {\n addDismissedEntityIllustrationUsers(displayName);\n setIsRemoveFirstCard(true);\n }, 500);\n };\n\n const { data, error, isLoading } = useEntities({\n kind: ['Component', 'API', 'Resource', 'System'],\n });\n\n const entities = data?.items ?? [];\n\n let content: React.ReactNode;\n\n if (isLoading) {\n content = (\n <Box\n sx={{\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n <CircularProgress />\n </Box>\n );\n } else if (!data) {\n content = (\n <WarningPanel severity=\"error\" title=\"Could not fetch data.\">\n <CodeSnippet\n language=\"text\"\n text={error?.toString() ?? 'Unknown error'}\n />\n </WarningPanel>\n );\n } else {\n content = (\n <Box sx={{ padding: '8px 8px 8px 0' }}>\n <React.Fragment>\n <Grid container spacing={1} alignItems=\"stretch\">\n {!isRemoveFirstCard && !profileLoading && (\n <Grid item xs={12} md={5} key=\"entities illustration\">\n <Card\n elevation={0}\n sx={{\n border: `1px solid ${theme.palette.grey[400]}`,\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n position: 'relative',\n transition:\n 'opacity 0.5s ease-out, transform 0.5s ease-in-out',\n opacity: showDiscoveryCard ? 1 : 0,\n transform: showDiscoveryCard\n ? 'translateX(0)'\n : 'translateX(-50px)',\n }}\n >\n {!imgLoaded && (\n <Skeleton\n variant=\"rectangular\"\n height={300}\n sx={{\n borderRadius: 3,\n width: 'clamp(140px, 14vw, 266px)',\n }}\n />\n )}\n <Box\n component=\"img\"\n src={HomePageEntityIllustration}\n onLoad={() => setImgLoaded(true)}\n alt=\"\"\n height={300}\n sx={{\n width: 'clamp(140px, 14vw, 266px)',\n }}\n />\n <Box sx={{ p: 2 }}>\n <Box>\n <Typography variant=\"body2\" paragraph>\n Browse the Systems, Components, Resources, and APIs that\n are available in your organization.\n </Typography>\n </Box>\n {entities?.length > 0 && (\n <IconButton\n onClick={handleClose}\n aria-label=\"close\"\n style={{\n position: 'absolute',\n top: '8px',\n right: '8px',\n }}\n >\n <CloseIcon style={{ width: '16px', height: '16px' }} />\n </IconButton>\n )}\n </Box>\n </Card>\n </Grid>\n )}\n {entities?.slice(0, isRemoveFirstCard ? 4 : 2).map((item: any) => (\n <Grid\n item\n xs={12}\n md={isRemoveFirstCard ? 3 : 3.5}\n key={item.metadata.name}\n >\n <EntityCard\n entity={item}\n title={item.spec?.profile?.displayName ?? item.metadata.name}\n version=\"latest\"\n description={item.metadata.description ?? ''}\n tags={item.metadata?.tags ?? []}\n kind={item.kind}\n />\n </Grid>\n ))}\n {entities?.length === 0 && (\n <Grid item md={isRemoveFirstCard ? 12 : 7}>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minHeight: 300,\n border: muiTheme =>\n `1px solid ${muiTheme.palette.grey[400]}`,\n borderRadius: 3,\n overflow: 'hidden',\n }}\n >\n <CardContent>\n <Typography sx={{ fontSize: '1.125rem', fontWeight: 500 }}>\n No software catalog added yet\n </Typography>\n <Typography\n sx={{\n fontSize: '0.875rem',\n fontWeight: 400,\n mt: '20px',\n mb: '16px',\n }}\n >\n Once software catalogs are added, this space will showcase\n relevant content tailored to your experience.\n </Typography>\n <StyledLink to=\"/catalog-import\" underline=\"none\">\n Register a component\n </StyledLink>\n </CardContent>\n </Box>\n </Grid>\n )}\n </Grid>\n <Box sx={{ pt: 2 }}>\n {entities?.length > 0 && (\n <ViewMoreLink to=\"/catalog\">\n View all {data?.totalItems ? data?.totalItems : ''} catalog\n entities\n </ViewMoreLink>\n )}\n </Box>\n </React.Fragment>\n </Box>\n );\n }\n\n return (\n <Card\n elevation={0}\n sx={{\n padding: '24px',\n border: muitheme => `1px solid ${muitheme.palette.grey[300]}`,\n overflow: 'auto',\n '$::-webkit-scrollbar': {\n display: 'none',\n },\n scrollbarWidth: 'none',\n }}\n >\n <Typography\n variant=\"h3\"\n sx={{\n display: 'flex',\n alignItems: 'center',\n fontWeight: '500',\n fontSize: '1.5rem',\n }}\n >\n Explore Your Software Catalog\n </Typography>\n {content}\n </Card>\n );\n};\n"],"names":["BackstageLink"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EntitySection.esm.js","sources":["../../../src/components/EntitySection/EntitySection.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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 type { ReactNode } from 'react';\n\nimport { useState, useEffect, Fragment } from 'react';\n\nimport {\n CodeSnippet,\n WarningPanel,\n Link as BackstageLink,\n} from '@backstage/core-components';\nimport { useUserProfile } from '@backstage/plugin-user-settings';\n\nimport Grid from '@mui/material/Grid';\nimport Box from '@mui/material/Box';\nimport Card from '@mui/material/Card';\nimport IconButton from '@mui/material/IconButton';\nimport Skeleton from '@mui/material/Skeleton';\nimport Typography from '@mui/material/Typography';\nimport CloseIcon from '@mui/icons-material/Close';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport CardContent from '@mui/material/CardContent';\nimport { useTheme, styled } from '@mui/material/styles';\n\nimport EntityCard from './EntityCard';\nimport { ViewMoreLink } from './ViewMoreLink';\nimport HomePageEntityIllustration from '../../images/homepage-entities-1.svg';\nimport { useEntities } from '../../hooks/useEntities';\nimport {\n addDismissedEntityIllustrationUsers,\n hasEntityIllustrationUserDismissed,\n} from '../../utils/utils';\n\nconst StyledLink = styled(BackstageLink)(({ theme }) => ({\n textDecoration: 'none',\n padding: theme.spacing(1, 1.5),\n fontSize: '16px',\n display: 'inline-flex',\n border: `1px solid ${theme.palette.primary.main}`,\n borderRadius: 4,\n}));\n\nexport const EntitySection = () => {\n const theme = useTheme();\n const { displayName, loading: profileLoading } = useUserProfile();\n const [isRemoveFirstCard, setIsRemoveFirstCard] = useState(false);\n const [showDiscoveryCard, setShowDiscoveryCard] = useState(true);\n const [imgLoaded, setImgLoaded] = useState(false);\n\n useEffect(() => {\n const isUserDismissedEntityIllustration =\n hasEntityIllustrationUserDismissed(displayName);\n setIsRemoveFirstCard(isUserDismissedEntityIllustration);\n }, [displayName]);\n\n const handleClose = () => {\n setShowDiscoveryCard(false);\n setTimeout(() => {\n addDismissedEntityIllustrationUsers(displayName);\n setIsRemoveFirstCard(true);\n }, 500);\n };\n\n const { data, error, isLoading } = useEntities({\n kind: ['Component', 'API', 'Resource', 'System'],\n });\n\n const entities = data?.items ?? [];\n\n let content: ReactNode;\n\n if (isLoading) {\n content = (\n <Box\n sx={{\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n <CircularProgress />\n </Box>\n );\n } else if (!data) {\n content = (\n <WarningPanel severity=\"error\" title=\"Could not fetch data.\">\n <CodeSnippet\n language=\"text\"\n text={error?.toString() ?? 'Unknown error'}\n />\n </WarningPanel>\n );\n } else {\n content = (\n <Box sx={{ padding: '8px 8px 8px 0' }}>\n <Fragment>\n <Grid container spacing={1} alignItems=\"stretch\">\n {!isRemoveFirstCard && !profileLoading && (\n <Grid item xs={12} md={5} key=\"entities illustration\">\n <Card\n elevation={0}\n sx={{\n border: `1px solid ${theme.palette.grey[400]}`,\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n position: 'relative',\n transition:\n 'opacity 0.5s ease-out, transform 0.5s ease-in-out',\n opacity: showDiscoveryCard ? 1 : 0,\n transform: showDiscoveryCard\n ? 'translateX(0)'\n : 'translateX(-50px)',\n }}\n >\n {!imgLoaded && (\n <Skeleton\n variant=\"rectangular\"\n height={300}\n sx={{\n borderRadius: 3,\n width: 'clamp(140px, 14vw, 266px)',\n }}\n />\n )}\n <Box\n component=\"img\"\n src={HomePageEntityIllustration}\n onLoad={() => setImgLoaded(true)}\n alt=\"\"\n height={300}\n sx={{\n width: 'clamp(140px, 14vw, 266px)',\n }}\n />\n <Box sx={{ p: 2 }}>\n <Box>\n <Typography variant=\"body2\" paragraph>\n Browse the Systems, Components, Resources, and APIs that\n are available in your organization.\n </Typography>\n </Box>\n {entities?.length > 0 && (\n <IconButton\n onClick={handleClose}\n aria-label=\"close\"\n style={{\n position: 'absolute',\n top: '8px',\n right: '8px',\n }}\n >\n <CloseIcon style={{ width: '16px', height: '16px' }} />\n </IconButton>\n )}\n </Box>\n </Card>\n </Grid>\n )}\n {entities?.slice(0, isRemoveFirstCard ? 4 : 2).map((item: any) => (\n <Grid\n item\n xs={12}\n md={isRemoveFirstCard ? 3 : 3.5}\n key={item.metadata.name}\n >\n <EntityCard\n entity={item}\n title={item.spec?.profile?.displayName ?? item.metadata.name}\n version=\"latest\"\n description={item.metadata.description ?? ''}\n tags={item.metadata?.tags ?? []}\n kind={item.kind}\n />\n </Grid>\n ))}\n {entities?.length === 0 && (\n <Grid item md={isRemoveFirstCard ? 12 : 7}>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minHeight: 300,\n border: muiTheme =>\n `1px solid ${muiTheme.palette.grey[400]}`,\n borderRadius: 3,\n overflow: 'hidden',\n }}\n >\n <CardContent>\n <Typography sx={{ fontSize: '1.125rem', fontWeight: 500 }}>\n No software catalog added yet\n </Typography>\n <Typography\n sx={{\n fontSize: '0.875rem',\n fontWeight: 400,\n mt: '20px',\n mb: '16px',\n }}\n >\n Once software catalogs are added, this space will showcase\n relevant content tailored to your experience.\n </Typography>\n <StyledLink to=\"/catalog-import\" underline=\"none\">\n Register a component\n </StyledLink>\n </CardContent>\n </Box>\n </Grid>\n )}\n </Grid>\n <Box sx={{ pt: 2 }}>\n {entities?.length > 0 && (\n <ViewMoreLink to=\"/catalog\">\n View all {data?.totalItems ? data?.totalItems : ''} catalog\n entities\n </ViewMoreLink>\n )}\n </Box>\n </Fragment>\n </Box>\n );\n }\n\n return (\n <Card\n elevation={0}\n sx={{\n padding: '24px',\n border: muitheme => `1px solid ${muitheme.palette.grey[300]}`,\n overflow: 'auto',\n '$::-webkit-scrollbar': {\n display: 'none',\n },\n scrollbarWidth: 'none',\n }}\n >\n <Typography\n variant=\"h3\"\n sx={{\n display: 'flex',\n alignItems: 'center',\n fontWeight: '500',\n fontSize: '1.5rem',\n }}\n >\n Explore Your Software Catalog\n </Typography>\n {content}\n </Card>\n );\n};\n"],"names":["BackstageLink"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import Box from '@mui/material/Box';
|
|
3
3
|
import Chip from '@mui/material/Chip';
|
|
4
4
|
import Typography from '@mui/material/Typography';
|
|
@@ -6,7 +6,7 @@ import { KINDS } from '../../utils/constants.esm.js';
|
|
|
6
6
|
|
|
7
7
|
const TagList = ({ tags, kind }) => {
|
|
8
8
|
const hiddenCount = tags.length - 3;
|
|
9
|
-
return /* @__PURE__ */
|
|
9
|
+
return /* @__PURE__ */ jsxs(
|
|
10
10
|
Box,
|
|
11
11
|
{
|
|
12
12
|
sx: {
|
|
@@ -16,51 +16,53 @@ const TagList = ({ tags, kind }) => {
|
|
|
16
16
|
flexWrap: "wrap",
|
|
17
17
|
alignItems: "flex-end",
|
|
18
18
|
gap: 0.5
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
{
|
|
24
|
-
key: kind,
|
|
25
|
-
label: /* @__PURE__ */ React.createElement(Typography, { sx: { fontSize: "0.8rem", fontWeight: 400 } }, kind),
|
|
26
|
-
sx: {
|
|
27
|
-
backgroundColor: KINDS[kind.toLocaleUpperCase()]?.fill,
|
|
28
|
-
color: "black"
|
|
29
|
-
},
|
|
30
|
-
variant: "filled",
|
|
31
|
-
size: "small"
|
|
32
|
-
}
|
|
33
|
-
),
|
|
34
|
-
tags.slice(0, 2).map((tag) => /* @__PURE__ */ React.createElement(
|
|
35
|
-
Chip,
|
|
36
|
-
{
|
|
37
|
-
key: tag,
|
|
38
|
-
label: /* @__PURE__ */ React.createElement(Typography, { sx: { fontSize: "0.8rem", fontWeight: 400 } }, tag),
|
|
39
|
-
variant: "outlined",
|
|
40
|
-
size: "small"
|
|
41
|
-
}
|
|
42
|
-
)),
|
|
43
|
-
hiddenCount > 0 && /* @__PURE__ */ React.createElement(
|
|
44
|
-
Chip,
|
|
45
|
-
{
|
|
46
|
-
label: /* @__PURE__ */ React.createElement(
|
|
47
|
-
Typography,
|
|
19
|
+
},
|
|
20
|
+
children: [
|
|
21
|
+
/* @__PURE__ */ jsx(
|
|
22
|
+
Chip,
|
|
48
23
|
{
|
|
24
|
+
label: /* @__PURE__ */ jsx(Typography, { sx: { fontSize: "0.8rem", fontWeight: 400 }, children: kind }),
|
|
49
25
|
sx: {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
26
|
+
backgroundColor: KINDS[kind.toLocaleUpperCase()]?.fill,
|
|
27
|
+
color: "black"
|
|
28
|
+
},
|
|
29
|
+
variant: "filled",
|
|
30
|
+
size: "small"
|
|
54
31
|
},
|
|
55
|
-
|
|
32
|
+
kind
|
|
56
33
|
),
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
34
|
+
tags.slice(0, 2).map((tag) => /* @__PURE__ */ jsx(
|
|
35
|
+
Chip,
|
|
36
|
+
{
|
|
37
|
+
label: /* @__PURE__ */ jsx(Typography, { sx: { fontSize: "0.8rem", fontWeight: 400 }, children: tag }),
|
|
38
|
+
variant: "outlined",
|
|
39
|
+
size: "small"
|
|
40
|
+
},
|
|
41
|
+
tag
|
|
42
|
+
)),
|
|
43
|
+
hiddenCount > 0 && /* @__PURE__ */ jsx(
|
|
44
|
+
Chip,
|
|
45
|
+
{
|
|
46
|
+
label: /* @__PURE__ */ jsx(
|
|
47
|
+
Typography,
|
|
48
|
+
{
|
|
49
|
+
sx: {
|
|
50
|
+
fontSize: "0.8rem",
|
|
51
|
+
fontWeight: 400,
|
|
52
|
+
color: (theme) => `${theme.palette.mode === "light" ? "#0066CC" : "#1FA7F8"}`
|
|
53
|
+
},
|
|
54
|
+
children: `${hiddenCount} more`
|
|
55
|
+
}
|
|
56
|
+
),
|
|
57
|
+
variant: "outlined",
|
|
58
|
+
size: "small",
|
|
59
|
+
sx: {
|
|
60
|
+
border: "none"
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
)
|
|
64
|
+
]
|
|
65
|
+
}
|
|
64
66
|
);
|
|
65
67
|
};
|
|
66
68
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TagList.esm.js","sources":["../../../src/components/EntitySection/TagList.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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
|
|
1
|
+
{"version":3,"file":"TagList.esm.js","sources":["../../../src/components/EntitySection/TagList.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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 type { FC } from 'react';\n\nimport Box from '@mui/material/Box';\nimport Chip from '@mui/material/Chip';\nimport Typography from '@mui/material/Typography';\nimport { KINDS } from '../../utils/constants';\n\ntype KindKeys = keyof typeof KINDS;\n\ninterface TagListProps {\n tags: string[];\n kind: string;\n}\n\nconst TagList: FC<TagListProps> = ({ tags, kind }) => {\n const hiddenCount = tags.length - 3;\n return (\n <Box\n sx={{\n height: '72px',\n overflow: 'hidden',\n display: 'flex',\n flexWrap: 'wrap',\n alignItems: 'flex-end',\n gap: 0.5,\n }}\n >\n <Chip\n key={kind}\n label={\n <Typography sx={{ fontSize: '0.8rem', fontWeight: 400 }}>\n {kind}\n </Typography>\n }\n sx={{\n backgroundColor: KINDS[kind.toLocaleUpperCase() as KindKeys]?.fill,\n color: 'black',\n }}\n variant=\"filled\"\n size=\"small\"\n />\n {tags.slice(0, 2).map(tag => (\n <Chip\n key={tag}\n label={\n <Typography sx={{ fontSize: '0.8rem', fontWeight: 400 }}>\n {tag}\n </Typography>\n }\n variant=\"outlined\"\n size=\"small\"\n />\n ))}\n\n {hiddenCount > 0 && (\n <Chip\n label={\n <Typography\n sx={{\n fontSize: '0.8rem',\n fontWeight: 400,\n color: theme =>\n `${theme.palette.mode === 'light' ? '#0066CC' : '#1FA7F8'}`,\n }}\n >\n {`${hiddenCount} more`}\n </Typography>\n }\n variant=\"outlined\"\n size=\"small\"\n sx={{\n border: 'none',\n }}\n />\n )}\n </Box>\n );\n};\n\nexport default TagList;\n"],"names":[],"mappings":";;;;;;AA6BA,MAAM,OAA4B,GAAA,CAAC,EAAE,IAAA,EAAM,MAAW,KAAA;AACpD,EAAM,MAAA,WAAA,GAAc,KAAK,MAAS,GAAA,CAAA;AAClC,EACE,uBAAA,IAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA;AAAA,QACF,MAAQ,EAAA,MAAA;AAAA,QACR,QAAU,EAAA,QAAA;AAAA,QACV,OAAS,EAAA,MAAA;AAAA,QACT,QAAU,EAAA,MAAA;AAAA,QACV,UAAY,EAAA,UAAA;AAAA,QACZ,GAAK,EAAA;AAAA,OACP;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YAEC,KAAA,kBACG,GAAA,CAAA,UAAA,EAAA,EAAW,EAAI,EAAA,EAAE,UAAU,QAAU,EAAA,UAAA,EAAY,GAAI,EAAA,EACnD,QACH,EAAA,IAAA,EAAA,CAAA;AAAA,YAEF,EAAI,EAAA;AAAA,cACF,eAAiB,EAAA,KAAA,CAAM,IAAK,CAAA,iBAAA,EAA+B,CAAG,EAAA,IAAA;AAAA,cAC9D,KAAO,EAAA;AAAA,aACT;AAAA,YACA,OAAQ,EAAA,QAAA;AAAA,YACR,IAAK,EAAA;AAAA,WAAA;AAAA,UAXA;AAAA,SAYP;AAAA,QACC,KAAK,KAAM,CAAA,CAAA,EAAG,CAAC,CAAA,CAAE,IAAI,CACpB,GAAA,qBAAA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YAEC,KAAA,kBACG,GAAA,CAAA,UAAA,EAAA,EAAW,EAAI,EAAA,EAAE,UAAU,QAAU,EAAA,UAAA,EAAY,GAAI,EAAA,EACnD,QACH,EAAA,GAAA,EAAA,CAAA;AAAA,YAEF,OAAQ,EAAA,UAAA;AAAA,YACR,IAAK,EAAA;AAAA,WAAA;AAAA,UAPA;AAAA,SASR,CAAA;AAAA,QAEA,cAAc,CACb,oBAAA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACC,KACE,kBAAA,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,EAAI,EAAA;AAAA,kBACF,QAAU,EAAA,QAAA;AAAA,kBACV,UAAY,EAAA,GAAA;AAAA,kBACZ,KAAA,EAAO,WACL,CAAG,EAAA,KAAA,CAAM,QAAQ,IAAS,KAAA,OAAA,GAAU,YAAY,SAAS,CAAA;AAAA,iBAC7D;AAAA,gBAEC,aAAG,WAAW,CAAA,KAAA;AAAA;AAAA,aACjB;AAAA,YAEF,OAAQ,EAAA,UAAA;AAAA,YACR,IAAK,EAAA,OAAA;AAAA,YACL,EAAI,EAAA;AAAA,cACF,MAAQ,EAAA;AAAA;AACV;AAAA;AACF;AAAA;AAAA,GAEJ;AAEJ;;;;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { Link } from '@backstage/core-components';
|
|
3
3
|
import Typography from '@mui/material/Typography';
|
|
4
4
|
|
|
5
5
|
const ViewMoreLink = ({ to, children }) => {
|
|
6
|
-
return /* @__PURE__ */
|
|
6
|
+
return /* @__PURE__ */ jsx(Link, { to, underline: "always", style: { textUnderlineOffset: "4px" }, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { fontWeight: 500 }, children }) });
|
|
7
7
|
};
|
|
8
8
|
|
|
9
9
|
export { ViewMoreLink };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewMoreLink.esm.js","sources":["../../../src/components/EntitySection/ViewMoreLink.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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
|
|
1
|
+
{"version":3,"file":"ViewMoreLink.esm.js","sources":["../../../src/components/EntitySection/ViewMoreLink.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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 type { ReactNode, FC } from 'react';\nimport { Link, LinkProps } from '@backstage/core-components';\nimport Typography from '@mui/material/Typography';\n\ninterface ViewMoreLinkProps extends LinkProps {\n to: string;\n children: string | ReactNode;\n}\n\nexport const ViewMoreLink: FC<ViewMoreLinkProps> = ({ to, children }) => {\n return (\n <Link to={to} underline=\"always\" style={{ textUnderlineOffset: '4px' }}>\n <Typography variant=\"body2\" sx={{ fontWeight: 500 }}>\n {children}\n </Typography>\n </Link>\n );\n};\n"],"names":[],"mappings":";;;;AAwBO,MAAM,YAAsC,GAAA,CAAC,EAAE,EAAA,EAAI,UAAe,KAAA;AACvE,EACE,uBAAA,GAAA,CAAC,QAAK,EAAQ,EAAA,SAAA,EAAU,UAAS,KAAO,EAAA,EAAE,qBAAqB,KAAM,EAAA,EACnE,8BAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,SAAQ,EAAI,EAAA,EAAE,YAAY,GAAI,EAAA,EAC/C,UACH,CACF,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { FeaturedDocsCard as FeaturedDocsCard$1 } from '@backstage/plugin-home';
|
|
3
3
|
|
|
4
4
|
const FeaturedDocsCard = (props) => {
|
|
5
|
-
return /* @__PURE__ */
|
|
5
|
+
return /* @__PURE__ */ jsx(FeaturedDocsCard$1, { subLinkText: " Learn more", ...props });
|
|
6
6
|
};
|
|
7
7
|
|
|
8
8
|
export { FeaturedDocsCard };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeaturedDocsCard.esm.js","sources":["../../src/components/FeaturedDocsCard.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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
|
|
1
|
+
{"version":3,"file":"FeaturedDocsCard.esm.js","sources":["../../src/components/FeaturedDocsCard.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\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 FeaturedDocsCard as PluginHomeFeaturedDocsCard,\n FeaturedDocsCardProps,\n} from '@backstage/plugin-home';\n\n/**\n * Overrides `FeaturedDocsCard` from the home plugin, but overrides the\n * `subLinkText` prop to be \" Learn more\" instead of \"LEARN MORE\".\n *\n * 1. To fix the all uppercase that is used in home plugin\n * 2. To add a small missing gap between the title and the button\n */\nexport const FeaturedDocsCard = (props: FeaturedDocsCardProps) => {\n return <PluginHomeFeaturedDocsCard subLinkText=\" Learn more\" {...props} />;\n};\n"],"names":["PluginHomeFeaturedDocsCard"],"mappings":";;;AA4Ba,MAAA,gBAAA,GAAmB,CAAC,KAAiC,KAAA;AAChE,EAAA,uBAAQ,GAAA,CAAAA,kBAAA,EAAA,EAA2B,WAAY,EAAA,aAAA,EAAe,GAAG,KAAO,EAAA,CAAA;AAC1E;;;;"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useMemo } from 'react';
|
|
2
3
|
import { useApi, identityApiRef } from '@backstage/core-plugin-api';
|
|
3
4
|
import { Header as Header$1 } from '@backstage/core-components';
|
|
4
5
|
import { HeaderWorldClock } from '@backstage/plugin-home';
|
|
@@ -13,7 +14,7 @@ const getPersonalizedTitle = (title, displayName) => {
|
|
|
13
14
|
const Header = (props) => {
|
|
14
15
|
const identityApi = useApi(identityApiRef);
|
|
15
16
|
const { value: profile } = useAsync(() => identityApi.getProfileInfo());
|
|
16
|
-
const title =
|
|
17
|
+
const title = useMemo(() => {
|
|
17
18
|
if (profile?.displayName && props.personalizedTitle) {
|
|
18
19
|
return getPersonalizedTitle(props.personalizedTitle, profile.displayName);
|
|
19
20
|
} else if (props.title) {
|
|
@@ -21,25 +22,27 @@ const Header = (props) => {
|
|
|
21
22
|
}
|
|
22
23
|
return getPersonalizedTitle("Welcome back!", profile?.displayName);
|
|
23
24
|
}, [profile?.displayName, props.personalizedTitle, props.title]);
|
|
24
|
-
const subtitle =
|
|
25
|
+
const subtitle = useMemo(() => {
|
|
25
26
|
return props.subtitle ? getPersonalizedTitle(props.subtitle, profile?.displayName) : undefined;
|
|
26
27
|
}, [props.subtitle, profile?.displayName]);
|
|
27
|
-
return /* @__PURE__ */
|
|
28
|
+
return /* @__PURE__ */ jsxs(
|
|
28
29
|
Header$1,
|
|
29
30
|
{
|
|
30
31
|
title,
|
|
31
32
|
subtitle,
|
|
32
|
-
pageTitleOverride: props.pageTitle
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
33
|
+
pageTitleOverride: props.pageTitle,
|
|
34
|
+
children: [
|
|
35
|
+
props.localClock?.format && props.localClock?.format !== "none" ? /* @__PURE__ */ jsx(
|
|
36
|
+
LocalClock,
|
|
37
|
+
{
|
|
38
|
+
label: props.localClock?.label ?? (props.worldClocks && props.worldClocks.length > 0 ? "Local" : undefined),
|
|
39
|
+
format: props.localClock?.format ?? (props.worldClocks && props.worldClocks.length > 0 ? "time" : undefined),
|
|
40
|
+
lang: props.localClock?.lang
|
|
41
|
+
}
|
|
42
|
+
) : null,
|
|
43
|
+
props.worldClocks && props.worldClocks.length > 0 ? /* @__PURE__ */ jsx(HeaderWorldClock, { clockConfigs: props.worldClocks }) : null
|
|
44
|
+
]
|
|
45
|
+
}
|
|
43
46
|
);
|
|
44
47
|
};
|
|
45
48
|
|