@backstage/plugin-techdocs 0.12.2 → 0.12.6
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 +68 -0
- package/dist/index.d.ts +24 -22
- package/dist/index.esm.js +234 -191
- package/dist/index.esm.js.map +1 -1
- package/package.json +18 -18
package/dist/index.esm.js
CHANGED
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
import { createApiRef, createRouteRef, useRouteRef, useApi, configApiRef, createPlugin, createApiFactory, discoveryApiRef, identityApiRef, createRoutableExtension, createComponentExtension } from '@backstage/core-plugin-api';
|
|
2
2
|
import { ResponseError, NotFoundError } from '@backstage/errors';
|
|
3
3
|
import { EventSourcePolyfill } from 'event-source-polyfill';
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import React, { useEffect, useState, Suspense, useReducer, useRef, useMemo, useContext, createContext, useCallback } from 'react';
|
|
5
|
+
import { makeStyles, ListItemText, ListItem, Divider, Card, CardMedia, CardContent, CardActions, Grid, TextField, InputAdornment, IconButton, CircularProgress, createStyles, Button as Button$1, Drawer, Typography, useTheme } from '@material-ui/core';
|
|
6
|
+
import { Link, SubvalueCell, Table, EmptyState, Button, WarningPanel, CodeSnippet, PageWithHeader, Content, ContentHeader, SupportButton, ItemCardGrid, ItemCardHeader, Progress, ErrorPage, HeaderLabel, Header, Page, HeaderTabs, MissingAnnotationEmptyState } from '@backstage/core-components';
|
|
7
|
+
import TextTruncate from 'react-text-truncate';
|
|
8
|
+
import { FilteredEntityLayout, FilterContainer, EntityListContainer } from '@backstage/plugin-catalog';
|
|
9
|
+
import { favoriteEntityIcon, favoriteEntityTooltip, EntityRefLinks, getEntityRelations, formatEntityRefTitle, useEntityListProvider, useStarredEntities, CATALOG_FILTER_EXISTS, EntityListProvider, UserListPicker, EntityOwnerPicker, EntityTagPicker, EntityRefLink, catalogApiRef, useOwnUser, isOwnerOf, useEntity } from '@backstage/plugin-catalog-react';
|
|
6
10
|
import { useCopyToClipboard, useDebounce, useAsyncRetry, useAsync } from 'react-use';
|
|
7
11
|
import { capitalize } from 'lodash';
|
|
8
|
-
import { SubvalueCell, Link, Table, EmptyState, Button, WarningPanel, CodeSnippet, PageWithHeader, Content, ContentHeader, SupportButton, ErrorPage, Progress, HeaderLabel, Header, Page, ItemCardGrid, ItemCardHeader, HeaderTabs, MissingAnnotationEmptyState } from '@backstage/core-components';
|
|
9
|
-
import { favoriteEntityIcon, favoriteEntityTooltip, EntityRefLinks, getEntityRelations, formatEntityRefTitle, useEntityListProvider, useStarredEntities, CATALOG_FILTER_EXISTS, EntityListProvider, UserListPicker, EntityOwnerPicker, EntityTagPicker, EntityRefLink, catalogApiRef, useOwnUser, isOwnerOf, useEntity } from '@backstage/plugin-catalog-react';
|
|
10
12
|
import { RELATION_OWNED_BY } from '@backstage/catalog-model';
|
|
11
13
|
import ShareIcon from '@material-ui/icons/Share';
|
|
12
|
-
import { FilteredEntityLayout, FilterContainer, EntityListContainer } from '@backstage/plugin-catalog';
|
|
13
|
-
import { makeStyles, ListItemText, ListItem, Divider, Grid, TextField, InputAdornment, IconButton, CircularProgress, createStyles, Button as Button$1, Drawer, Typography, useTheme, Card, CardMedia, CardContent, CardActions } from '@material-ui/core';
|
|
14
|
-
import TextTruncate from 'react-text-truncate';
|
|
15
14
|
import { useNavigate as useNavigate$1, useParams, Routes, Route } from 'react-router-dom';
|
|
16
15
|
import { scmIntegrationsApiRef } from '@backstage/integration-react';
|
|
17
16
|
import { replaceGitHubUrlType } from '@backstage/integration';
|
|
@@ -19,13 +18,12 @@ import FeedbackOutlinedIcon from '@material-ui/icons/FeedbackOutlined';
|
|
|
19
18
|
import ReactDOM from 'react-dom';
|
|
20
19
|
import parseGitUrl from 'git-url-parse';
|
|
21
20
|
import DOMPurify from 'dompurify';
|
|
22
|
-
import Autocomplete from '@material-ui/lab/Autocomplete';
|
|
23
21
|
import { SearchContextProvider, useSearch } from '@backstage/plugin-search';
|
|
24
22
|
import SearchIcon from '@material-ui/icons/Search';
|
|
23
|
+
import Autocomplete from '@material-ui/lab/Autocomplete';
|
|
25
24
|
import { useNavigate, useOutlet } from 'react-router';
|
|
26
25
|
import { Alert } from '@material-ui/lab';
|
|
27
26
|
import Close from '@material-ui/icons/Close';
|
|
28
|
-
import { LazyLog } from 'react-lazylog';
|
|
29
27
|
import CodeIcon from '@material-ui/icons/Code';
|
|
30
28
|
|
|
31
29
|
const techdocsStorageApiRef = createApiRef({
|
|
@@ -164,24 +162,64 @@ class TechDocsStorageClient {
|
|
|
164
162
|
}
|
|
165
163
|
}
|
|
166
164
|
|
|
165
|
+
const useStyles$2 = makeStyles({
|
|
166
|
+
flexContainer: {
|
|
167
|
+
flexWrap: "wrap"
|
|
168
|
+
},
|
|
169
|
+
itemText: {
|
|
170
|
+
width: "100%",
|
|
171
|
+
marginBottom: "1rem"
|
|
172
|
+
}
|
|
173
|
+
});
|
|
174
|
+
const DocsResultListItem = ({
|
|
175
|
+
result,
|
|
176
|
+
lineClamp = 5,
|
|
177
|
+
asListItem = true,
|
|
178
|
+
asLink = true,
|
|
179
|
+
title
|
|
180
|
+
}) => {
|
|
181
|
+
const classes = useStyles$2();
|
|
182
|
+
const TextItem = () => {
|
|
183
|
+
var _a;
|
|
184
|
+
return /* @__PURE__ */ React.createElement(ListItemText, {
|
|
185
|
+
className: classes.itemText,
|
|
186
|
+
primaryTypographyProps: {variant: "h6"},
|
|
187
|
+
primary: title ? title : `${result.title} | ${(_a = result.entityTitle) != null ? _a : result.name} docs`,
|
|
188
|
+
secondary: /* @__PURE__ */ React.createElement(TextTruncate, {
|
|
189
|
+
line: lineClamp,
|
|
190
|
+
truncateText: "\u2026",
|
|
191
|
+
text: result.text,
|
|
192
|
+
element: "span"
|
|
193
|
+
})
|
|
194
|
+
});
|
|
195
|
+
};
|
|
196
|
+
const LinkWrapper = ({children}) => asLink ? /* @__PURE__ */ React.createElement(Link, {
|
|
197
|
+
to: result.location
|
|
198
|
+
}, children) : /* @__PURE__ */ React.createElement(React.Fragment, null, children);
|
|
199
|
+
const ListItemWrapper = ({children}) => asListItem ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ListItem, {
|
|
200
|
+
alignItems: "flex-start",
|
|
201
|
+
className: classes.flexContainer
|
|
202
|
+
}, children), /* @__PURE__ */ React.createElement(Divider, {
|
|
203
|
+
component: "li"
|
|
204
|
+
})) : /* @__PURE__ */ React.createElement(React.Fragment, null, children);
|
|
205
|
+
return /* @__PURE__ */ React.createElement(LinkWrapper, null, /* @__PURE__ */ React.createElement(ListItemWrapper, null, /* @__PURE__ */ React.createElement(TextItem, null)));
|
|
206
|
+
};
|
|
207
|
+
|
|
167
208
|
const rootRouteRef = createRouteRef({
|
|
168
|
-
id: "techdocs
|
|
169
|
-
title: "TechDocs Landing Page"
|
|
209
|
+
id: "techdocs:index-page"
|
|
170
210
|
});
|
|
171
211
|
const rootDocsRouteRef = createRouteRef({
|
|
172
|
-
id: "techdocs
|
|
173
|
-
title: "Docs",
|
|
212
|
+
id: "techdocs:reader-page",
|
|
174
213
|
params: ["namespace", "kind", "name"]
|
|
175
214
|
});
|
|
176
215
|
const rootCatalogDocsRouteRef = createRouteRef({
|
|
177
|
-
id: "catalog-
|
|
178
|
-
title: "Docs"
|
|
216
|
+
id: "techdocs:catalog-reader-view"
|
|
179
217
|
});
|
|
180
218
|
|
|
181
219
|
function createCopyDocsUrlAction(copyToClipboard) {
|
|
182
220
|
return (row) => {
|
|
183
221
|
return {
|
|
184
|
-
icon: () => /* @__PURE__ */
|
|
222
|
+
icon: () => /* @__PURE__ */ React.createElement(ShareIcon, {
|
|
185
223
|
fontSize: "small"
|
|
186
224
|
}),
|
|
187
225
|
tooltip: "Click to copy documentation link to clipboard",
|
|
@@ -215,8 +253,8 @@ function createNameColumn() {
|
|
|
215
253
|
title: "Document",
|
|
216
254
|
field: "entity.metadata.name",
|
|
217
255
|
highlight: true,
|
|
218
|
-
render: (row) => /* @__PURE__ */
|
|
219
|
-
value: /* @__PURE__ */
|
|
256
|
+
render: (row) => /* @__PURE__ */ React.createElement(SubvalueCell, {
|
|
257
|
+
value: /* @__PURE__ */ React.createElement(Link, {
|
|
220
258
|
to: row.resolved.docsUrl
|
|
221
259
|
}, customTitle(row.entity)),
|
|
222
260
|
subvalue: row.entity.metadata.description
|
|
@@ -227,7 +265,7 @@ function createOwnerColumn() {
|
|
|
227
265
|
return {
|
|
228
266
|
title: "Owner",
|
|
229
267
|
field: "resolved.ownedByRelationsTitle",
|
|
230
|
-
render: ({resolved}) => /* @__PURE__ */
|
|
268
|
+
render: ({resolved}) => /* @__PURE__ */ React.createElement(EntityRefLinks, {
|
|
231
269
|
entityRefs: resolved.ownedByRelations,
|
|
232
270
|
defaultKind: "group"
|
|
233
271
|
})
|
|
@@ -256,7 +294,7 @@ const DocsTable$1 = ({
|
|
|
256
294
|
}) => {
|
|
257
295
|
const [, copyToClipboard] = useCopyToClipboard();
|
|
258
296
|
const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
|
|
259
|
-
const toLowerMaybe = useApi(configApiRef).getOptionalBoolean("techdocs.legacyUseCaseSensitiveTripletPaths") ? (str) => str : (str) => str.toLocaleLowerCase();
|
|
297
|
+
const toLowerMaybe = useApi(configApiRef).getOptionalBoolean("techdocs.legacyUseCaseSensitiveTripletPaths") ? (str) => str : (str) => str.toLocaleLowerCase("en-US");
|
|
260
298
|
if (!entities)
|
|
261
299
|
return null;
|
|
262
300
|
const documents = entities.map((entity) => {
|
|
@@ -283,7 +321,7 @@ const DocsTable$1 = ({
|
|
|
283
321
|
const defaultActions = [
|
|
284
322
|
createCopyDocsUrlAction(copyToClipboard)
|
|
285
323
|
];
|
|
286
|
-
return /* @__PURE__ */
|
|
324
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, loading || documents && documents.length > 0 ? /* @__PURE__ */ React.createElement(Table, {
|
|
287
325
|
isLoading: loading,
|
|
288
326
|
options: {
|
|
289
327
|
paging: true,
|
|
@@ -295,11 +333,11 @@ const DocsTable$1 = ({
|
|
|
295
333
|
columns: columns || defaultColumns,
|
|
296
334
|
actions: actions || defaultActions,
|
|
297
335
|
title: title ? `${title} (${documents.length})` : `All (${documents.length})`
|
|
298
|
-
}) : /* @__PURE__ */
|
|
336
|
+
}) : /* @__PURE__ */ React.createElement(EmptyState, {
|
|
299
337
|
missing: "data",
|
|
300
338
|
title: "No documents to show",
|
|
301
339
|
description: "Create your own document. Check out our Getting Started Information",
|
|
302
|
-
action: /* @__PURE__ */
|
|
340
|
+
action: /* @__PURE__ */ React.createElement(Button, {
|
|
303
341
|
color: "primary",
|
|
304
342
|
to: "https://backstage.io/docs/features/techdocs/getting-started",
|
|
305
343
|
variant: "contained"
|
|
@@ -326,15 +364,15 @@ const EntityListDocsTable = ({
|
|
|
326
364
|
createStarEntityAction(isStarredEntity, toggleStarredEntity)
|
|
327
365
|
];
|
|
328
366
|
if (error) {
|
|
329
|
-
return /* @__PURE__ */
|
|
367
|
+
return /* @__PURE__ */ React.createElement(WarningPanel, {
|
|
330
368
|
severity: "error",
|
|
331
369
|
title: "Could not load available documentation."
|
|
332
|
-
}, /* @__PURE__ */
|
|
370
|
+
}, /* @__PURE__ */ React.createElement(CodeSnippet, {
|
|
333
371
|
language: "text",
|
|
334
372
|
text: error.toString()
|
|
335
373
|
}));
|
|
336
374
|
}
|
|
337
|
-
return /* @__PURE__ */
|
|
375
|
+
return /* @__PURE__ */ React.createElement(DocsTable$1, {
|
|
338
376
|
title,
|
|
339
377
|
entities,
|
|
340
378
|
loading,
|
|
@@ -349,7 +387,7 @@ const TechDocsPageWrapper = ({children}) => {
|
|
|
349
387
|
var _a;
|
|
350
388
|
const configApi = useApi(configApiRef);
|
|
351
389
|
const generatedSubtitle = `Documentation available in ${(_a = configApi.getOptionalString("organization.name")) != null ? _a : "Backstage"}`;
|
|
352
|
-
return /* @__PURE__ */
|
|
390
|
+
return /* @__PURE__ */ React.createElement(PageWithHeader, {
|
|
353
391
|
title: "Documentation",
|
|
354
392
|
subtitle: generatedSubtitle,
|
|
355
393
|
themeId: "documentation"
|
|
@@ -378,54 +416,69 @@ const DefaultTechDocsHome = ({
|
|
|
378
416
|
columns,
|
|
379
417
|
actions
|
|
380
418
|
}) => {
|
|
381
|
-
return /* @__PURE__ */
|
|
419
|
+
return /* @__PURE__ */ React.createElement(TechDocsPageWrapper, null, /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(ContentHeader, {
|
|
382
420
|
title: ""
|
|
383
|
-
}, /* @__PURE__ */
|
|
421
|
+
}, /* @__PURE__ */ React.createElement(SupportButton, null, "Discover documentation in your ecosystem.")), /* @__PURE__ */ React.createElement(EntityListProvider, null, /* @__PURE__ */ React.createElement(FilteredEntityLayout, null, /* @__PURE__ */ React.createElement(FilterContainer, null, /* @__PURE__ */ React.createElement(TechDocsPicker, null), /* @__PURE__ */ React.createElement(UserListPicker, {
|
|
384
422
|
initialFilter
|
|
385
|
-
}), /* @__PURE__ */
|
|
423
|
+
}), /* @__PURE__ */ React.createElement(EntityOwnerPicker, null), /* @__PURE__ */ React.createElement(EntityTagPicker, null)), /* @__PURE__ */ React.createElement(EntityListContainer, null, /* @__PURE__ */ React.createElement(EntityListDocsTable, {
|
|
386
424
|
actions,
|
|
387
425
|
columns
|
|
388
426
|
}))))));
|
|
389
427
|
};
|
|
390
428
|
|
|
391
|
-
const
|
|
392
|
-
|
|
393
|
-
flexWrap: "wrap"
|
|
394
|
-
},
|
|
395
|
-
itemText: {
|
|
396
|
-
width: "100%",
|
|
397
|
-
marginBottom: "1rem"
|
|
398
|
-
}
|
|
399
|
-
});
|
|
400
|
-
const DocsResultListItem = ({
|
|
401
|
-
result,
|
|
402
|
-
lineClamp = 5,
|
|
403
|
-
asListItem = true,
|
|
404
|
-
asLink = true,
|
|
405
|
-
title
|
|
429
|
+
const DocsCardGrid$1 = ({
|
|
430
|
+
entities
|
|
406
431
|
}) => {
|
|
407
|
-
const
|
|
408
|
-
const
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
}
|
|
432
|
+
const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
|
|
433
|
+
const toLowerMaybe = useApi(configApiRef).getOptionalBoolean("techdocs.legacyUseCaseSensitiveTripletPaths") ? (str) => str : (str) => str.toLocaleLowerCase("en-US");
|
|
434
|
+
if (!entities)
|
|
435
|
+
return null;
|
|
436
|
+
return /* @__PURE__ */ React.createElement(ItemCardGrid, {
|
|
437
|
+
"data-testid": "docs-explore"
|
|
438
|
+
}, !(entities == null ? void 0 : entities.length) ? null : entities.map((entity, index) => {
|
|
439
|
+
var _a, _b;
|
|
440
|
+
return /* @__PURE__ */ React.createElement(Card, {
|
|
441
|
+
key: index
|
|
442
|
+
}, /* @__PURE__ */ React.createElement(CardMedia, null, /* @__PURE__ */ React.createElement(ItemCardHeader, {
|
|
443
|
+
title: (_a = entity.metadata.title) != null ? _a : entity.metadata.name
|
|
444
|
+
})), /* @__PURE__ */ React.createElement(CardContent, null, entity.metadata.description), /* @__PURE__ */ React.createElement(CardActions, null, /* @__PURE__ */ React.createElement(Button, {
|
|
445
|
+
to: getRouteToReaderPageFor({
|
|
446
|
+
namespace: toLowerMaybe((_b = entity.metadata.namespace) != null ? _b : "default"),
|
|
447
|
+
kind: toLowerMaybe(entity.kind),
|
|
448
|
+
name: toLowerMaybe(entity.metadata.name)
|
|
449
|
+
}),
|
|
450
|
+
color: "primary",
|
|
451
|
+
"data-testid": "read_docs"
|
|
452
|
+
}, "Read Docs")));
|
|
453
|
+
}));
|
|
454
|
+
};
|
|
455
|
+
|
|
456
|
+
var DocsCardGrid$2 = /*#__PURE__*/Object.freeze({
|
|
457
|
+
__proto__: null,
|
|
458
|
+
DocsCardGrid: DocsCardGrid$1
|
|
459
|
+
});
|
|
460
|
+
|
|
461
|
+
const EntityListDocsGrid = () => {
|
|
462
|
+
const {loading, error, entities} = useEntityListProvider();
|
|
463
|
+
if (error) {
|
|
464
|
+
return /* @__PURE__ */ React.createElement(WarningPanel, {
|
|
465
|
+
severity: "error",
|
|
466
|
+
title: "Could not load available documentation."
|
|
467
|
+
}, /* @__PURE__ */ React.createElement(CodeSnippet, {
|
|
468
|
+
language: "text",
|
|
469
|
+
text: error.toString()
|
|
470
|
+
}));
|
|
471
|
+
}
|
|
472
|
+
if (loading || !entities) {
|
|
473
|
+
return /* @__PURE__ */ React.createElement(Progress, null);
|
|
474
|
+
}
|
|
475
|
+
entities.sort((a, b) => {
|
|
476
|
+
var _a, _b;
|
|
477
|
+
return ((_a = a.metadata.title) != null ? _a : a.metadata.name).localeCompare((_b = b.metadata.title) != null ? _b : b.metadata.name);
|
|
478
|
+
});
|
|
479
|
+
return /* @__PURE__ */ React.createElement(DocsCardGrid$1, {
|
|
480
|
+
entities
|
|
418
481
|
});
|
|
419
|
-
const LinkWrapper = ({children}) => asLink ? /* @__PURE__ */ React__default.createElement(Link, {
|
|
420
|
-
to: result.location
|
|
421
|
-
}, children) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
|
|
422
|
-
const ListItemWrapper = ({children}) => asListItem ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(ListItem, {
|
|
423
|
-
alignItems: "flex-start",
|
|
424
|
-
className: classes.flexContainer
|
|
425
|
-
}, children), /* @__PURE__ */ React__default.createElement(Divider, {
|
|
426
|
-
component: "li"
|
|
427
|
-
})) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
|
|
428
|
-
return /* @__PURE__ */ React__default.createElement(LinkWrapper, null, /* @__PURE__ */ React__default.createElement(ListItemWrapper, null, /* @__PURE__ */ React__default.createElement(TextItem, null)));
|
|
429
482
|
};
|
|
430
483
|
|
|
431
484
|
const techdocsPlugin = createPlugin({
|
|
@@ -474,10 +527,10 @@ const EntityTechdocsContent = techdocsPlugin.provide(createRoutableExtension({
|
|
|
474
527
|
component: () => Promise.resolve().then(function () { return Router$1; }).then((m) => m.EmbeddedDocsRouter),
|
|
475
528
|
mountPoint: rootCatalogDocsRouteRef
|
|
476
529
|
}));
|
|
477
|
-
const DocsCardGrid
|
|
530
|
+
const DocsCardGrid = techdocsPlugin.provide(createComponentExtension({
|
|
478
531
|
name: "DocsCardGrid",
|
|
479
532
|
component: {
|
|
480
|
-
lazy: () => Promise.resolve().then(function () { return DocsCardGrid$
|
|
533
|
+
lazy: () => Promise.resolve().then(function () { return DocsCardGrid$2; }).then((m) => m.DocsCardGrid)
|
|
481
534
|
}
|
|
482
535
|
}));
|
|
483
536
|
const DocsTable = techdocsPlugin.provide(createComponentExtension({
|
|
@@ -577,7 +630,7 @@ Feedback:`);
|
|
|
577
630
|
default:
|
|
578
631
|
return dom;
|
|
579
632
|
}
|
|
580
|
-
ReactDOM.render(
|
|
633
|
+
ReactDOM.render(React.createElement(FeedbackOutlinedIcon), feedbackLink);
|
|
581
634
|
feedbackLink.style.paddingLeft = "5px";
|
|
582
635
|
feedbackLink.title = "Leave feedback for this page";
|
|
583
636
|
feedbackLink.id = "git-feedback-link";
|
|
@@ -742,11 +795,6 @@ const transform = async (html, transformers) => {
|
|
|
742
795
|
return dom;
|
|
743
796
|
};
|
|
744
797
|
|
|
745
|
-
const buildInitialFilters = (legacyPaths, entityId) => {
|
|
746
|
-
return legacyPaths ? entityId : Object.entries(entityId).reduce((acc, [key, value]) => {
|
|
747
|
-
return {...acc, [key]: value == null ? void 0 : value.toLocaleLowerCase("en-US")};
|
|
748
|
-
}, {});
|
|
749
|
-
};
|
|
750
798
|
const TechDocsSearchBar = ({
|
|
751
799
|
entityId,
|
|
752
800
|
debounceTime = 150
|
|
@@ -783,10 +831,10 @@ const TechDocsSearchBar = ({
|
|
|
783
831
|
navigate(location);
|
|
784
832
|
}
|
|
785
833
|
};
|
|
786
|
-
return /* @__PURE__ */
|
|
834
|
+
return /* @__PURE__ */ React.createElement(Grid, {
|
|
787
835
|
item: true,
|
|
788
836
|
xs: 12
|
|
789
|
-
}, /* @__PURE__ */
|
|
837
|
+
}, /* @__PURE__ */ React.createElement(Autocomplete, {
|
|
790
838
|
"data-testid": "techdocs-search-bar",
|
|
791
839
|
size: "small",
|
|
792
840
|
open,
|
|
@@ -805,7 +853,7 @@ const TechDocsSearchBar = ({
|
|
|
805
853
|
noOptionsText: "No results found",
|
|
806
854
|
value: null,
|
|
807
855
|
options,
|
|
808
|
-
renderOption: ({document}) => /* @__PURE__ */
|
|
856
|
+
renderOption: ({document}) => /* @__PURE__ */ React.createElement(DocsResultListItem, {
|
|
809
857
|
result: document,
|
|
810
858
|
lineClamp: 3,
|
|
811
859
|
asListItem: false,
|
|
@@ -813,7 +861,7 @@ const TechDocsSearchBar = ({
|
|
|
813
861
|
title: document.title
|
|
814
862
|
}),
|
|
815
863
|
loading,
|
|
816
|
-
renderInput: (params) => /* @__PURE__ */
|
|
864
|
+
renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, {
|
|
817
865
|
...params,
|
|
818
866
|
"data-testid": "techdocs-search-bar-input",
|
|
819
867
|
variant: "outlined",
|
|
@@ -823,13 +871,13 @@ const TechDocsSearchBar = ({
|
|
|
823
871
|
onChange: handleQuery,
|
|
824
872
|
InputProps: {
|
|
825
873
|
...params.InputProps,
|
|
826
|
-
startAdornment: /* @__PURE__ */
|
|
874
|
+
startAdornment: /* @__PURE__ */ React.createElement(InputAdornment, {
|
|
827
875
|
position: "start"
|
|
828
|
-
}, /* @__PURE__ */
|
|
876
|
+
}, /* @__PURE__ */ React.createElement(IconButton, {
|
|
829
877
|
"aria-label": "Query",
|
|
830
878
|
disabled: true
|
|
831
|
-
}, /* @__PURE__ */
|
|
832
|
-
endAdornment: /* @__PURE__ */
|
|
879
|
+
}, /* @__PURE__ */ React.createElement(SearchIcon, null))),
|
|
880
|
+
endAdornment: /* @__PURE__ */ React.createElement(React.Fragment, null, loading ? /* @__PURE__ */ React.createElement(CircularProgress, {
|
|
833
881
|
color: "inherit",
|
|
834
882
|
size: 20
|
|
835
883
|
}) : null, params.InputProps.endAdornment)
|
|
@@ -838,21 +886,20 @@ const TechDocsSearchBar = ({
|
|
|
838
886
|
}));
|
|
839
887
|
};
|
|
840
888
|
const TechDocsSearch = (props) => {
|
|
841
|
-
const configApi = useApi(configApiRef);
|
|
842
|
-
const legacyPaths = configApi.getOptionalBoolean("techdocs.legacyUseCaseSensitiveTripletPaths");
|
|
843
889
|
const initialState = {
|
|
844
890
|
term: "",
|
|
845
891
|
types: ["techdocs"],
|
|
846
892
|
pageCursor: "",
|
|
847
|
-
filters:
|
|
893
|
+
filters: props.entityId
|
|
848
894
|
};
|
|
849
|
-
return /* @__PURE__ */
|
|
895
|
+
return /* @__PURE__ */ React.createElement(SearchContextProvider, {
|
|
850
896
|
initialState
|
|
851
|
-
}, /* @__PURE__ */
|
|
897
|
+
}, /* @__PURE__ */ React.createElement(TechDocsSearchBar, {
|
|
852
898
|
...props
|
|
853
899
|
}));
|
|
854
900
|
};
|
|
855
901
|
|
|
902
|
+
const LazyLog = React.lazy(() => import('react-lazylog/build/LazyLog'));
|
|
856
903
|
const useDrawerStyles = makeStyles((theme) => createStyles({
|
|
857
904
|
paper: {
|
|
858
905
|
width: "100%",
|
|
@@ -894,13 +941,15 @@ const TechDocsBuildLogsDrawerContent = ({
|
|
|
894
941
|
title: "Close the drawer",
|
|
895
942
|
onClick: onClose,
|
|
896
943
|
color: "inherit"
|
|
897
|
-
}, /* @__PURE__ */ React.createElement(Close, null))), /* @__PURE__ */ React.createElement(
|
|
944
|
+
}, /* @__PURE__ */ React.createElement(Close, null))), /* @__PURE__ */ React.createElement(Suspense, {
|
|
945
|
+
fallback: /* @__PURE__ */ React.createElement(Progress, null)
|
|
946
|
+
}, /* @__PURE__ */ React.createElement(LazyLog, {
|
|
898
947
|
text: buildLog.length === 0 ? "Waiting for logs..." : buildLog.join("\n"),
|
|
899
948
|
extraLines: 1,
|
|
900
949
|
follow: true,
|
|
901
950
|
selectableLines: true,
|
|
902
951
|
enableSearch: true
|
|
903
|
-
}));
|
|
952
|
+
})));
|
|
904
953
|
};
|
|
905
954
|
const TechDocsBuildLogs = ({buildLog}) => {
|
|
906
955
|
const classes = useDrawerStyles();
|
|
@@ -925,7 +974,7 @@ const TechDocsNotFound = ({errorMessage}) => {
|
|
|
925
974
|
if (techdocsBuilder !== "local") {
|
|
926
975
|
additionalInfo = "Note that techdocs.builder is not set to 'local' in your config, which means this Backstage app will not generate docs if they are not found. Make sure the project's docs are generated and published by some external process (e.g. CI/CD pipeline). Or change techdocs.builder to 'local' to generate docs from this Backstage instance.";
|
|
927
976
|
}
|
|
928
|
-
return /* @__PURE__ */
|
|
977
|
+
return /* @__PURE__ */ React.createElement(ErrorPage, {
|
|
929
978
|
status: "404",
|
|
930
979
|
statusMessage: errorMessage || "Documentation not found",
|
|
931
980
|
additionalInfo
|
|
@@ -948,64 +997,64 @@ const TechDocsStateIndicator = () => {
|
|
|
948
997
|
syncErrorMessage,
|
|
949
998
|
buildLog
|
|
950
999
|
} = useTechDocsReader();
|
|
951
|
-
const ReaderProgress = state === "CHECKING" ? /* @__PURE__ */
|
|
1000
|
+
const ReaderProgress = state === "CHECKING" ? /* @__PURE__ */ React.createElement(Progress, null) : null;
|
|
952
1001
|
if (state === "INITIAL_BUILD") {
|
|
953
|
-
StateAlert = /* @__PURE__ */
|
|
1002
|
+
StateAlert = /* @__PURE__ */ React.createElement(Alert, {
|
|
954
1003
|
variant: "outlined",
|
|
955
1004
|
severity: "info",
|
|
956
|
-
icon: /* @__PURE__ */
|
|
1005
|
+
icon: /* @__PURE__ */ React.createElement(CircularProgress, {
|
|
957
1006
|
size: "24px"
|
|
958
1007
|
}),
|
|
959
|
-
action: /* @__PURE__ */
|
|
1008
|
+
action: /* @__PURE__ */ React.createElement(TechDocsBuildLogs, {
|
|
960
1009
|
buildLog
|
|
961
1010
|
})
|
|
962
1011
|
}, "Documentation is accessed for the first time and is being prepared. The subsequent loads are much faster.");
|
|
963
1012
|
}
|
|
964
1013
|
if (state === "CONTENT_STALE_REFRESHING") {
|
|
965
|
-
StateAlert = /* @__PURE__ */
|
|
1014
|
+
StateAlert = /* @__PURE__ */ React.createElement(Alert, {
|
|
966
1015
|
variant: "outlined",
|
|
967
1016
|
severity: "info",
|
|
968
|
-
icon: /* @__PURE__ */
|
|
1017
|
+
icon: /* @__PURE__ */ React.createElement(CircularProgress, {
|
|
969
1018
|
size: "24px"
|
|
970
1019
|
}),
|
|
971
|
-
action: /* @__PURE__ */
|
|
1020
|
+
action: /* @__PURE__ */ React.createElement(TechDocsBuildLogs, {
|
|
972
1021
|
buildLog
|
|
973
1022
|
})
|
|
974
1023
|
}, "A newer version of this documentation is being prepared and will be available shortly.");
|
|
975
1024
|
}
|
|
976
1025
|
if (state === "CONTENT_STALE_READY") {
|
|
977
|
-
StateAlert = /* @__PURE__ */
|
|
1026
|
+
StateAlert = /* @__PURE__ */ React.createElement(Alert, {
|
|
978
1027
|
variant: "outlined",
|
|
979
1028
|
severity: "success",
|
|
980
|
-
action: /* @__PURE__ */
|
|
1029
|
+
action: /* @__PURE__ */ React.createElement(Button$1, {
|
|
981
1030
|
color: "inherit",
|
|
982
1031
|
onClick: () => contentReload()
|
|
983
1032
|
}, "Refresh")
|
|
984
1033
|
}, "A newer version of this documentation is now available, please refresh to view.");
|
|
985
1034
|
}
|
|
986
1035
|
if (state === "CONTENT_STALE_ERROR") {
|
|
987
|
-
StateAlert = /* @__PURE__ */
|
|
1036
|
+
StateAlert = /* @__PURE__ */ React.createElement(Alert, {
|
|
988
1037
|
variant: "outlined",
|
|
989
1038
|
severity: "error",
|
|
990
|
-
action: /* @__PURE__ */
|
|
1039
|
+
action: /* @__PURE__ */ React.createElement(TechDocsBuildLogs, {
|
|
991
1040
|
buildLog
|
|
992
1041
|
}),
|
|
993
1042
|
classes: {message: classes.message}
|
|
994
1043
|
}, "Building a newer version of this documentation failed.", " ", syncErrorMessage);
|
|
995
1044
|
}
|
|
996
1045
|
if (state === "CONTENT_NOT_FOUND") {
|
|
997
|
-
StateAlert = /* @__PURE__ */
|
|
1046
|
+
StateAlert = /* @__PURE__ */ React.createElement(React.Fragment, null, syncErrorMessage && /* @__PURE__ */ React.createElement(Alert, {
|
|
998
1047
|
variant: "outlined",
|
|
999
1048
|
severity: "error",
|
|
1000
|
-
action: /* @__PURE__ */
|
|
1049
|
+
action: /* @__PURE__ */ React.createElement(TechDocsBuildLogs, {
|
|
1001
1050
|
buildLog
|
|
1002
1051
|
}),
|
|
1003
1052
|
classes: {message: classes.message}
|
|
1004
|
-
}, "Building a newer version of this documentation failed.", " ", syncErrorMessage), /* @__PURE__ */
|
|
1053
|
+
}, "Building a newer version of this documentation failed.", " ", syncErrorMessage), /* @__PURE__ */ React.createElement(TechDocsNotFound, {
|
|
1005
1054
|
errorMessage: contentErrorMessage
|
|
1006
1055
|
}));
|
|
1007
1056
|
}
|
|
1008
|
-
return /* @__PURE__ */
|
|
1057
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, ReaderProgress, StateAlert);
|
|
1009
1058
|
};
|
|
1010
1059
|
|
|
1011
1060
|
function calculateDisplayState({
|
|
@@ -1166,23 +1215,29 @@ const useStyles = makeStyles((theme) => ({
|
|
|
1166
1215
|
}
|
|
1167
1216
|
}));
|
|
1168
1217
|
const TechDocsReaderContext = createContext({});
|
|
1169
|
-
const TechDocsReaderProvider = ({
|
|
1170
|
-
|
|
1218
|
+
const TechDocsReaderProvider = ({
|
|
1219
|
+
children,
|
|
1220
|
+
entityRef
|
|
1221
|
+
}) => {
|
|
1222
|
+
const {"*": path} = useParams();
|
|
1223
|
+
const {kind, namespace, name} = entityRef;
|
|
1171
1224
|
const value = useReaderState(kind, namespace, name, path);
|
|
1172
|
-
return /* @__PURE__ */
|
|
1225
|
+
return /* @__PURE__ */ React.createElement(TechDocsReaderContext.Provider, {
|
|
1173
1226
|
value
|
|
1174
1227
|
}, children);
|
|
1175
1228
|
};
|
|
1176
|
-
const withTechDocsReaderProvider = (Component) => (props) => /* @__PURE__ */
|
|
1229
|
+
const withTechDocsReaderProvider = (Component, entityRef) => (props) => /* @__PURE__ */ React.createElement(TechDocsReaderProvider, {
|
|
1230
|
+
entityRef
|
|
1231
|
+
}, /* @__PURE__ */ React.createElement(Component, {
|
|
1177
1232
|
...props
|
|
1178
1233
|
}));
|
|
1179
1234
|
const useTechDocsReader = () => useContext(TechDocsReaderContext);
|
|
1180
|
-
const useTechDocsReaderDom = () => {
|
|
1235
|
+
const useTechDocsReaderDom = (entityRef) => {
|
|
1181
1236
|
const navigate = useNavigate$1();
|
|
1182
1237
|
const theme = useTheme();
|
|
1183
1238
|
const techdocsStorageApi = useApi(techdocsStorageApiRef);
|
|
1184
1239
|
const scmIntegrationsApi = useApi(scmIntegrationsApiRef);
|
|
1185
|
-
const {namespace = "", kind = "", name = ""} =
|
|
1240
|
+
const {namespace = "", kind = "", name = ""} = entityRef;
|
|
1186
1241
|
const {state, path, content: rawPage} = useTechDocsReader();
|
|
1187
1242
|
const [sidebars, setSidebars] = useState();
|
|
1188
1243
|
const [dom, setDom] = useState(null);
|
|
@@ -1237,6 +1292,7 @@ const useTechDocsReaderDom = () => {
|
|
|
1237
1292
|
.md-footer-nav__link { width: 20rem;}
|
|
1238
1293
|
.md-content { margin-left: 20rem; max-width: calc(100% - 20rem * 2 - 3rem); }
|
|
1239
1294
|
.md-typeset { font-size: 1rem; }
|
|
1295
|
+
.md-typeset h1, .md-typeset h2, .md-typeset h3 { font-weight: bold; }
|
|
1240
1296
|
.md-nav { font-size: 1rem; }
|
|
1241
1297
|
.md-grid { max-width: 90vw; margin: 0 }
|
|
1242
1298
|
.md-typeset table:not([class]) {
|
|
@@ -1252,6 +1308,16 @@ const useTechDocsReaderDom = () => {
|
|
|
1252
1308
|
.md-typeset .admonition, .md-typeset details {
|
|
1253
1309
|
font-size: 1rem;
|
|
1254
1310
|
}
|
|
1311
|
+
|
|
1312
|
+
/* style the checkmarks of the task list */
|
|
1313
|
+
.md-typeset .task-list-control .task-list-indicator::before {
|
|
1314
|
+
background-color: ${theme.palette.action.disabledBackground};
|
|
1315
|
+
}
|
|
1316
|
+
.md-typeset .task-list-control [type="checkbox"]:checked + .task-list-indicator:before {
|
|
1317
|
+
background-color: ${theme.palette.success.main};
|
|
1318
|
+
}
|
|
1319
|
+
/**/
|
|
1320
|
+
|
|
1255
1321
|
@media screen and (max-width: 76.1875em) {
|
|
1256
1322
|
.md-nav {
|
|
1257
1323
|
background-color: ${theme.palette.background.default};
|
|
@@ -1318,8 +1384,8 @@ const useTechDocsReaderDom = () => {
|
|
|
1318
1384
|
--md-details-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.59 16.58L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.42z"/></svg>');
|
|
1319
1385
|
}
|
|
1320
1386
|
:host {
|
|
1321
|
-
--md-tasklist-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="
|
|
1322
|
-
--md-tasklist-icon--checked: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="
|
|
1387
|
+
--md-tasklist-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"/></svg>');
|
|
1388
|
+
--md-tasklist-icon--checked: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>');
|
|
1323
1389
|
}
|
|
1324
1390
|
`
|
|
1325
1391
|
})
|
|
@@ -1329,9 +1395,11 @@ const useTechDocsReaderDom = () => {
|
|
|
1329
1395
|
namespace,
|
|
1330
1396
|
scmIntegrationsApi,
|
|
1331
1397
|
techdocsStorageApi,
|
|
1398
|
+
theme.palette.action.disabledBackground,
|
|
1332
1399
|
theme.palette.background.default,
|
|
1333
1400
|
theme.palette.background.paper,
|
|
1334
1401
|
theme.palette.primary.main,
|
|
1402
|
+
theme.palette.success.main,
|
|
1335
1403
|
theme.palette.text.primary,
|
|
1336
1404
|
theme.typography.fontFamily
|
|
1337
1405
|
]);
|
|
@@ -1340,13 +1408,14 @@ const useTechDocsReaderDom = () => {
|
|
|
1340
1408
|
addLinkClickListener({
|
|
1341
1409
|
baseUrl: window.location.origin,
|
|
1342
1410
|
onClick: (_, url) => {
|
|
1343
|
-
var _a;
|
|
1411
|
+
var _a, _b;
|
|
1344
1412
|
const parsedUrl = new URL(url);
|
|
1345
1413
|
if (parsedUrl.hash) {
|
|
1346
1414
|
navigate(`${parsedUrl.pathname}${parsedUrl.hash}`);
|
|
1347
1415
|
(_a = transformedElement == null ? void 0 : transformedElement.querySelector(`#${parsedUrl.hash.slice(1)}`)) == null ? void 0 : _a.scrollIntoView();
|
|
1348
1416
|
} else {
|
|
1349
1417
|
navigate(parsedUrl.pathname);
|
|
1418
|
+
(_b = transformedElement == null ? void 0 : transformedElement.querySelector(".md-content__inner")) == null ? void 0 : _b.scrollIntoView();
|
|
1350
1419
|
}
|
|
1351
1420
|
}
|
|
1352
1421
|
}),
|
|
@@ -1393,8 +1462,12 @@ const TheReader = ({
|
|
|
1393
1462
|
}) => {
|
|
1394
1463
|
var _a, _b;
|
|
1395
1464
|
const classes = useStyles();
|
|
1396
|
-
const dom = useTechDocsReaderDom();
|
|
1465
|
+
const dom = useTechDocsReaderDom(entityRef);
|
|
1397
1466
|
const shadowDomRef = useRef(null);
|
|
1467
|
+
const onReadyRef = useRef(onReady);
|
|
1468
|
+
useEffect(() => {
|
|
1469
|
+
onReadyRef.current = onReady;
|
|
1470
|
+
}, [onReady]);
|
|
1398
1471
|
useEffect(() => {
|
|
1399
1472
|
if (!dom || !shadowDomRef.current)
|
|
1400
1473
|
return;
|
|
@@ -1402,14 +1475,14 @@ const TheReader = ({
|
|
|
1402
1475
|
const shadowRoot = shadowDiv.shadowRoot || shadowDiv.attachShadow({mode: "open"});
|
|
1403
1476
|
Array.from(shadowRoot.children).forEach((child) => shadowRoot.removeChild(child));
|
|
1404
1477
|
shadowRoot.appendChild(dom);
|
|
1405
|
-
|
|
1406
|
-
}, [dom
|
|
1407
|
-
return /* @__PURE__ */
|
|
1478
|
+
onReadyRef.current();
|
|
1479
|
+
}, [dom]);
|
|
1480
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TechDocsStateIndicator, null), withSearch && ((_b = (_a = shadowDomRef == null ? void 0 : shadowDomRef.current) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.innerHTML) && /* @__PURE__ */ React.createElement(Grid, {
|
|
1408
1481
|
container: true,
|
|
1409
1482
|
className: classes.searchBar
|
|
1410
|
-
}, /* @__PURE__ */
|
|
1483
|
+
}, /* @__PURE__ */ React.createElement(TechDocsSearch, {
|
|
1411
1484
|
entityId: entityRef
|
|
1412
|
-
})), /* @__PURE__ */
|
|
1485
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
1413
1486
|
"data-testid": "techdocs-content-shadowroot",
|
|
1414
1487
|
ref: shadowDomRef
|
|
1415
1488
|
}));
|
|
@@ -1419,7 +1492,9 @@ const Reader = ({
|
|
|
1419
1492
|
onReady = () => {
|
|
1420
1493
|
},
|
|
1421
1494
|
withSearch = true
|
|
1422
|
-
}) => /* @__PURE__ */
|
|
1495
|
+
}) => /* @__PURE__ */ React.createElement(TechDocsReaderProvider, {
|
|
1496
|
+
entityRef
|
|
1497
|
+
}, /* @__PURE__ */ React.createElement(TheReader, {
|
|
1423
1498
|
entityRef,
|
|
1424
1499
|
onReady,
|
|
1425
1500
|
withSearch
|
|
@@ -1436,34 +1511,34 @@ const TechDocsPageHeader = ({
|
|
|
1436
1511
|
const lifecycle = spec == null ? void 0 : spec.lifecycle;
|
|
1437
1512
|
const ownedByRelations = entityMetadata ? getEntityRelations(entityMetadata, RELATION_OWNED_BY) : [];
|
|
1438
1513
|
const docsRootLink = useRouteRef(rootRouteRef)();
|
|
1439
|
-
const labels = /* @__PURE__ */
|
|
1514
|
+
const labels = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(HeaderLabel, {
|
|
1440
1515
|
label: "Component",
|
|
1441
|
-
value: /* @__PURE__ */
|
|
1516
|
+
value: /* @__PURE__ */ React.createElement(EntityRefLink, {
|
|
1442
1517
|
color: "inherit",
|
|
1443
1518
|
entityRef,
|
|
1444
1519
|
defaultKind: "Component"
|
|
1445
1520
|
})
|
|
1446
|
-
}), ownedByRelations.length > 0 && /* @__PURE__ */
|
|
1521
|
+
}), ownedByRelations.length > 0 && /* @__PURE__ */ React.createElement(HeaderLabel, {
|
|
1447
1522
|
label: "Owner",
|
|
1448
|
-
value: /* @__PURE__ */
|
|
1523
|
+
value: /* @__PURE__ */ React.createElement(EntityRefLinks, {
|
|
1449
1524
|
color: "inherit",
|
|
1450
1525
|
entityRefs: ownedByRelations,
|
|
1451
1526
|
defaultKind: "group"
|
|
1452
1527
|
})
|
|
1453
|
-
}), lifecycle ? /* @__PURE__ */
|
|
1528
|
+
}), lifecycle ? /* @__PURE__ */ React.createElement(HeaderLabel, {
|
|
1454
1529
|
label: "Lifecycle",
|
|
1455
1530
|
value: lifecycle
|
|
1456
|
-
}) : null, locationMetadata && locationMetadata.type !== "dir" && locationMetadata.type !== "file" ? /* @__PURE__ */
|
|
1531
|
+
}) : null, locationMetadata && locationMetadata.type !== "dir" && locationMetadata.type !== "file" ? /* @__PURE__ */ React.createElement(HeaderLabel, {
|
|
1457
1532
|
label: "",
|
|
1458
|
-
value: /* @__PURE__ */
|
|
1533
|
+
value: /* @__PURE__ */ React.createElement("a", {
|
|
1459
1534
|
href: locationMetadata.target,
|
|
1460
1535
|
target: "_blank",
|
|
1461
1536
|
rel: "noopener noreferrer"
|
|
1462
|
-
}, /* @__PURE__ */
|
|
1537
|
+
}, /* @__PURE__ */ React.createElement(CodeIcon, {
|
|
1463
1538
|
style: {marginTop: "-25px", fill: "#fff"}
|
|
1464
1539
|
}))
|
|
1465
1540
|
}) : null);
|
|
1466
|
-
return /* @__PURE__ */
|
|
1541
|
+
return /* @__PURE__ */ React.createElement(Header, {
|
|
1467
1542
|
title: siteName ? siteName : ".",
|
|
1468
1543
|
pageTitleOverride: siteName || name,
|
|
1469
1544
|
subtitle: siteDescription && siteDescription !== "None" ? siteDescription : "",
|
|
@@ -1489,13 +1564,13 @@ const LegacyTechDocsPage = () => {
|
|
|
1489
1564
|
setDocumentReady(true);
|
|
1490
1565
|
}, [setDocumentReady]);
|
|
1491
1566
|
if (entityMetadataError) {
|
|
1492
|
-
return /* @__PURE__ */
|
|
1567
|
+
return /* @__PURE__ */ React.createElement(TechDocsNotFound, {
|
|
1493
1568
|
errorMessage: entityMetadataError.message
|
|
1494
1569
|
});
|
|
1495
1570
|
}
|
|
1496
|
-
return /* @__PURE__ */
|
|
1571
|
+
return /* @__PURE__ */ React.createElement(Page, {
|
|
1497
1572
|
themeId: "documentation"
|
|
1498
|
-
}, /* @__PURE__ */
|
|
1573
|
+
}, /* @__PURE__ */ React.createElement(TechDocsPageHeader, {
|
|
1499
1574
|
techDocsMetadata: techdocsMetadataValue,
|
|
1500
1575
|
entityMetadata: entityMetadataValue,
|
|
1501
1576
|
entityRef: {
|
|
@@ -1503,9 +1578,9 @@ const LegacyTechDocsPage = () => {
|
|
|
1503
1578
|
namespace,
|
|
1504
1579
|
name
|
|
1505
1580
|
}
|
|
1506
|
-
}), /* @__PURE__ */
|
|
1581
|
+
}), /* @__PURE__ */ React.createElement(Content, {
|
|
1507
1582
|
"data-testid": "techdocs-content"
|
|
1508
|
-
}, /* @__PURE__ */
|
|
1583
|
+
}, /* @__PURE__ */ React.createElement(Reader, {
|
|
1509
1584
|
onReady,
|
|
1510
1585
|
entityRef: {
|
|
1511
1586
|
kind,
|
|
@@ -1533,13 +1608,13 @@ const TechDocsPage = ({children}) => {
|
|
|
1533
1608
|
setDocumentReady(true);
|
|
1534
1609
|
}, [setDocumentReady]);
|
|
1535
1610
|
if (entityMetadataError) {
|
|
1536
|
-
return /* @__PURE__ */
|
|
1611
|
+
return /* @__PURE__ */ React.createElement(TechDocsNotFound, {
|
|
1537
1612
|
errorMessage: entityMetadataError.message
|
|
1538
1613
|
});
|
|
1539
1614
|
}
|
|
1540
1615
|
if (!children)
|
|
1541
|
-
return outlet || /* @__PURE__ */
|
|
1542
|
-
return /* @__PURE__ */
|
|
1616
|
+
return outlet || /* @__PURE__ */ React.createElement(LegacyTechDocsPage, null);
|
|
1617
|
+
return /* @__PURE__ */ React.createElement(Page, {
|
|
1543
1618
|
themeId: "documentation"
|
|
1544
1619
|
}, children instanceof Function ? children({
|
|
1545
1620
|
techdocsMetadataValue,
|
|
@@ -1554,41 +1629,9 @@ var TechDocsPage$1 = /*#__PURE__*/Object.freeze({
|
|
|
1554
1629
|
TechDocsPage: TechDocsPage
|
|
1555
1630
|
});
|
|
1556
1631
|
|
|
1557
|
-
const DocsCardGrid = ({
|
|
1558
|
-
entities
|
|
1559
|
-
}) => {
|
|
1560
|
-
const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
|
|
1561
|
-
const toLowerMaybe = useApi(configApiRef).getOptionalBoolean("techdocs.legacyUseCaseSensitiveTripletPaths") ? (str) => str : (str) => str.toLocaleLowerCase();
|
|
1562
|
-
if (!entities)
|
|
1563
|
-
return null;
|
|
1564
|
-
return /* @__PURE__ */ React__default.createElement(ItemCardGrid, {
|
|
1565
|
-
"data-testid": "docs-explore"
|
|
1566
|
-
}, !(entities == null ? void 0 : entities.length) ? null : entities.map((entity, index) => {
|
|
1567
|
-
var _a;
|
|
1568
|
-
return /* @__PURE__ */ React__default.createElement(Card, {
|
|
1569
|
-
key: index
|
|
1570
|
-
}, /* @__PURE__ */ React__default.createElement(CardMedia, null, /* @__PURE__ */ React__default.createElement(ItemCardHeader, {
|
|
1571
|
-
title: entity.metadata.name
|
|
1572
|
-
})), /* @__PURE__ */ React__default.createElement(CardContent, null, entity.metadata.description), /* @__PURE__ */ React__default.createElement(CardActions, null, /* @__PURE__ */ React__default.createElement(Button, {
|
|
1573
|
-
to: getRouteToReaderPageFor({
|
|
1574
|
-
namespace: toLowerMaybe((_a = entity.metadata.namespace) != null ? _a : "default"),
|
|
1575
|
-
kind: toLowerMaybe(entity.kind),
|
|
1576
|
-
name: toLowerMaybe(entity.metadata.name)
|
|
1577
|
-
}),
|
|
1578
|
-
color: "primary",
|
|
1579
|
-
"data-testid": "read_docs"
|
|
1580
|
-
}, "Read Docs")));
|
|
1581
|
-
}));
|
|
1582
|
-
};
|
|
1583
|
-
|
|
1584
|
-
var DocsCardGrid$1 = /*#__PURE__*/Object.freeze({
|
|
1585
|
-
__proto__: null,
|
|
1586
|
-
DocsCardGrid: DocsCardGrid
|
|
1587
|
-
});
|
|
1588
|
-
|
|
1589
1632
|
const panels = {
|
|
1590
1633
|
DocsTable: DocsTable$1,
|
|
1591
|
-
DocsCardGrid
|
|
1634
|
+
DocsCardGrid: DocsCardGrid$1
|
|
1592
1635
|
};
|
|
1593
1636
|
const CustomPanel = ({
|
|
1594
1637
|
config,
|
|
@@ -1613,12 +1656,12 @@ const CustomPanel = ({
|
|
|
1613
1656
|
}
|
|
1614
1657
|
return typeof config.filterPredicate === "function" && config.filterPredicate(entity);
|
|
1615
1658
|
});
|
|
1616
|
-
return /* @__PURE__ */
|
|
1659
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ContentHeader, {
|
|
1617
1660
|
title: config.title,
|
|
1618
1661
|
description: config.description
|
|
1619
|
-
}, index === 0 ? /* @__PURE__ */
|
|
1662
|
+
}, index === 0 ? /* @__PURE__ */ React.createElement(SupportButton, null, "Discover documentation in your ecosystem.") : null), /* @__PURE__ */ React.createElement("div", {
|
|
1620
1663
|
className: classes.panelContainer
|
|
1621
|
-
}, /* @__PURE__ */
|
|
1664
|
+
}, /* @__PURE__ */ React.createElement(Panel, {
|
|
1622
1665
|
"data-testid": "techdocs-custom-panel",
|
|
1623
1666
|
entities: shownEntities
|
|
1624
1667
|
})));
|
|
@@ -1653,27 +1696,27 @@ const TechDocsCustomHome = ({
|
|
|
1653
1696
|
});
|
|
1654
1697
|
const currentTabConfig = tabsConfig[selectedTab];
|
|
1655
1698
|
if (loading) {
|
|
1656
|
-
return /* @__PURE__ */
|
|
1699
|
+
return /* @__PURE__ */ React.createElement(TechDocsPageWrapper, null, /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(Progress, null)));
|
|
1657
1700
|
}
|
|
1658
1701
|
if (error) {
|
|
1659
|
-
return /* @__PURE__ */
|
|
1702
|
+
return /* @__PURE__ */ React.createElement(TechDocsPageWrapper, null, /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(WarningPanel, {
|
|
1660
1703
|
severity: "error",
|
|
1661
1704
|
title: "Could not load available documentation."
|
|
1662
|
-
}, /* @__PURE__ */
|
|
1705
|
+
}, /* @__PURE__ */ React.createElement(CodeSnippet, {
|
|
1663
1706
|
language: "text",
|
|
1664
1707
|
text: error.toString()
|
|
1665
1708
|
}))));
|
|
1666
1709
|
}
|
|
1667
|
-
return /* @__PURE__ */
|
|
1710
|
+
return /* @__PURE__ */ React.createElement(TechDocsPageWrapper, null, /* @__PURE__ */ React.createElement(HeaderTabs, {
|
|
1668
1711
|
selectedIndex: selectedTab,
|
|
1669
1712
|
onChange: (index) => setSelectedTab(index),
|
|
1670
1713
|
tabs: tabsConfig.map(({label}, index) => ({
|
|
1671
1714
|
id: index.toString(),
|
|
1672
1715
|
label
|
|
1673
1716
|
}))
|
|
1674
|
-
}), /* @__PURE__ */
|
|
1717
|
+
}), /* @__PURE__ */ React.createElement(Content, {
|
|
1675
1718
|
"data-testid": "techdocs-content"
|
|
1676
|
-
}, currentTabConfig.panels.map((config, index) => /* @__PURE__ */
|
|
1719
|
+
}, currentTabConfig.panels.map((config, index) => /* @__PURE__ */ React.createElement(CustomPanel, {
|
|
1677
1720
|
key: index,
|
|
1678
1721
|
config,
|
|
1679
1722
|
entities: !!entities ? entities : [],
|
|
@@ -1711,14 +1754,14 @@ const LegacyTechDocsHome = () => {
|
|
|
1711
1754
|
]
|
|
1712
1755
|
}
|
|
1713
1756
|
];
|
|
1714
|
-
return /* @__PURE__ */
|
|
1757
|
+
return /* @__PURE__ */ React.createElement(TechDocsCustomHome, {
|
|
1715
1758
|
tabsConfig
|
|
1716
1759
|
});
|
|
1717
1760
|
};
|
|
1718
1761
|
|
|
1719
1762
|
const TechDocsIndexPage = () => {
|
|
1720
1763
|
const outlet = useOutlet();
|
|
1721
|
-
return outlet || /* @__PURE__ */
|
|
1764
|
+
return outlet || /* @__PURE__ */ React.createElement(LegacyTechDocsHome, null);
|
|
1722
1765
|
};
|
|
1723
1766
|
|
|
1724
1767
|
var TechDocsIndexPage$1 = /*#__PURE__*/Object.freeze({
|
|
@@ -1728,7 +1771,7 @@ var TechDocsIndexPage$1 = /*#__PURE__*/Object.freeze({
|
|
|
1728
1771
|
|
|
1729
1772
|
const EntityPageDocs = ({entity}) => {
|
|
1730
1773
|
var _a;
|
|
1731
|
-
return /* @__PURE__ */
|
|
1774
|
+
return /* @__PURE__ */ React.createElement(Reader, {
|
|
1732
1775
|
withSearch: false,
|
|
1733
1776
|
entityRef: {
|
|
1734
1777
|
kind: entity.kind,
|
|
@@ -1744,12 +1787,12 @@ const isTechDocsAvailable = (entity) => {
|
|
|
1744
1787
|
return Boolean((_b = (_a = entity == null ? void 0 : entity.metadata) == null ? void 0 : _a.annotations) == null ? void 0 : _b[TECHDOCS_ANNOTATION]);
|
|
1745
1788
|
};
|
|
1746
1789
|
const Router = () => {
|
|
1747
|
-
return /* @__PURE__ */
|
|
1790
|
+
return /* @__PURE__ */ React.createElement(Routes, null, /* @__PURE__ */ React.createElement(Route, {
|
|
1748
1791
|
path: "/",
|
|
1749
|
-
element: /* @__PURE__ */
|
|
1750
|
-
}), /* @__PURE__ */
|
|
1792
|
+
element: /* @__PURE__ */ React.createElement(TechDocsIndexPage, null)
|
|
1793
|
+
}), /* @__PURE__ */ React.createElement(Route, {
|
|
1751
1794
|
path: "/:namespace/:kind/:name/*",
|
|
1752
|
-
element: /* @__PURE__ */
|
|
1795
|
+
element: /* @__PURE__ */ React.createElement(TechDocsPage, null)
|
|
1753
1796
|
}));
|
|
1754
1797
|
};
|
|
1755
1798
|
const EmbeddedDocsRouter = (_props) => {
|
|
@@ -1757,13 +1800,13 @@ const EmbeddedDocsRouter = (_props) => {
|
|
|
1757
1800
|
const {entity} = useEntity();
|
|
1758
1801
|
const projectId = (_a = entity.metadata.annotations) == null ? void 0 : _a[TECHDOCS_ANNOTATION];
|
|
1759
1802
|
if (!projectId) {
|
|
1760
|
-
return /* @__PURE__ */
|
|
1803
|
+
return /* @__PURE__ */ React.createElement(MissingAnnotationEmptyState, {
|
|
1761
1804
|
annotation: TECHDOCS_ANNOTATION
|
|
1762
1805
|
});
|
|
1763
1806
|
}
|
|
1764
|
-
return /* @__PURE__ */
|
|
1807
|
+
return /* @__PURE__ */ React.createElement(Routes, null, /* @__PURE__ */ React.createElement(Route, {
|
|
1765
1808
|
path: "/*",
|
|
1766
|
-
element: /* @__PURE__ */
|
|
1809
|
+
element: /* @__PURE__ */ React.createElement(EntityPageDocs, {
|
|
1767
1810
|
entity
|
|
1768
1811
|
})
|
|
1769
1812
|
}));
|
|
@@ -1776,5 +1819,5 @@ var Router$1 = /*#__PURE__*/Object.freeze({
|
|
|
1776
1819
|
EmbeddedDocsRouter: EmbeddedDocsRouter
|
|
1777
1820
|
});
|
|
1778
1821
|
|
|
1779
|
-
export { DefaultTechDocsHome, DocsCardGrid
|
|
1822
|
+
export { DefaultTechDocsHome, DocsCardGrid, DocsResultListItem, DocsTable, EmbeddedDocsRouter, EntityListDocsGrid, EntityListDocsTable, EntityTechdocsContent, Reader, Router, TechDocsClient, TechDocsCustomHome$2 as TechDocsCustomHome, TechDocsIndexPage$2 as TechDocsIndexPage, TechDocsPage, TechDocsPageHeader, TechDocsPageWrapper, TechDocsPicker, TechDocsReaderPage, TechDocsSearch, TechDocsStateIndicator, TechDocsStorageClient, TechdocsPage, isTechDocsAvailable, techdocsPlugin as plugin, techdocsApiRef, techdocsPlugin, techdocsStorageApiRef, useTechDocsReader, useTechDocsReaderDom, withTechDocsReaderProvider };
|
|
1780
1823
|
//# sourceMappingURL=index.esm.js.map
|