@backstage/plugin-techdocs 1.10.5-next.2 → 1.10.6-next.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 +44 -0
- package/alpha/package.json +1 -1
- package/dist/EntityPageDocs.esm.js +2 -3
- package/dist/EntityPageDocs.esm.js.map +1 -1
- package/dist/Router.esm.js +2 -6
- package/dist/Router.esm.js.map +1 -1
- package/dist/client.esm.js +8 -15
- package/dist/client.esm.js.map +1 -1
- package/dist/home/components/DefaultTechDocsHome.esm.js +2 -2
- package/dist/home/components/DefaultTechDocsHome.esm.js.map +1 -1
- package/dist/home/components/Grids/DocsCardGrid.esm.js +21 -24
- package/dist/home/components/Grids/DocsCardGrid.esm.js.map +1 -1
- package/dist/home/components/Grids/EntityListDocsGrid.esm.js +3 -6
- package/dist/home/components/Grids/EntityListDocsGrid.esm.js.map +1 -1
- package/dist/home/components/Tables/DocsTable.esm.js +1 -2
- package/dist/home/components/Tables/DocsTable.esm.js.map +1 -1
- package/dist/home/components/Tables/EntityListDocsTable.esm.js +1 -2
- package/dist/home/components/Tables/EntityListDocsTable.esm.js.map +1 -1
- package/dist/home/components/TechDocsCustomHome.esm.js +1 -2
- package/dist/home/components/TechDocsCustomHome.esm.js.map +1 -1
- package/dist/home/components/TechDocsIndexPage.esm.js.map +1 -1
- package/dist/home/components/TechDocsPageWrapper.esm.js +1 -2
- package/dist/home/components/TechDocsPageWrapper.esm.js.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/reader/components/TechDocsReaderPage/TechDocsReaderPage.esm.js +1 -4
- package/dist/reader/components/TechDocsReaderPage/TechDocsReaderPage.esm.js.map +1 -1
- package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.esm.js +2 -4
- package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.esm.js.map +1 -1
- package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.esm.js +7 -7
- package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.esm.js.map +1 -1
- package/dist/reader/components/TechDocsReaderPageContent/dom.esm.js +9 -12
- package/dist/reader/components/TechDocsReaderPageContent/dom.esm.js.map +1 -1
- package/dist/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.esm.js +3 -3
- package/dist/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.esm.js.map +1 -1
- package/dist/reader/components/useReaderState.esm.js +2 -3
- package/dist/reader/components/useReaderState.esm.js.map +1 -1
- package/dist/reader/transformers/addGitFeedbackLink.esm.js +5 -6
- package/dist/reader/transformers/addGitFeedbackLink.esm.js.map +1 -1
- package/dist/reader/transformers/addSidebarToggle.esm.js +1 -1
- package/dist/reader/transformers/addSidebarToggle.esm.js.map +1 -1
- package/dist/reader/transformers/copyToClipboard.esm.js +2 -3
- package/dist/reader/transformers/copyToClipboard.esm.js.map +1 -1
- package/dist/reader/transformers/html/hooks/links.esm.js +1 -1
- package/dist/reader/transformers/html/hooks/links.esm.js.map +1 -1
- package/dist/reader/transformers/html/transformer.esm.js +1 -1
- package/dist/reader/transformers/html/transformer.esm.js.map +1 -1
- package/dist/reader/transformers/removeMkdocsHeader.esm.js +1 -2
- package/dist/reader/transformers/removeMkdocsHeader.esm.js.map +1 -1
- package/dist/reader/transformers/scrollIntoNavigation.esm.js +4 -4
- package/dist/reader/transformers/scrollIntoNavigation.esm.js.map +1 -1
- package/dist/reader/transformers/simplifyMkdocsFooter.esm.js +2 -3
- package/dist/reader/transformers/simplifyMkdocsFooter.esm.js.map +1 -1
- package/dist/reader/transformers/styles/rules/typeset.esm.js +1 -2
- package/dist/reader/transformers/styles/rules/typeset.esm.js.map +1 -1
- package/dist/reader/transformers/styles/rules/variables.esm.js +11 -0
- package/dist/reader/transformers/styles/rules/variables.esm.js.map +1 -1
- package/dist/search/components/TechDocsSearch.esm.js +4 -3
- package/dist/search/components/TechDocsSearch.esm.js.map +1 -1
- package/dist/search/components/TechDocsSearchResultListItem.esm.js +5 -5
- package/dist/search/components/TechDocsSearchResultListItem.esm.js.map +1 -1
- package/package.json +17 -17
|
@@ -3,10 +3,9 @@ import { PageWithHeader } from '@backstage/core-components';
|
|
|
3
3
|
import { useApi, configApiRef } from '@backstage/core-plugin-api';
|
|
4
4
|
|
|
5
5
|
const TechDocsPageWrapper = (props) => {
|
|
6
|
-
var _a;
|
|
7
6
|
const { children } = props;
|
|
8
7
|
const configApi = useApi(configApiRef);
|
|
9
|
-
const generatedSubtitle = `Documentation available in ${
|
|
8
|
+
const generatedSubtitle = `Documentation available in ${configApi.getOptionalString("organization.name") ?? "Backstage"}`;
|
|
10
9
|
return /* @__PURE__ */ React.createElement(
|
|
11
10
|
PageWithHeader,
|
|
12
11
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TechDocsPageWrapper.esm.js","sources":["../../../src/home/components/TechDocsPageWrapper.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport { PageWithHeader } from '@backstage/core-components';\nimport { useApi, configApiRef } from '@backstage/core-plugin-api';\n\n/**\n * Props for {@link TechDocsPageWrapper}\n *\n * @public\n */\nexport type TechDocsPageWrapperProps = {\n children?: React.ReactNode;\n};\n\n/**\n * Component wrapping a TechDocs page with Page and Header components\n *\n * @public\n */\nexport const TechDocsPageWrapper = (props: TechDocsPageWrapperProps) => {\n const { children } = props;\n const configApi = useApi(configApiRef);\n const generatedSubtitle = `Documentation available in ${\n configApi.getOptionalString('organization.name') ?? 'Backstage'\n }`;\n\n return (\n <PageWithHeader\n title=\"Documentation\"\n subtitle={generatedSubtitle}\n themeId=\"documentation\"\n >\n {children}\n </PageWithHeader>\n );\n};\n"],"names":[],"mappings":";;;;AAmCa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;
|
|
1
|
+
{"version":3,"file":"TechDocsPageWrapper.esm.js","sources":["../../../src/home/components/TechDocsPageWrapper.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport { PageWithHeader } from '@backstage/core-components';\nimport { useApi, configApiRef } from '@backstage/core-plugin-api';\n\n/**\n * Props for {@link TechDocsPageWrapper}\n *\n * @public\n */\nexport type TechDocsPageWrapperProps = {\n children?: React.ReactNode;\n};\n\n/**\n * Component wrapping a TechDocs page with Page and Header components\n *\n * @public\n */\nexport const TechDocsPageWrapper = (props: TechDocsPageWrapperProps) => {\n const { children } = props;\n const configApi = useApi(configApiRef);\n const generatedSubtitle = `Documentation available in ${\n configApi.getOptionalString('organization.name') ?? 'Backstage'\n }`;\n\n return (\n <PageWithHeader\n title=\"Documentation\"\n subtitle={generatedSubtitle}\n themeId=\"documentation\"\n >\n {children}\n </PageWithHeader>\n );\n};\n"],"names":[],"mappings":";;;;AAmCa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AACrB,EAAM,MAAA,SAAA,GAAY,OAAO,YAAY,CAAA,CAAA;AACrC,EAAA,MAAM,oBAAoB,CACxB,2BAAA,EAAA,SAAA,CAAU,iBAAkB,CAAA,mBAAmB,KAAK,WACtD,CAAA,CAAA,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,eAAA;AAAA,MACN,QAAU,EAAA,iBAAA;AAAA,MACV,OAAQ,EAAA,eAAA;AAAA,KAAA;AAAA,IAEP,QAAA;AAAA,GACH,CAAA;AAEJ;;;;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ import * as React from 'react';
|
|
|
8
8
|
import React__default, { ReactNode, PropsWithChildren } from 'react';
|
|
9
9
|
import { ToolbarProps } from '@material-ui/core/Toolbar';
|
|
10
10
|
import { TableColumn, TableProps, TableOptions } from '@backstage/core-components';
|
|
11
|
-
import { UserListFilterKind } from '@backstage/plugin-catalog-react';
|
|
11
|
+
import { UserListFilterKind, EntityOwnerPickerProps } from '@backstage/plugin-catalog-react';
|
|
12
12
|
import { CSSProperties } from '@material-ui/styles/withStyles';
|
|
13
13
|
import { SearchResultListItemExtensionProps } from '@backstage/plugin-search-react';
|
|
14
14
|
import { ResultHighlight } from '@backstage/plugin-search-common';
|
|
@@ -449,6 +449,7 @@ type TechDocsIndexPageProps = {
|
|
|
449
449
|
initialFilter?: UserListFilterKind;
|
|
450
450
|
columns?: TableColumn<DocsTableRow>[];
|
|
451
451
|
actions?: TableProps<DocsTableRow>['actions'];
|
|
452
|
+
ownerPickerMode?: EntityOwnerPickerProps['mode'];
|
|
452
453
|
};
|
|
453
454
|
|
|
454
455
|
/**
|
|
@@ -20,10 +20,7 @@ const TechDocsReaderPage = (props) => {
|
|
|
20
20
|
if (!children) {
|
|
21
21
|
const childrenList = outlet ? Children.toArray(outlet.props.children) : [];
|
|
22
22
|
const grandChildren = childrenList.flatMap(
|
|
23
|
-
(child) =>
|
|
24
|
-
var _a, _b;
|
|
25
|
-
return (_b = (_a = child == null ? void 0 : child.props) == null ? void 0 : _a.children) != null ? _b : [];
|
|
26
|
-
}
|
|
23
|
+
(child) => child?.props?.children ?? []
|
|
27
24
|
);
|
|
28
25
|
const page = grandChildren.find(
|
|
29
26
|
(grandChild) => !getComponentData(grandChild, TECHDOCS_ADDONS_WRAPPER_KEY) && !getComponentData(grandChild, TECHDOCS_ADDONS_KEY)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TechDocsReaderPage.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPage/TechDocsReaderPage.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { ReactNode, Children, ReactElement } from 'react';\nimport { useOutlet } from 'react-router-dom';\n\nimport { Page } from '@backstage/core-components';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport {\n TECHDOCS_ADDONS_WRAPPER_KEY,\n TECHDOCS_ADDONS_KEY,\n TechDocsReaderPageProvider,\n} from '@backstage/plugin-techdocs-react';\n\nimport { TechDocsReaderPageRenderFunction } from '../../../types';\n\nimport { TechDocsReaderPageContent } from '../TechDocsReaderPageContent';\nimport { TechDocsReaderPageHeader } from '../TechDocsReaderPageHeader';\nimport { TechDocsReaderPageSubheader } from '../TechDocsReaderPageSubheader';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n getComponentData,\n useRouteRefParams,\n} from '@backstage/core-plugin-api';\n\nimport { CookieAuthRefreshProvider } from '@backstage/plugin-auth-react';\n\n/* An explanation for the multiple ways of customizing the TechDocs reader page\n\nPlease refer to this page on the microsite for the latest recommended approach:\nhttps://backstage.io/docs/features/techdocs/how-to-guides#how-to-customize-the-techdocs-reader-page\n\nThe <TechDocsReaderPage> component is responsible for rendering the <TechDocsReaderPageProvider> and\nits contained version of a <Page>, which in turn renders the <TechDocsReaderPageContent>.\n\nHistorically, there have been different approaches on how this <Page> can be customized, and how the\n<TechDocsReaderPageContent> inside could be exchanged for a custom implementation (which was not\npossible before). Also, the current implementation supports every scenario to avoid breaking default\nconfigurations of TechDocs.\n\nIn particular, there are 4 different TechDocs page configurations:\n\nCONFIGURATION 1: <TechDocsReaderPage> only, no children\n\n<Route path=\"/docs/:namespace/:kind/:name/*\" element={<TechDocsReaderPage />} >\n\nThis is the simplest way to use TechDocs. Only a full page is passed, assuming that it comes with\nits content inside. Since we allowed customizing it, we started providing <TechDocsReaderLayout> as\na default implementation (which contains <TechDocsReaderPageContent>).\n\nCONFIGURATION 2 (not advised): <TechDocsReaderPage> with element children\n\n<Route\n path=\"/docs/:namespace/:kind/:name/*\"\n element={\n <TechDocsReaderPage>\n {techdocsPage}\n </TechDocsReaderPage>\n }\n/>\n\nPreviously, there were two ways of passing children to <TechDocsReaderPage>: either as elements (as\nshown above), or as a render function (described below in CONFIGURATION 3). The \"techdocsPage\" is\nlocated in packages/app/src/components/techdocs and is the default implementation of the content\ninside.\n\nCONFIGURATION 3 (not advised): <TechDocsReaderPage> with render function as child\n\n<Route\n path=\"/docs/:namespace/:kind/:name/*\"\n element={\n <TechDocsReaderPage>\n {({ metadata, entityMetadata, onReady }) => (\n techdocsPage\n )}\n </TechDocsReaderPage>\n }\n/>\n\nSimilar to CONFIGURATION 2, the direct children will be passed to the <TechDocsReaderPage> but in\nthis case interpreted as render prop.\n\nCONFIGURATION 4: <TechDocsReaderPage> and provided content in <Route>\n\n<Route\n path=\"/docs/:namespace/:kind/:name/*\"\n element={<TechDocsReaderPage />}\n>\n {techDocsPage}\n <TechDocsAddons>\n <ExpandableNavigation />\n <ReportIssue />\n <TextSize />\n <LightBox />\n </TechDocsAddons>\n</Route>\n\nThis is the current state in packages/app/src/App.tsx and moved the location of children from inside\nthe element prop in the <Route> to the children of the <Route>. Then, in <TechDocsReaderPage> they\nare retrieved using the useOutlet hook from React Router.\n\nNOTE: Render functions are no longer supported in this approach.\n*/\n\n/**\n * Props for {@link TechDocsReaderLayout}\n * @public\n */\nexport type TechDocsReaderLayoutProps = {\n /**\n * Show or hide the header, defaults to true.\n */\n withHeader?: boolean;\n /**\n * Show or hide the content search bar, defaults to true.\n */\n withSearch?: boolean;\n};\n\n/**\n * Default TechDocs reader page structure composed with a header and content\n * @public\n */\nexport const TechDocsReaderLayout = (props: TechDocsReaderLayoutProps) => {\n const { withSearch, withHeader = true } = props;\n return (\n <Page themeId=\"documentation\">\n {withHeader && <TechDocsReaderPageHeader />}\n <TechDocsReaderPageSubheader />\n <TechDocsReaderPageContent withSearch={withSearch} />\n </Page>\n );\n};\n\n/**\n * @public\n */\nexport type TechDocsReaderPageProps = {\n entityRef?: CompoundEntityRef;\n children?: TechDocsReaderPageRenderFunction | ReactNode;\n};\n\n/**\n * An addon-aware implementation of the TechDocsReaderPage.\n *\n * @public\n */\nexport const TechDocsReaderPage = (props: TechDocsReaderPageProps) => {\n const { kind, name, namespace } = useRouteRefParams(rootDocsRouteRef);\n const { children, entityRef = { kind, name, namespace } } = props;\n\n const outlet = useOutlet();\n\n if (!children) {\n const childrenList = outlet ? Children.toArray(outlet.props.children) : [];\n\n const grandChildren = childrenList.flatMap<ReactElement>(\n child => (child as ReactElement)?.props?.children ?? [],\n );\n\n const page: React.ReactNode = grandChildren.find(\n grandChild =>\n !getComponentData(grandChild, TECHDOCS_ADDONS_WRAPPER_KEY) &&\n !getComponentData(grandChild, TECHDOCS_ADDONS_KEY),\n );\n\n // As explained above, \"page\" is configuration 4 and <TechDocsReaderLayout> is 1\n return (\n <CookieAuthRefreshProvider pluginId=\"techdocs\">\n <TechDocsReaderPageProvider entityRef={entityRef}>\n {(page as JSX.Element) || <TechDocsReaderLayout />}\n </TechDocsReaderPageProvider>\n </CookieAuthRefreshProvider>\n );\n }\n\n // As explained above, a render function is configuration 3 and React element is 2\n return (\n <CookieAuthRefreshProvider pluginId=\"techdocs\">\n <TechDocsReaderPageProvider entityRef={entityRef}>\n {({ metadata, entityMetadata, onReady }) => (\n <div className=\"techdocs-reader-page\">\n <Page themeId=\"documentation\">\n {children instanceof Function\n ? children({\n entityRef,\n techdocsMetadataValue: metadata.value,\n entityMetadataValue: entityMetadata.value,\n onReady,\n })\n : children}\n </Page>\n </div>\n )}\n </TechDocsReaderPageProvider>\n </CookieAuthRefreshProvider>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAwIa,MAAA,oBAAA,GAAuB,CAAC,KAAqC,KAAA;AACxE,EAAA,MAAM,EAAE,UAAA,EAAY,UAAa,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1C,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,OAAQ,EAAA,eAAA,EAAA,EACX,8BAAe,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA,IAAyB,CACzC,kBAAA,KAAA,CAAA,aAAA,CAAC,2BAA4B,EAAA,IAAA,CAAA,kBAC5B,KAAA,CAAA,aAAA,CAAA,yBAAA,EAAA,EAA0B,YAAwB,CACrD,CAAA,CAAA;AAEJ,EAAA;AAea,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,EAAE,IAAM,EAAA,IAAA,EAAM,SAAU,EAAA,GAAI,kBAAkB,gBAAgB,CAAA,CAAA;AACpE,EAAM,MAAA,EAAE,UAAU,SAAY,GAAA,EAAE,MAAM,IAAM,EAAA,SAAA,IAAgB,GAAA,KAAA,CAAA;AAE5D,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAA,IAAI,CAAC,QAAU,EAAA;AACb,IAAM,MAAA,YAAA,GAAe,SAAS,QAAS,CAAA,OAAA,CAAQ,OAAO,KAAM,CAAA,QAAQ,IAAI,EAAC,CAAA;AAEzE,IAAA,MAAM,gBAAgB,YAAa,CAAA,OAAA;AAAA,MACjC,
|
|
1
|
+
{"version":3,"file":"TechDocsReaderPage.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPage/TechDocsReaderPage.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { ReactNode, Children, ReactElement } from 'react';\nimport { useOutlet } from 'react-router-dom';\n\nimport { Page } from '@backstage/core-components';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport {\n TECHDOCS_ADDONS_WRAPPER_KEY,\n TECHDOCS_ADDONS_KEY,\n TechDocsReaderPageProvider,\n} from '@backstage/plugin-techdocs-react';\n\nimport { TechDocsReaderPageRenderFunction } from '../../../types';\n\nimport { TechDocsReaderPageContent } from '../TechDocsReaderPageContent';\nimport { TechDocsReaderPageHeader } from '../TechDocsReaderPageHeader';\nimport { TechDocsReaderPageSubheader } from '../TechDocsReaderPageSubheader';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n getComponentData,\n useRouteRefParams,\n} from '@backstage/core-plugin-api';\n\nimport { CookieAuthRefreshProvider } from '@backstage/plugin-auth-react';\n\n/* An explanation for the multiple ways of customizing the TechDocs reader page\n\nPlease refer to this page on the microsite for the latest recommended approach:\nhttps://backstage.io/docs/features/techdocs/how-to-guides#how-to-customize-the-techdocs-reader-page\n\nThe <TechDocsReaderPage> component is responsible for rendering the <TechDocsReaderPageProvider> and\nits contained version of a <Page>, which in turn renders the <TechDocsReaderPageContent>.\n\nHistorically, there have been different approaches on how this <Page> can be customized, and how the\n<TechDocsReaderPageContent> inside could be exchanged for a custom implementation (which was not\npossible before). Also, the current implementation supports every scenario to avoid breaking default\nconfigurations of TechDocs.\n\nIn particular, there are 4 different TechDocs page configurations:\n\nCONFIGURATION 1: <TechDocsReaderPage> only, no children\n\n<Route path=\"/docs/:namespace/:kind/:name/*\" element={<TechDocsReaderPage />} >\n\nThis is the simplest way to use TechDocs. Only a full page is passed, assuming that it comes with\nits content inside. Since we allowed customizing it, we started providing <TechDocsReaderLayout> as\na default implementation (which contains <TechDocsReaderPageContent>).\n\nCONFIGURATION 2 (not advised): <TechDocsReaderPage> with element children\n\n<Route\n path=\"/docs/:namespace/:kind/:name/*\"\n element={\n <TechDocsReaderPage>\n {techdocsPage}\n </TechDocsReaderPage>\n }\n/>\n\nPreviously, there were two ways of passing children to <TechDocsReaderPage>: either as elements (as\nshown above), or as a render function (described below in CONFIGURATION 3). The \"techdocsPage\" is\nlocated in packages/app/src/components/techdocs and is the default implementation of the content\ninside.\n\nCONFIGURATION 3 (not advised): <TechDocsReaderPage> with render function as child\n\n<Route\n path=\"/docs/:namespace/:kind/:name/*\"\n element={\n <TechDocsReaderPage>\n {({ metadata, entityMetadata, onReady }) => (\n techdocsPage\n )}\n </TechDocsReaderPage>\n }\n/>\n\nSimilar to CONFIGURATION 2, the direct children will be passed to the <TechDocsReaderPage> but in\nthis case interpreted as render prop.\n\nCONFIGURATION 4: <TechDocsReaderPage> and provided content in <Route>\n\n<Route\n path=\"/docs/:namespace/:kind/:name/*\"\n element={<TechDocsReaderPage />}\n>\n {techDocsPage}\n <TechDocsAddons>\n <ExpandableNavigation />\n <ReportIssue />\n <TextSize />\n <LightBox />\n </TechDocsAddons>\n</Route>\n\nThis is the current state in packages/app/src/App.tsx and moved the location of children from inside\nthe element prop in the <Route> to the children of the <Route>. Then, in <TechDocsReaderPage> they\nare retrieved using the useOutlet hook from React Router.\n\nNOTE: Render functions are no longer supported in this approach.\n*/\n\n/**\n * Props for {@link TechDocsReaderLayout}\n * @public\n */\nexport type TechDocsReaderLayoutProps = {\n /**\n * Show or hide the header, defaults to true.\n */\n withHeader?: boolean;\n /**\n * Show or hide the content search bar, defaults to true.\n */\n withSearch?: boolean;\n};\n\n/**\n * Default TechDocs reader page structure composed with a header and content\n * @public\n */\nexport const TechDocsReaderLayout = (props: TechDocsReaderLayoutProps) => {\n const { withSearch, withHeader = true } = props;\n return (\n <Page themeId=\"documentation\">\n {withHeader && <TechDocsReaderPageHeader />}\n <TechDocsReaderPageSubheader />\n <TechDocsReaderPageContent withSearch={withSearch} />\n </Page>\n );\n};\n\n/**\n * @public\n */\nexport type TechDocsReaderPageProps = {\n entityRef?: CompoundEntityRef;\n children?: TechDocsReaderPageRenderFunction | ReactNode;\n};\n\n/**\n * An addon-aware implementation of the TechDocsReaderPage.\n *\n * @public\n */\nexport const TechDocsReaderPage = (props: TechDocsReaderPageProps) => {\n const { kind, name, namespace } = useRouteRefParams(rootDocsRouteRef);\n const { children, entityRef = { kind, name, namespace } } = props;\n\n const outlet = useOutlet();\n\n if (!children) {\n const childrenList = outlet ? Children.toArray(outlet.props.children) : [];\n\n const grandChildren = childrenList.flatMap<ReactElement>(\n child => (child as ReactElement)?.props?.children ?? [],\n );\n\n const page: React.ReactNode = grandChildren.find(\n grandChild =>\n !getComponentData(grandChild, TECHDOCS_ADDONS_WRAPPER_KEY) &&\n !getComponentData(grandChild, TECHDOCS_ADDONS_KEY),\n );\n\n // As explained above, \"page\" is configuration 4 and <TechDocsReaderLayout> is 1\n return (\n <CookieAuthRefreshProvider pluginId=\"techdocs\">\n <TechDocsReaderPageProvider entityRef={entityRef}>\n {(page as JSX.Element) || <TechDocsReaderLayout />}\n </TechDocsReaderPageProvider>\n </CookieAuthRefreshProvider>\n );\n }\n\n // As explained above, a render function is configuration 3 and React element is 2\n return (\n <CookieAuthRefreshProvider pluginId=\"techdocs\">\n <TechDocsReaderPageProvider entityRef={entityRef}>\n {({ metadata, entityMetadata, onReady }) => (\n <div className=\"techdocs-reader-page\">\n <Page themeId=\"documentation\">\n {children instanceof Function\n ? children({\n entityRef,\n techdocsMetadataValue: metadata.value,\n entityMetadataValue: entityMetadata.value,\n onReady,\n })\n : children}\n </Page>\n </div>\n )}\n </TechDocsReaderPageProvider>\n </CookieAuthRefreshProvider>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAwIa,MAAA,oBAAA,GAAuB,CAAC,KAAqC,KAAA;AACxE,EAAA,MAAM,EAAE,UAAA,EAAY,UAAa,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1C,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,OAAQ,EAAA,eAAA,EAAA,EACX,8BAAe,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA,IAAyB,CACzC,kBAAA,KAAA,CAAA,aAAA,CAAC,2BAA4B,EAAA,IAAA,CAAA,kBAC5B,KAAA,CAAA,aAAA,CAAA,yBAAA,EAAA,EAA0B,YAAwB,CACrD,CAAA,CAAA;AAEJ,EAAA;AAea,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,EAAE,IAAM,EAAA,IAAA,EAAM,SAAU,EAAA,GAAI,kBAAkB,gBAAgB,CAAA,CAAA;AACpE,EAAM,MAAA,EAAE,UAAU,SAAY,GAAA,EAAE,MAAM,IAAM,EAAA,SAAA,IAAgB,GAAA,KAAA,CAAA;AAE5D,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAA,IAAI,CAAC,QAAU,EAAA;AACb,IAAM,MAAA,YAAA,GAAe,SAAS,QAAS,CAAA,OAAA,CAAQ,OAAO,KAAM,CAAA,QAAQ,IAAI,EAAC,CAAA;AAEzE,IAAA,MAAM,gBAAgB,YAAa,CAAA,OAAA;AAAA,MACjC,CAAU,KAAA,KAAA,KAAA,EAAwB,KAAO,EAAA,QAAA,IAAY,EAAC;AAAA,KACxD,CAAA;AAEA,IAAA,MAAM,OAAwB,aAAc,CAAA,IAAA;AAAA,MAC1C,CAAA,UAAA,KACE,CAAC,gBAAiB,CAAA,UAAA,EAAY,2BAA2B,CACzD,IAAA,CAAC,gBAAiB,CAAA,UAAA,EAAY,mBAAmB,CAAA;AAAA,KACrD,CAAA;AAGA,IACE,uBAAA,KAAA,CAAA,aAAA,CAAC,yBAA0B,EAAA,EAAA,QAAA,EAAS,UAClC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,0BAA2B,EAAA,EAAA,SAAA,EAAA,EACxB,IAAwB,oBAAA,KAAA,CAAA,aAAA,CAAC,oBAAqB,EAAA,IAAA,CAClD,CACF,CAAA,CAAA;AAAA,GAEJ;AAGA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,6BAA0B,QAAS,EAAA,UAAA,EAAA,sCACjC,0BAA2B,EAAA,EAAA,SAAA,EAAA,EACzB,CAAC,EAAE,QAAU,EAAA,cAAA,EAAgB,SAC5B,qBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,sBACb,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,OAAQ,EAAA,eAAA,EAAA,EACX,QAAoB,YAAA,QAAA,GACjB,QAAS,CAAA;AAAA,IACP,SAAA;AAAA,IACA,uBAAuB,QAAS,CAAA,KAAA;AAAA,IAChC,qBAAqB,cAAe,CAAA,KAAA;AAAA,IACpC,OAAA;AAAA,GACD,CAAA,GACD,QACN,CACF,CAEJ,CACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -23,7 +23,6 @@ const useStyles = makeStyles({
|
|
|
23
23
|
});
|
|
24
24
|
const TechDocsReaderPageContent = withTechDocsReaderProvider(
|
|
25
25
|
(props) => {
|
|
26
|
-
var _a;
|
|
27
26
|
const { withSearch = true, onReady } = props;
|
|
28
27
|
const classes = useStyles();
|
|
29
28
|
const {
|
|
@@ -37,7 +36,6 @@ const TechDocsReaderPageContent = withTechDocsReaderProvider(
|
|
|
37
36
|
const isStyleLoading = useShadowDomStylesLoading(dom);
|
|
38
37
|
const [hashElement] = useShadowRootElements([`[id="${hash.slice(1)}"]`]);
|
|
39
38
|
useEffect(() => {
|
|
40
|
-
var _a2;
|
|
41
39
|
if (isStyleLoading)
|
|
42
40
|
return;
|
|
43
41
|
if (hash) {
|
|
@@ -45,7 +43,7 @@ const TechDocsReaderPageContent = withTechDocsReaderProvider(
|
|
|
45
43
|
hashElement.scrollIntoView();
|
|
46
44
|
}
|
|
47
45
|
} else {
|
|
48
|
-
|
|
46
|
+
document?.querySelector("header")?.scrollIntoView();
|
|
49
47
|
}
|
|
50
48
|
}, [path, hash, hashElement, isStyleLoading]);
|
|
51
49
|
const handleAppend = useCallback(
|
|
@@ -66,7 +64,7 @@ const TechDocsReaderPageContent = withTechDocsReaderProvider(
|
|
|
66
64
|
TechDocsSearch,
|
|
67
65
|
{
|
|
68
66
|
entityId: entityRef,
|
|
69
|
-
entityTitle:
|
|
67
|
+
entityTitle: entityMetadata?.metadata?.title
|
|
70
68
|
}
|
|
71
69
|
)), /* @__PURE__ */ React.createElement(Grid, { xs: 12, item: true }, /* @__PURE__ */ React.createElement(TechDocsShadowDom, { element: dom, onAppend: handleAppend }, /* @__PURE__ */ React.createElement(TechDocsReaderPageContentAddons, null)))));
|
|
72
70
|
}
|
package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TechDocsReaderPageContent.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useEffect } from 'react';\n\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles } from '@material-ui/core/styles';\n\nimport {\n TechDocsShadowDom,\n useShadowDomStylesLoading,\n useShadowRootElements,\n useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport { Content, ErrorPage } from '@backstage/core-components';\n\nimport { TechDocsSearch } from '../../../search';\nimport { TechDocsStateIndicator } from '../TechDocsStateIndicator';\n\nimport { useTechDocsReaderDom } from './dom';\nimport { withTechDocsReaderProvider } from '../TechDocsReaderProvider';\nimport { TechDocsReaderPageContentAddons } from './TechDocsReaderPageContentAddons';\n\nconst useStyles = makeStyles({\n search: {\n width: '100%',\n '@media (min-width: 76.1875em)': {\n width: 'calc(100% - 34.4rem)',\n margin: '0 auto',\n },\n '@media print': {\n display: 'none',\n },\n },\n});\n\n/**\n * Props for {@link TechDocsReaderPageContent}\n * @public\n */\nexport type TechDocsReaderPageContentProps = {\n /**\n * @deprecated No need to pass down entityRef as property anymore. Consumes the entityName from `TechDocsReaderPageContext`. Use the {@link @backstage/plugin-techdocs-react#useTechDocsReaderPage} hook for custom reader page content.\n */\n entityRef?: CompoundEntityRef;\n /**\n * Show or hide the search bar, defaults to true.\n */\n withSearch?: boolean;\n /**\n * Callback called when the content is rendered.\n */\n onReady?: () => void;\n};\n\n/**\n * Renders the reader page content\n * @public\n */\nexport const TechDocsReaderPageContent = withTechDocsReaderProvider(\n (props: TechDocsReaderPageContentProps) => {\n const { withSearch = true, onReady } = props;\n const classes = useStyles();\n\n const {\n entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },\n entityRef,\n setShadowRoot,\n } = useTechDocsReaderPage();\n const dom = useTechDocsReaderDom(entityRef);\n const path = window.location.pathname;\n const hash = window.location.hash;\n const isStyleLoading = useShadowDomStylesLoading(dom);\n const [hashElement] = useShadowRootElements([`[id=\"${hash.slice(1)}\"]`]);\n\n useEffect(() => {\n if (isStyleLoading) return;\n\n if (hash) {\n if (hashElement) {\n hashElement.scrollIntoView();\n }\n } else {\n document?.querySelector('header')?.scrollIntoView();\n }\n }, [path, hash, hashElement, isStyleLoading]);\n\n const handleAppend = useCallback(\n (newShadowRoot: ShadowRoot) => {\n setShadowRoot(newShadowRoot);\n if (onReady instanceof Function) {\n onReady();\n }\n },\n [setShadowRoot, onReady],\n );\n\n // No entity metadata = 404. Don't render content at all.\n if (entityMetadataLoading === false && !entityMetadata)\n return <ErrorPage status=\"404\" statusMessage=\"PAGE NOT FOUND\" />;\n\n // Do not return content until dom is ready; instead, render a state\n // indicator, which handles progress and content errors on our behalf.\n if (!dom) {\n return (\n <Content>\n <Grid container>\n <Grid xs={12} item>\n <TechDocsStateIndicator />\n </Grid>\n </Grid>\n </Content>\n );\n }\n\n return (\n <Content>\n <Grid container>\n <Grid xs={12} item>\n <TechDocsStateIndicator />\n </Grid>\n {withSearch && (\n <Grid className={classes.search} xs=\"auto\" item>\n <TechDocsSearch\n entityId={entityRef}\n entityTitle={entityMetadata?.metadata?.title}\n />\n </Grid>\n )}\n <Grid xs={12} item>\n {/* Centers the styles loaded event to avoid having multiple locations setting the opacity style in Shadow Dom causing the screen to flash multiple times */}\n <TechDocsShadowDom element={dom} onAppend={handleAppend}>\n <TechDocsReaderPageContentAddons />\n </TechDocsShadowDom>\n </Grid>\n </Grid>\n </Content>\n );\n },\n);\n\n/**\n * Props for {@link Reader}\n *\n * @public\n * @deprecated use `TechDocsReaderPageContentProps` instead.\n */\nexport type ReaderProps = TechDocsReaderPageContentProps;\n\n/**\n * Component responsible for rendering TechDocs documentation\n * @public\n * @deprecated use `TechDocsReaderPageContent` component instead.\n */\nexport const Reader = TechDocsReaderPageContent;\n"],"names":[
|
|
1
|
+
{"version":3,"file":"TechDocsReaderPageContent.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useEffect } from 'react';\n\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles } from '@material-ui/core/styles';\n\nimport {\n TechDocsShadowDom,\n useShadowDomStylesLoading,\n useShadowRootElements,\n useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport { Content, ErrorPage } from '@backstage/core-components';\n\nimport { TechDocsSearch } from '../../../search';\nimport { TechDocsStateIndicator } from '../TechDocsStateIndicator';\n\nimport { useTechDocsReaderDom } from './dom';\nimport { withTechDocsReaderProvider } from '../TechDocsReaderProvider';\nimport { TechDocsReaderPageContentAddons } from './TechDocsReaderPageContentAddons';\n\nconst useStyles = makeStyles({\n search: {\n width: '100%',\n '@media (min-width: 76.1875em)': {\n width: 'calc(100% - 34.4rem)',\n margin: '0 auto',\n },\n '@media print': {\n display: 'none',\n },\n },\n});\n\n/**\n * Props for {@link TechDocsReaderPageContent}\n * @public\n */\nexport type TechDocsReaderPageContentProps = {\n /**\n * @deprecated No need to pass down entityRef as property anymore. Consumes the entityName from `TechDocsReaderPageContext`. Use the {@link @backstage/plugin-techdocs-react#useTechDocsReaderPage} hook for custom reader page content.\n */\n entityRef?: CompoundEntityRef;\n /**\n * Show or hide the search bar, defaults to true.\n */\n withSearch?: boolean;\n /**\n * Callback called when the content is rendered.\n */\n onReady?: () => void;\n};\n\n/**\n * Renders the reader page content\n * @public\n */\nexport const TechDocsReaderPageContent = withTechDocsReaderProvider(\n (props: TechDocsReaderPageContentProps) => {\n const { withSearch = true, onReady } = props;\n const classes = useStyles();\n\n const {\n entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },\n entityRef,\n setShadowRoot,\n } = useTechDocsReaderPage();\n const dom = useTechDocsReaderDom(entityRef);\n const path = window.location.pathname;\n const hash = window.location.hash;\n const isStyleLoading = useShadowDomStylesLoading(dom);\n const [hashElement] = useShadowRootElements([`[id=\"${hash.slice(1)}\"]`]);\n\n useEffect(() => {\n if (isStyleLoading) return;\n\n if (hash) {\n if (hashElement) {\n hashElement.scrollIntoView();\n }\n } else {\n document?.querySelector('header')?.scrollIntoView();\n }\n }, [path, hash, hashElement, isStyleLoading]);\n\n const handleAppend = useCallback(\n (newShadowRoot: ShadowRoot) => {\n setShadowRoot(newShadowRoot);\n if (onReady instanceof Function) {\n onReady();\n }\n },\n [setShadowRoot, onReady],\n );\n\n // No entity metadata = 404. Don't render content at all.\n if (entityMetadataLoading === false && !entityMetadata)\n return <ErrorPage status=\"404\" statusMessage=\"PAGE NOT FOUND\" />;\n\n // Do not return content until dom is ready; instead, render a state\n // indicator, which handles progress and content errors on our behalf.\n if (!dom) {\n return (\n <Content>\n <Grid container>\n <Grid xs={12} item>\n <TechDocsStateIndicator />\n </Grid>\n </Grid>\n </Content>\n );\n }\n\n return (\n <Content>\n <Grid container>\n <Grid xs={12} item>\n <TechDocsStateIndicator />\n </Grid>\n {withSearch && (\n <Grid className={classes.search} xs=\"auto\" item>\n <TechDocsSearch\n entityId={entityRef}\n entityTitle={entityMetadata?.metadata?.title}\n />\n </Grid>\n )}\n <Grid xs={12} item>\n {/* Centers the styles loaded event to avoid having multiple locations setting the opacity style in Shadow Dom causing the screen to flash multiple times */}\n <TechDocsShadowDom element={dom} onAppend={handleAppend}>\n <TechDocsReaderPageContentAddons />\n </TechDocsShadowDom>\n </Grid>\n </Grid>\n </Content>\n );\n },\n);\n\n/**\n * Props for {@link Reader}\n *\n * @public\n * @deprecated use `TechDocsReaderPageContentProps` instead.\n */\nexport type ReaderProps = TechDocsReaderPageContentProps;\n\n/**\n * Component responsible for rendering TechDocs documentation\n * @public\n * @deprecated use `TechDocsReaderPageContent` component instead.\n */\nexport const Reader = TechDocsReaderPageContent;\n"],"names":[],"mappings":"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"}
|
package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.esm.js
CHANGED
|
@@ -5,13 +5,13 @@ import { useTechDocsAddons, useTechDocsReaderPage, TechDocsAddonLocations } from
|
|
|
5
5
|
const TechDocsReaderPageContentAddons = () => {
|
|
6
6
|
const addons = useTechDocsAddons();
|
|
7
7
|
const { shadowRoot } = useTechDocsReaderPage();
|
|
8
|
-
const contentElement = shadowRoot
|
|
8
|
+
const contentElement = shadowRoot?.querySelector(
|
|
9
9
|
'[data-md-component="content"]'
|
|
10
10
|
);
|
|
11
|
-
const primarySidebarElement = shadowRoot
|
|
11
|
+
const primarySidebarElement = shadowRoot?.querySelector(
|
|
12
12
|
'div[data-md-component="sidebar"][data-md-type="navigation"], div[data-md-component="navigation"]'
|
|
13
13
|
);
|
|
14
|
-
let primarySidebarAddonLocation = primarySidebarElement
|
|
14
|
+
let primarySidebarAddonLocation = primarySidebarElement?.querySelector(
|
|
15
15
|
'[data-techdocs-addons-location="primary sidebar"]'
|
|
16
16
|
);
|
|
17
17
|
if (!primarySidebarAddonLocation) {
|
|
@@ -20,12 +20,12 @@ const TechDocsReaderPageContentAddons = () => {
|
|
|
20
20
|
"data-techdocs-addons-location",
|
|
21
21
|
"primary sidebar"
|
|
22
22
|
);
|
|
23
|
-
primarySidebarElement
|
|
23
|
+
primarySidebarElement?.prepend(primarySidebarAddonLocation);
|
|
24
24
|
}
|
|
25
|
-
const secondarySidebarElement = shadowRoot
|
|
25
|
+
const secondarySidebarElement = shadowRoot?.querySelector(
|
|
26
26
|
'div[data-md-component="sidebar"][data-md-type="toc"], div[data-md-component="toc"]'
|
|
27
27
|
);
|
|
28
|
-
let secondarySidebarAddonLocation = secondarySidebarElement
|
|
28
|
+
let secondarySidebarAddonLocation = secondarySidebarElement?.querySelector(
|
|
29
29
|
'[data-techdocs-addons-location="secondary sidebar"]'
|
|
30
30
|
);
|
|
31
31
|
if (!secondarySidebarAddonLocation) {
|
|
@@ -34,7 +34,7 @@ const TechDocsReaderPageContentAddons = () => {
|
|
|
34
34
|
"data-techdocs-addons-location",
|
|
35
35
|
"secondary sidebar"
|
|
36
36
|
);
|
|
37
|
-
secondarySidebarElement
|
|
37
|
+
secondarySidebarElement?.prepend(secondarySidebarAddonLocation);
|
|
38
38
|
}
|
|
39
39
|
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Portal, { container: primarySidebarAddonLocation }, addons.renderComponentsByLocation(TechDocsAddonLocations.PrimarySidebar)), /* @__PURE__ */ React.createElement(Portal, { container: contentElement }, addons.renderComponentsByLocation(TechDocsAddonLocations.Content)), /* @__PURE__ */ React.createElement(Portal, { container: secondarySidebarAddonLocation }, addons.renderComponentsByLocation(TechDocsAddonLocations.SecondarySidebar)));
|
|
40
40
|
};
|
package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TechDocsReaderPageContentAddons.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Portal from '@material-ui/core/Portal';\nimport {\n useTechDocsAddons,\n TechDocsAddonLocations as locations,\n useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\n\nexport const TechDocsReaderPageContentAddons = () => {\n const addons = useTechDocsAddons();\n\n const { shadowRoot } = useTechDocsReaderPage();\n\n const contentElement = shadowRoot?.querySelector(\n '[data-md-component=\"content\"]',\n );\n\n const primarySidebarElement = shadowRoot?.querySelector(\n 'div[data-md-component=\"sidebar\"][data-md-type=\"navigation\"], div[data-md-component=\"navigation\"]',\n );\n let primarySidebarAddonLocation = primarySidebarElement?.querySelector(\n '[data-techdocs-addons-location=\"primary sidebar\"]',\n );\n if (!primarySidebarAddonLocation) {\n primarySidebarAddonLocation = document.createElement('div');\n primarySidebarAddonLocation.setAttribute(\n 'data-techdocs-addons-location',\n 'primary sidebar',\n );\n primarySidebarElement?.prepend(primarySidebarAddonLocation);\n }\n\n const secondarySidebarElement = shadowRoot?.querySelector(\n 'div[data-md-component=\"sidebar\"][data-md-type=\"toc\"], div[data-md-component=\"toc\"]',\n );\n let secondarySidebarAddonLocation = secondarySidebarElement?.querySelector(\n '[data-techdocs-addons-location=\"secondary sidebar\"]',\n );\n if (!secondarySidebarAddonLocation) {\n secondarySidebarAddonLocation = document.createElement('div');\n secondarySidebarAddonLocation.setAttribute(\n 'data-techdocs-addons-location',\n 'secondary sidebar',\n );\n secondarySidebarElement?.prepend(secondarySidebarAddonLocation);\n }\n\n return (\n <>\n <Portal container={primarySidebarAddonLocation}>\n {addons.renderComponentsByLocation(locations.PrimarySidebar)}\n </Portal>\n <Portal container={contentElement}>\n {addons.renderComponentsByLocation(locations.Content)}\n </Portal>\n <Portal container={secondarySidebarAddonLocation}>\n {addons.renderComponentsByLocation(locations.SecondarySidebar)}\n </Portal>\n </>\n );\n};\n"],"names":["locations"],"mappings":";;;;AAwBO,MAAM,kCAAkC,MAAM;AACnD,EAAA,MAAM,SAAS,iBAAkB,EAAA,CAAA;AAEjC,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,qBAAsB,EAAA,CAAA;AAE7C,EAAA,MAAM,iBAAiB,UAAY,
|
|
1
|
+
{"version":3,"file":"TechDocsReaderPageContentAddons.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Portal from '@material-ui/core/Portal';\nimport {\n useTechDocsAddons,\n TechDocsAddonLocations as locations,\n useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\n\nexport const TechDocsReaderPageContentAddons = () => {\n const addons = useTechDocsAddons();\n\n const { shadowRoot } = useTechDocsReaderPage();\n\n const contentElement = shadowRoot?.querySelector(\n '[data-md-component=\"content\"]',\n );\n\n const primarySidebarElement = shadowRoot?.querySelector(\n 'div[data-md-component=\"sidebar\"][data-md-type=\"navigation\"], div[data-md-component=\"navigation\"]',\n );\n let primarySidebarAddonLocation = primarySidebarElement?.querySelector(\n '[data-techdocs-addons-location=\"primary sidebar\"]',\n );\n if (!primarySidebarAddonLocation) {\n primarySidebarAddonLocation = document.createElement('div');\n primarySidebarAddonLocation.setAttribute(\n 'data-techdocs-addons-location',\n 'primary sidebar',\n );\n primarySidebarElement?.prepend(primarySidebarAddonLocation);\n }\n\n const secondarySidebarElement = shadowRoot?.querySelector(\n 'div[data-md-component=\"sidebar\"][data-md-type=\"toc\"], div[data-md-component=\"toc\"]',\n );\n let secondarySidebarAddonLocation = secondarySidebarElement?.querySelector(\n '[data-techdocs-addons-location=\"secondary sidebar\"]',\n );\n if (!secondarySidebarAddonLocation) {\n secondarySidebarAddonLocation = document.createElement('div');\n secondarySidebarAddonLocation.setAttribute(\n 'data-techdocs-addons-location',\n 'secondary sidebar',\n );\n secondarySidebarElement?.prepend(secondarySidebarAddonLocation);\n }\n\n return (\n <>\n <Portal container={primarySidebarAddonLocation}>\n {addons.renderComponentsByLocation(locations.PrimarySidebar)}\n </Portal>\n <Portal container={contentElement}>\n {addons.renderComponentsByLocation(locations.Content)}\n </Portal>\n <Portal container={secondarySidebarAddonLocation}>\n {addons.renderComponentsByLocation(locations.SecondarySidebar)}\n </Portal>\n </>\n );\n};\n"],"names":["locations"],"mappings":";;;;AAwBO,MAAM,kCAAkC,MAAM;AACnD,EAAA,MAAM,SAAS,iBAAkB,EAAA,CAAA;AAEjC,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,qBAAsB,EAAA,CAAA;AAE7C,EAAA,MAAM,iBAAiB,UAAY,EAAA,aAAA;AAAA,IACjC,+BAAA;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,wBAAwB,UAAY,EAAA,aAAA;AAAA,IACxC,kGAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,8BAA8B,qBAAuB,EAAA,aAAA;AAAA,IACvD,mDAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,CAAC,2BAA6B,EAAA;AAChC,IAA8B,2BAAA,GAAA,QAAA,CAAS,cAAc,KAAK,CAAA,CAAA;AAC1D,IAA4B,2BAAA,CAAA,YAAA;AAAA,MAC1B,+BAAA;AAAA,MACA,iBAAA;AAAA,KACF,CAAA;AACA,IAAA,qBAAA,EAAuB,QAAQ,2BAA2B,CAAA,CAAA;AAAA,GAC5D;AAEA,EAAA,MAAM,0BAA0B,UAAY,EAAA,aAAA;AAAA,IAC1C,oFAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,gCAAgC,uBAAyB,EAAA,aAAA;AAAA,IAC3D,qDAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,CAAC,6BAA+B,EAAA;AAClC,IAAgC,6BAAA,GAAA,QAAA,CAAS,cAAc,KAAK,CAAA,CAAA;AAC5D,IAA8B,6BAAA,CAAA,YAAA;AAAA,MAC5B,+BAAA;AAAA,MACA,mBAAA;AAAA,KACF,CAAA;AACA,IAAA,uBAAA,EAAyB,QAAQ,6BAA6B,CAAA,CAAA;AAAA,GAChE;AAEA,EAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,SAAA,EAAW,2BAChB,EAAA,EAAA,MAAA,CAAO,0BAA2B,CAAAA,sBAAA,CAAU,cAAc,CAC7D,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAO,SAAW,EAAA,cAAA,EAAA,EAChB,MAAO,CAAA,0BAAA,CAA2BA,sBAAU,CAAA,OAAO,CACtD,CAAA,kBACC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAO,SAAW,EAAA,6BAAA,EAAA,EAChB,MAAO,CAAA,0BAAA,CAA2BA,sBAAU,CAAA,gBAAgB,CAC/D,CACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -38,22 +38,21 @@ const useTechDocsReaderDom = (entityRef) => {
|
|
|
38
38
|
return;
|
|
39
39
|
const sidebars = dom.querySelectorAll(".md-sidebar");
|
|
40
40
|
sidebars.forEach((element) => {
|
|
41
|
-
var _a, _b, _c, _d;
|
|
42
41
|
if (isMobileMedia) {
|
|
43
42
|
element.style.top = "0px";
|
|
44
43
|
} else {
|
|
45
|
-
const page = document
|
|
46
|
-
const pageTop =
|
|
47
|
-
let domTop =
|
|
44
|
+
const page = document?.querySelector(".techdocs-reader-page");
|
|
45
|
+
const pageTop = page?.getBoundingClientRect().top ?? 0;
|
|
46
|
+
let domTop = dom.getBoundingClientRect().top ?? 0;
|
|
48
47
|
const tabs = dom.querySelector(".md-container > .md-tabs");
|
|
49
|
-
const tabsHeight =
|
|
48
|
+
const tabsHeight = tabs?.getBoundingClientRect().height ?? 0;
|
|
50
49
|
if (domTop < pageTop) {
|
|
51
50
|
domTop = pageTop;
|
|
52
51
|
}
|
|
53
52
|
const scrollbarTopPx = Math.max(domTop, 0) + tabsHeight;
|
|
54
53
|
element.style.top = `${scrollbarTopPx}px`;
|
|
55
54
|
const footer = dom.querySelector(".md-container > .md-footer");
|
|
56
|
-
const scrollbarEndPx =
|
|
55
|
+
const scrollbarEndPx = footer?.getBoundingClientRect().top ?? window.innerHeight;
|
|
57
56
|
element.style.height = `${scrollbarEndPx - scrollbarTopPx}px`;
|
|
58
57
|
}
|
|
59
58
|
element.style.setProperty("opacity", "1");
|
|
@@ -127,10 +126,9 @@ const useTechDocsReaderDom = (entityRef) => {
|
|
|
127
126
|
addLinkClickListener({
|
|
128
127
|
baseUrl: window.location.origin,
|
|
129
128
|
onClick: (event, url) => {
|
|
130
|
-
var _a, _b;
|
|
131
129
|
const modifierActive = event.ctrlKey || event.metaKey;
|
|
132
130
|
const parsedUrl = new URL(url);
|
|
133
|
-
const linkText =
|
|
131
|
+
const linkText = event.target?.innerText || url;
|
|
134
132
|
const to = url.replace(window.location.origin, "");
|
|
135
133
|
analytics.captureEvent("click", linkText, { attributes: { to } });
|
|
136
134
|
if (parsedUrl.hash) {
|
|
@@ -138,7 +136,7 @@ const useTechDocsReaderDom = (entityRef) => {
|
|
|
138
136
|
window.open(url, "_blank");
|
|
139
137
|
} else {
|
|
140
138
|
navigate(url);
|
|
141
|
-
|
|
139
|
+
transformedElement?.querySelector(`[id="${parsedUrl.hash.slice(1)}"]`)?.scrollIntoView();
|
|
142
140
|
}
|
|
143
141
|
} else {
|
|
144
142
|
if (modifierActive) {
|
|
@@ -154,8 +152,7 @@ const useTechDocsReaderDom = (entityRef) => {
|
|
|
154
152
|
onLoading: () => {
|
|
155
153
|
},
|
|
156
154
|
onLoaded: () => {
|
|
157
|
-
|
|
158
|
-
(_a = transformedElement.querySelector(".md-nav__title")) == null ? void 0 : _a.removeAttribute("for");
|
|
155
|
+
transformedElement.querySelector(".md-nav__title")?.removeAttribute("for");
|
|
159
156
|
}
|
|
160
157
|
}),
|
|
161
158
|
// hide sidebars until their positions are updated
|
|
@@ -180,7 +177,7 @@ const useTechDocsReaderDom = (entityRef) => {
|
|
|
180
177
|
};
|
|
181
178
|
let shouldReplaceContent = true;
|
|
182
179
|
preRender(rawPage, path).then(async (preTransformedDomElement) => {
|
|
183
|
-
if (!
|
|
180
|
+
if (!preTransformedDomElement?.innerHTML) {
|
|
184
181
|
return;
|
|
185
182
|
}
|
|
186
183
|
if (!shouldReplaceContent) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/dom.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback, useEffect, useState } from 'react';\n\nimport useMediaQuery from '@material-ui/core/useMediaQuery';\nimport { useTheme } from '@material-ui/core/styles';\n\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport { useAnalytics, useApi } from '@backstage/core-plugin-api';\nimport { scmIntegrationsApiRef } from '@backstage/integration-react';\n\nimport {\n techdocsStorageApiRef,\n useShadowDomStylesLoading,\n} from '@backstage/plugin-techdocs-react';\n\nimport { useTechDocsReader } from '../TechDocsReaderProvider';\n\nimport {\n addBaseUrl,\n addGitFeedbackLink,\n addLinkClickListener,\n addSidebarToggle,\n onCssReady,\n removeMkdocsHeader,\n rewriteDocLinks,\n simplifyMkdocsFooter,\n scrollIntoNavigation,\n transform as transformer,\n copyToClipboard,\n useSanitizerTransformer,\n useStylesTransformer,\n} from '../../transformers';\nimport { useNavigateUrl } from './useNavigateUrl';\n\nconst MOBILE_MEDIA_QUERY = 'screen and (max-width: 76.1875em)';\n\n/**\n * Hook that encapsulates the behavior of getting raw HTML and applying\n * transforms to it in order to make it function at a basic level in the\n * Backstage UI.\n */\nexport const useTechDocsReaderDom = (\n entityRef: CompoundEntityRef,\n): Element | null => {\n const navigate = useNavigateUrl();\n const theme = useTheme();\n const isMobileMedia = useMediaQuery(MOBILE_MEDIA_QUERY);\n const sanitizerTransformer = useSanitizerTransformer();\n const stylesTransformer = useStylesTransformer();\n const analytics = useAnalytics();\n\n const techdocsStorageApi = useApi(techdocsStorageApiRef);\n const scmIntegrationsApi = useApi(scmIntegrationsApiRef);\n\n const { state, path, content: rawPage } = useTechDocsReader();\n\n const [dom, setDom] = useState<HTMLElement | null>(null);\n const isStyleLoading = useShadowDomStylesLoading(dom);\n\n const updateSidebarPositionAndHeight = useCallback(() => {\n if (!dom) return;\n\n const sidebars = dom.querySelectorAll<HTMLElement>('.md-sidebar');\n\n sidebars.forEach(element => {\n // set sidebar position to render in correct position\n if (isMobileMedia) {\n element.style.top = '0px';\n } else {\n const page = document?.querySelector('.techdocs-reader-page');\n const pageTop = page?.getBoundingClientRect().top ?? 0;\n let domTop = dom.getBoundingClientRect().top ?? 0;\n\n const tabs = dom.querySelector('.md-container > .md-tabs');\n const tabsHeight = tabs?.getBoundingClientRect().height ?? 0;\n\n // the sidebars should not scroll beyond the total height of the header and tabs\n if (domTop < pageTop) {\n domTop = pageTop;\n }\n\n const scrollbarTopPx = Math.max(domTop, 0) + tabsHeight;\n\n element.style.top = `${scrollbarTopPx}px`;\n\n // set scrollbar height to ensure all links can be seen when content is small\n const footer = dom.querySelector('.md-container > .md-footer');\n // if no footer, fallback to using the bottom of the window\n const scrollbarEndPx =\n footer?.getBoundingClientRect().top ?? window.innerHeight;\n\n element.style.height = `${scrollbarEndPx - scrollbarTopPx}px`;\n }\n\n // show the sidebar only after updating its position\n element.style.setProperty('opacity', '1');\n });\n }, [dom, isMobileMedia]);\n\n useEffect(() => {\n window.addEventListener('resize', updateSidebarPositionAndHeight);\n window.addEventListener('scroll', updateSidebarPositionAndHeight, true);\n return () => {\n window.removeEventListener('resize', updateSidebarPositionAndHeight);\n window.removeEventListener(\n 'scroll',\n updateSidebarPositionAndHeight,\n true,\n );\n };\n }, [dom, updateSidebarPositionAndHeight]);\n\n // dynamically set width of footer to accommodate for pinning of the sidebar\n const updateFooterWidth = useCallback(() => {\n if (!dom) return;\n const footer = dom.querySelector<HTMLElement>('.md-footer');\n if (footer) {\n footer.style.width = `${dom.getBoundingClientRect().width}px`;\n }\n }, [dom]);\n\n useEffect(() => {\n window.addEventListener('resize', updateFooterWidth);\n return () => {\n window.removeEventListener('resize', updateFooterWidth);\n };\n }, [dom, updateFooterWidth]);\n\n // an update to \"state\" might lead to an updated UI so we include it as a trigger\n useEffect(() => {\n if (!isStyleLoading) {\n updateFooterWidth();\n updateSidebarPositionAndHeight();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [\n state,\n isStyleLoading,\n updateFooterWidth,\n updateSidebarPositionAndHeight,\n ]);\n\n // a function that performs transformations that are executed prior to adding it to the DOM\n const preRender = useCallback(\n (rawContent: string, contentPath: string) =>\n transformer(rawContent, [\n sanitizerTransformer,\n addBaseUrl({\n techdocsStorageApi,\n entityId: entityRef,\n path: contentPath,\n }),\n rewriteDocLinks(),\n addSidebarToggle(),\n removeMkdocsHeader(),\n simplifyMkdocsFooter(),\n addGitFeedbackLink(scmIntegrationsApi),\n stylesTransformer,\n ]),\n [\n // only add dependencies that are in state or memorized variables to avoid unnecessary calls between re-renders\n entityRef,\n scmIntegrationsApi,\n techdocsStorageApi,\n sanitizerTransformer,\n stylesTransformer,\n ],\n );\n\n // a function that performs transformations that are executed after adding it to the DOM\n const postRender = useCallback(\n async (transformedElement: Element) =>\n transformer(transformedElement, [\n scrollIntoNavigation(),\n copyToClipboard(theme),\n addLinkClickListener({\n baseUrl: window.location.origin,\n onClick: (event: MouseEvent, url: string) => {\n // detect if CTRL or META keys are pressed so that links can be opened in a new tab with `window.open`\n const modifierActive = event.ctrlKey || event.metaKey;\n const parsedUrl = new URL(url);\n\n // capture link clicks within documentation\n const linkText =\n (event.target as HTMLAnchorElement | undefined)?.innerText || url;\n const to = url.replace(window.location.origin, '');\n analytics.captureEvent('click', linkText, { attributes: { to } });\n\n // hash exists when anchor is clicked on secondary sidebar\n if (parsedUrl.hash) {\n if (modifierActive) {\n window.open(url, '_blank');\n } else {\n navigate(url);\n // Scroll to hash if it's on the current page\n transformedElement\n ?.querySelector(`[id=\"${parsedUrl.hash.slice(1)}\"]`)\n ?.scrollIntoView();\n }\n } else {\n if (modifierActive) {\n window.open(url, '_blank');\n } else {\n navigate(url);\n }\n }\n },\n }),\n // disable MkDocs drawer toggling ('for' attribute => checkbox mechanism)\n onCssReady({\n onLoading: () => {},\n onLoaded: () => {\n transformedElement\n .querySelector('.md-nav__title')\n ?.removeAttribute('for');\n },\n }),\n // hide sidebars until their positions are updated\n onCssReady({\n onLoading: () => {\n const sidebars = Array.from(\n transformedElement.querySelectorAll<HTMLElement>('.md-sidebar'),\n );\n sidebars.forEach(element => {\n element.style.setProperty('opacity', '0');\n });\n },\n onLoaded: () => {},\n }),\n ]),\n [theme, navigate, analytics],\n );\n\n useEffect(() => {\n if (!rawPage) return () => {};\n\n // if false, there is already a newer execution of this effect\n let shouldReplaceContent = true;\n\n // Pre-render\n preRender(rawPage, path).then(async preTransformedDomElement => {\n if (!preTransformedDomElement?.innerHTML) {\n return; // An unexpected error occurred\n }\n\n // don't manipulate the shadow dom if this isn't the latest effect execution\n if (!shouldReplaceContent) {\n return;\n }\n\n // Scroll to top after render\n window.scroll({ top: 0 });\n\n // Post-render\n const postTransformedDomElement = await postRender(\n preTransformedDomElement,\n );\n setDom(postTransformedDomElement as HTMLElement);\n });\n\n // cancel this execution\n return () => {\n shouldReplaceContent = false;\n };\n }, [rawPage, path, preRender, postRender]);\n\n return dom;\n};\n"],"names":["transformer"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dom.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/dom.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback, useEffect, useState } from 'react';\n\nimport useMediaQuery from '@material-ui/core/useMediaQuery';\nimport { useTheme } from '@material-ui/core/styles';\n\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport { useAnalytics, useApi } from '@backstage/core-plugin-api';\nimport { scmIntegrationsApiRef } from '@backstage/integration-react';\n\nimport {\n techdocsStorageApiRef,\n useShadowDomStylesLoading,\n} from '@backstage/plugin-techdocs-react';\n\nimport { useTechDocsReader } from '../TechDocsReaderProvider';\n\nimport {\n addBaseUrl,\n addGitFeedbackLink,\n addLinkClickListener,\n addSidebarToggle,\n onCssReady,\n removeMkdocsHeader,\n rewriteDocLinks,\n simplifyMkdocsFooter,\n scrollIntoNavigation,\n transform as transformer,\n copyToClipboard,\n useSanitizerTransformer,\n useStylesTransformer,\n} from '../../transformers';\nimport { useNavigateUrl } from './useNavigateUrl';\n\nconst MOBILE_MEDIA_QUERY = 'screen and (max-width: 76.1875em)';\n\n/**\n * Hook that encapsulates the behavior of getting raw HTML and applying\n * transforms to it in order to make it function at a basic level in the\n * Backstage UI.\n */\nexport const useTechDocsReaderDom = (\n entityRef: CompoundEntityRef,\n): Element | null => {\n const navigate = useNavigateUrl();\n const theme = useTheme();\n const isMobileMedia = useMediaQuery(MOBILE_MEDIA_QUERY);\n const sanitizerTransformer = useSanitizerTransformer();\n const stylesTransformer = useStylesTransformer();\n const analytics = useAnalytics();\n\n const techdocsStorageApi = useApi(techdocsStorageApiRef);\n const scmIntegrationsApi = useApi(scmIntegrationsApiRef);\n\n const { state, path, content: rawPage } = useTechDocsReader();\n\n const [dom, setDom] = useState<HTMLElement | null>(null);\n const isStyleLoading = useShadowDomStylesLoading(dom);\n\n const updateSidebarPositionAndHeight = useCallback(() => {\n if (!dom) return;\n\n const sidebars = dom.querySelectorAll<HTMLElement>('.md-sidebar');\n\n sidebars.forEach(element => {\n // set sidebar position to render in correct position\n if (isMobileMedia) {\n element.style.top = '0px';\n } else {\n const page = document?.querySelector('.techdocs-reader-page');\n const pageTop = page?.getBoundingClientRect().top ?? 0;\n let domTop = dom.getBoundingClientRect().top ?? 0;\n\n const tabs = dom.querySelector('.md-container > .md-tabs');\n const tabsHeight = tabs?.getBoundingClientRect().height ?? 0;\n\n // the sidebars should not scroll beyond the total height of the header and tabs\n if (domTop < pageTop) {\n domTop = pageTop;\n }\n\n const scrollbarTopPx = Math.max(domTop, 0) + tabsHeight;\n\n element.style.top = `${scrollbarTopPx}px`;\n\n // set scrollbar height to ensure all links can be seen when content is small\n const footer = dom.querySelector('.md-container > .md-footer');\n // if no footer, fallback to using the bottom of the window\n const scrollbarEndPx =\n footer?.getBoundingClientRect().top ?? window.innerHeight;\n\n element.style.height = `${scrollbarEndPx - scrollbarTopPx}px`;\n }\n\n // show the sidebar only after updating its position\n element.style.setProperty('opacity', '1');\n });\n }, [dom, isMobileMedia]);\n\n useEffect(() => {\n window.addEventListener('resize', updateSidebarPositionAndHeight);\n window.addEventListener('scroll', updateSidebarPositionAndHeight, true);\n return () => {\n window.removeEventListener('resize', updateSidebarPositionAndHeight);\n window.removeEventListener(\n 'scroll',\n updateSidebarPositionAndHeight,\n true,\n );\n };\n }, [dom, updateSidebarPositionAndHeight]);\n\n // dynamically set width of footer to accommodate for pinning of the sidebar\n const updateFooterWidth = useCallback(() => {\n if (!dom) return;\n const footer = dom.querySelector<HTMLElement>('.md-footer');\n if (footer) {\n footer.style.width = `${dom.getBoundingClientRect().width}px`;\n }\n }, [dom]);\n\n useEffect(() => {\n window.addEventListener('resize', updateFooterWidth);\n return () => {\n window.removeEventListener('resize', updateFooterWidth);\n };\n }, [dom, updateFooterWidth]);\n\n // an update to \"state\" might lead to an updated UI so we include it as a trigger\n useEffect(() => {\n if (!isStyleLoading) {\n updateFooterWidth();\n updateSidebarPositionAndHeight();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [\n state,\n isStyleLoading,\n updateFooterWidth,\n updateSidebarPositionAndHeight,\n ]);\n\n // a function that performs transformations that are executed prior to adding it to the DOM\n const preRender = useCallback(\n (rawContent: string, contentPath: string) =>\n transformer(rawContent, [\n sanitizerTransformer,\n addBaseUrl({\n techdocsStorageApi,\n entityId: entityRef,\n path: contentPath,\n }),\n rewriteDocLinks(),\n addSidebarToggle(),\n removeMkdocsHeader(),\n simplifyMkdocsFooter(),\n addGitFeedbackLink(scmIntegrationsApi),\n stylesTransformer,\n ]),\n [\n // only add dependencies that are in state or memorized variables to avoid unnecessary calls between re-renders\n entityRef,\n scmIntegrationsApi,\n techdocsStorageApi,\n sanitizerTransformer,\n stylesTransformer,\n ],\n );\n\n // a function that performs transformations that are executed after adding it to the DOM\n const postRender = useCallback(\n async (transformedElement: Element) =>\n transformer(transformedElement, [\n scrollIntoNavigation(),\n copyToClipboard(theme),\n addLinkClickListener({\n baseUrl: window.location.origin,\n onClick: (event: MouseEvent, url: string) => {\n // detect if CTRL or META keys are pressed so that links can be opened in a new tab with `window.open`\n const modifierActive = event.ctrlKey || event.metaKey;\n const parsedUrl = new URL(url);\n\n // capture link clicks within documentation\n const linkText =\n (event.target as HTMLAnchorElement | undefined)?.innerText || url;\n const to = url.replace(window.location.origin, '');\n analytics.captureEvent('click', linkText, { attributes: { to } });\n\n // hash exists when anchor is clicked on secondary sidebar\n if (parsedUrl.hash) {\n if (modifierActive) {\n window.open(url, '_blank');\n } else {\n navigate(url);\n // Scroll to hash if it's on the current page\n transformedElement\n ?.querySelector(`[id=\"${parsedUrl.hash.slice(1)}\"]`)\n ?.scrollIntoView();\n }\n } else {\n if (modifierActive) {\n window.open(url, '_blank');\n } else {\n navigate(url);\n }\n }\n },\n }),\n // disable MkDocs drawer toggling ('for' attribute => checkbox mechanism)\n onCssReady({\n onLoading: () => {},\n onLoaded: () => {\n transformedElement\n .querySelector('.md-nav__title')\n ?.removeAttribute('for');\n },\n }),\n // hide sidebars until their positions are updated\n onCssReady({\n onLoading: () => {\n const sidebars = Array.from(\n transformedElement.querySelectorAll<HTMLElement>('.md-sidebar'),\n );\n sidebars.forEach(element => {\n element.style.setProperty('opacity', '0');\n });\n },\n onLoaded: () => {},\n }),\n ]),\n [theme, navigate, analytics],\n );\n\n useEffect(() => {\n if (!rawPage) return () => {};\n\n // if false, there is already a newer execution of this effect\n let shouldReplaceContent = true;\n\n // Pre-render\n preRender(rawPage, path).then(async preTransformedDomElement => {\n if (!preTransformedDomElement?.innerHTML) {\n return; // An unexpected error occurred\n }\n\n // don't manipulate the shadow dom if this isn't the latest effect execution\n if (!shouldReplaceContent) {\n return;\n }\n\n // Scroll to top after render\n window.scroll({ top: 0 });\n\n // Post-render\n const postTransformedDomElement = await postRender(\n preTransformedDomElement,\n );\n setDom(postTransformedDomElement as HTMLElement);\n });\n\n // cancel this execution\n return () => {\n shouldReplaceContent = false;\n };\n }, [rawPage, path, preRender, postRender]);\n\n return dom;\n};\n"],"names":["transformer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiDA,MAAM,kBAAqB,GAAA,mCAAA,CAAA;AAOd,MAAA,oBAAA,GAAuB,CAClC,SACmB,KAAA;AACnB,EAAA,MAAM,WAAW,cAAe,EAAA,CAAA;AAChC,EAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AACvB,EAAM,MAAA,aAAA,GAAgB,cAAc,kBAAkB,CAAA,CAAA;AACtD,EAAA,MAAM,uBAAuB,uBAAwB,EAAA,CAAA;AACrD,EAAA,MAAM,oBAAoB,oBAAqB,EAAA,CAAA;AAC/C,EAAA,MAAM,YAAY,YAAa,EAAA,CAAA;AAE/B,EAAM,MAAA,kBAAA,GAAqB,OAAO,qBAAqB,CAAA,CAAA;AACvD,EAAM,MAAA,kBAAA,GAAqB,OAAO,qBAAqB,CAAA,CAAA;AAEvD,EAAA,MAAM,EAAE,KAAO,EAAA,IAAA,EAAM,OAAS,EAAA,OAAA,KAAY,iBAAkB,EAAA,CAAA;AAE5D,EAAA,MAAM,CAAC,GAAA,EAAK,MAAM,CAAA,GAAI,SAA6B,IAAI,CAAA,CAAA;AACvD,EAAM,MAAA,cAAA,GAAiB,0BAA0B,GAAG,CAAA,CAAA;AAEpD,EAAM,MAAA,8BAAA,GAAiC,YAAY,MAAM;AACvD,IAAA,IAAI,CAAC,GAAA;AAAK,MAAA,OAAA;AAEV,IAAM,MAAA,QAAA,GAAW,GAAI,CAAA,gBAAA,CAA8B,aAAa,CAAA,CAAA;AAEhE,IAAA,QAAA,CAAS,QAAQ,CAAW,OAAA,KAAA;AAE1B,MAAA,IAAI,aAAe,EAAA;AACjB,QAAA,OAAA,CAAQ,MAAM,GAAM,GAAA,KAAA,CAAA;AAAA,OACf,MAAA;AACL,QAAM,MAAA,IAAA,GAAO,QAAU,EAAA,aAAA,CAAc,uBAAuB,CAAA,CAAA;AAC5D,QAAA,MAAM,OAAU,GAAA,IAAA,EAAM,qBAAsB,EAAA,CAAE,GAAO,IAAA,CAAA,CAAA;AACrD,QAAA,IAAI,MAAS,GAAA,GAAA,CAAI,qBAAsB,EAAA,CAAE,GAAO,IAAA,CAAA,CAAA;AAEhD,QAAM,MAAA,IAAA,GAAO,GAAI,CAAA,aAAA,CAAc,0BAA0B,CAAA,CAAA;AACzD,QAAA,MAAM,UAAa,GAAA,IAAA,EAAM,qBAAsB,EAAA,CAAE,MAAU,IAAA,CAAA,CAAA;AAG3D,QAAA,IAAI,SAAS,OAAS,EAAA;AACpB,UAAS,MAAA,GAAA,OAAA,CAAA;AAAA,SACX;AAEA,QAAA,MAAM,cAAiB,GAAA,IAAA,CAAK,GAAI,CAAA,MAAA,EAAQ,CAAC,CAAI,GAAA,UAAA,CAAA;AAE7C,QAAQ,OAAA,CAAA,KAAA,CAAM,GAAM,GAAA,CAAA,EAAG,cAAc,CAAA,EAAA,CAAA,CAAA;AAGrC,QAAM,MAAA,MAAA,GAAS,GAAI,CAAA,aAAA,CAAc,4BAA4B,CAAA,CAAA;AAE7D,QAAA,MAAM,cACJ,GAAA,MAAA,EAAQ,qBAAsB,EAAA,CAAE,OAAO,MAAO,CAAA,WAAA,CAAA;AAEhD,QAAA,OAAA,CAAQ,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA,cAAA,GAAiB,cAAc,CAAA,EAAA,CAAA,CAAA;AAAA,OAC3D;AAGA,MAAQ,OAAA,CAAA,KAAA,CAAM,WAAY,CAAA,SAAA,EAAW,GAAG,CAAA,CAAA;AAAA,KACzC,CAAA,CAAA;AAAA,GACA,EAAA,CAAC,GAAK,EAAA,aAAa,CAAC,CAAA,CAAA;AAEvB,EAAA,SAAA,CAAU,MAAM;AACd,IAAO,MAAA,CAAA,gBAAA,CAAiB,UAAU,8BAA8B,CAAA,CAAA;AAChE,IAAO,MAAA,CAAA,gBAAA,CAAiB,QAAU,EAAA,8BAAA,EAAgC,IAAI,CAAA,CAAA;AACtE,IAAA,OAAO,MAAM;AACX,MAAO,MAAA,CAAA,mBAAA,CAAoB,UAAU,8BAA8B,CAAA,CAAA;AACnE,MAAO,MAAA,CAAA,mBAAA;AAAA,QACL,QAAA;AAAA,QACA,8BAAA;AAAA,QACA,IAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA;AAAA,GACC,EAAA,CAAC,GAAK,EAAA,8BAA8B,CAAC,CAAA,CAAA;AAGxC,EAAM,MAAA,iBAAA,GAAoB,YAAY,MAAM;AAC1C,IAAA,IAAI,CAAC,GAAA;AAAK,MAAA,OAAA;AACV,IAAM,MAAA,MAAA,GAAS,GAAI,CAAA,aAAA,CAA2B,YAAY,CAAA,CAAA;AAC1D,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,MAAA,CAAO,MAAM,KAAQ,GAAA,CAAA,EAAG,GAAI,CAAA,qBAAA,GAAwB,KAAK,CAAA,EAAA,CAAA,CAAA;AAAA,KAC3D;AAAA,GACF,EAAG,CAAC,GAAG,CAAC,CAAA,CAAA;AAER,EAAA,SAAA,CAAU,MAAM;AACd,IAAO,MAAA,CAAA,gBAAA,CAAiB,UAAU,iBAAiB,CAAA,CAAA;AACnD,IAAA,OAAO,MAAM;AACX,MAAO,MAAA,CAAA,mBAAA,CAAoB,UAAU,iBAAiB,CAAA,CAAA;AAAA,KACxD,CAAA;AAAA,GACC,EAAA,CAAC,GAAK,EAAA,iBAAiB,CAAC,CAAA,CAAA;AAG3B,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,MAAkB,iBAAA,EAAA,CAAA;AAClB,MAA+B,8BAAA,EAAA,CAAA;AAAA,KACjC;AAAA,GAEC,EAAA;AAAA,IACD,KAAA;AAAA,IACA,cAAA;AAAA,IACA,iBAAA;AAAA,IACA,8BAAA;AAAA,GACD,CAAA,CAAA;AAGD,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,UAAA,EAAoB,WACnB,KAAAA,SAAA,CAAY,UAAY,EAAA;AAAA,MACtB,oBAAA;AAAA,MACA,UAAW,CAAA;AAAA,QACT,kBAAA;AAAA,QACA,QAAU,EAAA,SAAA;AAAA,QACV,IAAM,EAAA,WAAA;AAAA,OACP,CAAA;AAAA,MACD,eAAgB,EAAA;AAAA,MAChB,gBAAiB,EAAA;AAAA,MACjB,kBAAmB,EAAA;AAAA,MACnB,oBAAqB,EAAA;AAAA,MACrB,mBAAmB,kBAAkB,CAAA;AAAA,MACrC,iBAAA;AAAA,KACD,CAAA;AAAA,IACH;AAAA;AAAA,MAEE,SAAA;AAAA,MACA,kBAAA;AAAA,MACA,kBAAA;AAAA,MACA,oBAAA;AAAA,MACA,iBAAA;AAAA,KACF;AAAA,GACF,CAAA;AAGA,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,OAAO,kBACL,KAAAA,SAAA,CAAY,kBAAoB,EAAA;AAAA,MAC9B,oBAAqB,EAAA;AAAA,MACrB,gBAAgB,KAAK,CAAA;AAAA,MACrB,oBAAqB,CAAA;AAAA,QACnB,OAAA,EAAS,OAAO,QAAS,CAAA,MAAA;AAAA,QACzB,OAAA,EAAS,CAAC,KAAA,EAAmB,GAAgB,KAAA;AAE3C,UAAM,MAAA,cAAA,GAAiB,KAAM,CAAA,OAAA,IAAW,KAAM,CAAA,OAAA,CAAA;AAC9C,UAAM,MAAA,SAAA,GAAY,IAAI,GAAA,CAAI,GAAG,CAAA,CAAA;AAG7B,UAAM,MAAA,QAAA,GACH,KAAM,CAAA,MAAA,EAA0C,SAAa,IAAA,GAAA,CAAA;AAChE,UAAA,MAAM,KAAK,GAAI,CAAA,OAAA,CAAQ,MAAO,CAAA,QAAA,CAAS,QAAQ,EAAE,CAAA,CAAA;AACjD,UAAU,SAAA,CAAA,YAAA,CAAa,SAAS,QAAU,EAAA,EAAE,YAAY,EAAE,EAAA,IAAM,CAAA,CAAA;AAGhE,UAAA,IAAI,UAAU,IAAM,EAAA;AAClB,YAAA,IAAI,cAAgB,EAAA;AAClB,cAAO,MAAA,CAAA,IAAA,CAAK,KAAK,QAAQ,CAAA,CAAA;AAAA,aACpB,MAAA;AACL,cAAA,QAAA,CAAS,GAAG,CAAA,CAAA;AAEZ,cACI,kBAAA,EAAA,aAAA,CAAc,QAAQ,SAAU,CAAA,IAAA,CAAK,MAAM,CAAC,CAAC,CAAI,EAAA,CAAA,CAAA,EACjD,cAAe,EAAA,CAAA;AAAA,aACrB;AAAA,WACK,MAAA;AACL,YAAA,IAAI,cAAgB,EAAA;AAClB,cAAO,MAAA,CAAA,IAAA,CAAK,KAAK,QAAQ,CAAA,CAAA;AAAA,aACpB,MAAA;AACL,cAAA,QAAA,CAAS,GAAG,CAAA,CAAA;AAAA,aACd;AAAA,WACF;AAAA,SACF;AAAA,OACD,CAAA;AAAA;AAAA,MAED,UAAW,CAAA;AAAA,QACT,WAAW,MAAM;AAAA,SAAC;AAAA,QAClB,UAAU,MAAM;AACd,UAAA,kBAAA,CACG,aAAc,CAAA,gBAAgB,CAC7B,EAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AAAA,SAC3B;AAAA,OACD,CAAA;AAAA;AAAA,MAED,UAAW,CAAA;AAAA,QACT,WAAW,MAAM;AACf,UAAA,MAAM,WAAW,KAAM,CAAA,IAAA;AAAA,YACrB,kBAAA,CAAmB,iBAA8B,aAAa,CAAA;AAAA,WAChE,CAAA;AACA,UAAA,QAAA,CAAS,QAAQ,CAAW,OAAA,KAAA;AAC1B,YAAQ,OAAA,CAAA,KAAA,CAAM,WAAY,CAAA,SAAA,EAAW,GAAG,CAAA,CAAA;AAAA,WACzC,CAAA,CAAA;AAAA,SACH;AAAA,QACA,UAAU,MAAM;AAAA,SAAC;AAAA,OAClB,CAAA;AAAA,KACF,CAAA;AAAA,IACH,CAAC,KAAO,EAAA,QAAA,EAAU,SAAS,CAAA;AAAA,GAC7B,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,OAAA;AAAS,MAAA,OAAO,MAAM;AAAA,OAAC,CAAA;AAG5B,IAAA,IAAI,oBAAuB,GAAA,IAAA,CAAA;AAG3B,IAAA,SAAA,CAAU,OAAS,EAAA,IAAI,CAAE,CAAA,IAAA,CAAK,OAAM,wBAA4B,KAAA;AAC9D,MAAI,IAAA,CAAC,0BAA0B,SAAW,EAAA;AACxC,QAAA,OAAA;AAAA,OACF;AAGA,MAAA,IAAI,CAAC,oBAAsB,EAAA;AACzB,QAAA,OAAA;AAAA,OACF;AAGA,MAAA,MAAA,CAAO,MAAO,CAAA,EAAE,GAAK,EAAA,CAAA,EAAG,CAAA,CAAA;AAGxB,MAAA,MAAM,4BAA4B,MAAM,UAAA;AAAA,QACtC,wBAAA;AAAA,OACF,CAAA;AACA,MAAA,MAAA,CAAO,yBAAwC,CAAA,CAAA;AAAA,KAChD,CAAA,CAAA;AAGD,IAAA,OAAO,MAAM;AACX,MAAuB,oBAAA,GAAA,KAAA,CAAA;AAAA,KACzB,CAAA;AAAA,KACC,CAAC,OAAA,EAAS,IAAM,EAAA,SAAA,EAAW,UAAU,CAAC,CAAA,CAAA;AAEzC,EAAO,OAAA,GAAA,CAAA;AACT;;;;"}
|
|
@@ -40,19 +40,19 @@ const TechDocsReaderPageHeader = (props) => {
|
|
|
40
40
|
const appTitle = configApi.getOptional("app.title") || "Backstage";
|
|
41
41
|
const tabTitle = [title, subtitle, appTitle].filter(Boolean).join(" | ");
|
|
42
42
|
const { locationMetadata, spec } = entityMetadata || {};
|
|
43
|
-
const lifecycle = spec
|
|
43
|
+
const lifecycle = spec?.lifecycle;
|
|
44
44
|
const ownedByRelations = entityMetadata ? getEntityRelations(entityMetadata, RELATION_OWNED_BY) : [];
|
|
45
45
|
const docsRootLink = useRouteRef(rootRouteRef)();
|
|
46
46
|
const labels = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
47
47
|
HeaderLabel,
|
|
48
48
|
{
|
|
49
|
-
label: capitalize(
|
|
49
|
+
label: capitalize(entityMetadata?.kind || "entity"),
|
|
50
50
|
value: /* @__PURE__ */ React.createElement(
|
|
51
51
|
EntityRefLink,
|
|
52
52
|
{
|
|
53
53
|
color: "inherit",
|
|
54
54
|
entityRef,
|
|
55
|
-
title: entityMetadata
|
|
55
|
+
title: entityMetadata?.metadata.title,
|
|
56
56
|
defaultKind: "Component"
|
|
57
57
|
}
|
|
58
58
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TechDocsReaderPageHeader.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { PropsWithChildren, useEffect } from 'react';\nimport Helmet from 'react-helmet';\n\nimport Grid from '@material-ui/core/Grid';\nimport Skeleton from '@material-ui/lab/Skeleton';\nimport CodeIcon from '@material-ui/icons/Code';\n\nimport {\n TechDocsAddonLocations as locations,\n useTechDocsAddons,\n useTechDocsReaderPage,\n TechDocsEntityMetadata,\n TechDocsMetadata,\n} from '@backstage/plugin-techdocs-react';\nimport {\n EntityRefLink,\n EntityRefLinks,\n getEntityRelations,\n} from '@backstage/plugin-catalog-react';\nimport { RELATION_OWNED_BY, CompoundEntityRef } from '@backstage/catalog-model';\nimport { Header, HeaderLabel } from '@backstage/core-components';\nimport { useRouteRef, configApiRef, useApi } from '@backstage/core-plugin-api';\n\nimport { capitalize } from 'lodash';\n\nimport { rootRouteRef } from '../../../routes';\n\nconst skeleton = <Skeleton animation=\"wave\" variant=\"text\" height={40} />;\n\n/**\n * Props for {@link TechDocsReaderPageHeader}\n *\n * @public\n * @deprecated No need to pass down properties anymore. The component consumes data from `TechDocsReaderPageContext` instead. Use the {@link @backstage/plugin-techdocs-react#useTechDocsReaderPage} hook for custom header.\n */\nexport type TechDocsReaderPageHeaderProps = PropsWithChildren<{\n entityRef?: CompoundEntityRef;\n entityMetadata?: TechDocsEntityMetadata;\n techDocsMetadata?: TechDocsMetadata;\n}>;\n\n/**\n * Renders the reader page header.\n * This component does not accept props, please use\n * the Tech Docs add-ons to customize it\n * @public\n */\nexport const TechDocsReaderPageHeader = (\n props: TechDocsReaderPageHeaderProps,\n) => {\n const { children } = props;\n const addons = useTechDocsAddons();\n const configApi = useApi(configApiRef);\n\n const {\n title,\n setTitle,\n subtitle,\n setSubtitle,\n entityRef,\n metadata: { value: metadata, loading: metadataLoading },\n entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },\n } = useTechDocsReaderPage();\n\n useEffect(() => {\n if (!metadata) return;\n setTitle(metadata.site_name);\n setSubtitle(() => {\n let { site_description } = metadata;\n if (!site_description || site_description === 'None') {\n site_description = '';\n }\n return site_description;\n });\n }, [metadata, setTitle, setSubtitle]);\n\n const appTitle = configApi.getOptional('app.title') || 'Backstage';\n const tabTitle = [title, subtitle, appTitle].filter(Boolean).join(' | ');\n\n const { locationMetadata, spec } = entityMetadata || {};\n const lifecycle = spec?.lifecycle;\n\n const ownedByRelations = entityMetadata\n ? getEntityRelations(entityMetadata, RELATION_OWNED_BY)\n : [];\n\n const docsRootLink = useRouteRef(rootRouteRef)();\n\n const labels = (\n <>\n <HeaderLabel\n label={capitalize(entityMetadata?.kind || 'entity')}\n value={\n <EntityRefLink\n color=\"inherit\"\n entityRef={entityRef}\n title={entityMetadata?.metadata.title}\n defaultKind=\"Component\"\n />\n }\n />\n {ownedByRelations.length > 0 && (\n <HeaderLabel\n label=\"Owner\"\n value={\n <EntityRefLinks\n color=\"inherit\"\n entityRefs={ownedByRelations}\n defaultKind=\"group\"\n />\n }\n />\n )}\n {lifecycle ? (\n <HeaderLabel label=\"Lifecycle\" value={String(lifecycle)} />\n ) : null}\n {locationMetadata &&\n locationMetadata.type !== 'dir' &&\n locationMetadata.type !== 'file' ? (\n <HeaderLabel\n label=\"\"\n value={\n <Grid container direction=\"column\" alignItems=\"center\">\n <Grid style={{ padding: 0 }} item>\n <CodeIcon style={{ marginTop: '-25px' }} />\n </Grid>\n <Grid style={{ padding: 0 }} item>\n Source\n </Grid>\n </Grid>\n }\n url={locationMetadata.target}\n />\n ) : null}\n </>\n );\n\n // If there is no entity or techdocs metadata, there's no reason to show the\n // header (hides the header on 404 error pages).\n const noEntMetadata = !entityMetadataLoading && entityMetadata === undefined;\n const noTdMetadata = !metadataLoading && metadata === undefined;\n if (noEntMetadata || noTdMetadata) return null;\n\n return (\n <Header\n type=\"Documentation\"\n typeLink={docsRootLink}\n title={title || skeleton}\n subtitle={subtitle === '' ? undefined : subtitle || skeleton}\n >\n <Helmet titleTemplate=\"%s\">\n <title>{tabTitle}</title>\n </Helmet>\n {labels}\n {children}\n {addons.renderComponentsByLocation(locations.Header)}\n </Header>\n );\n};\n"],"names":["locations"],"mappings":";;;;;;;;;;;;;AA2CA,MAAM,QAAA,uCAAY,QAAS,EAAA,EAAA,SAAA,EAAU,QAAO,OAAQ,EAAA,MAAA,EAAO,QAAQ,EAAI,EAAA,CAAA,CAAA;AAoB1D,MAAA,wBAAA,GAA2B,CACtC,KACG,KAAA;AACH,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AACrB,EAAA,MAAM,SAAS,iBAAkB,EAAA,CAAA;AACjC,EAAM,MAAA,SAAA,GAAY,OAAO,YAAY,CAAA,CAAA;AAErC,EAAM,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAU,EAAA,EAAE,KAAO,EAAA,QAAA,EAAU,SAAS,eAAgB,EAAA;AAAA,IACtD,cAAgB,EAAA,EAAE,KAAO,EAAA,cAAA,EAAgB,SAAS,qBAAsB,EAAA;AAAA,MACtE,qBAAsB,EAAA,CAAA;AAE1B,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,QAAA;AAAU,MAAA,OAAA;AACf,IAAA,QAAA,CAAS,SAAS,SAAS,CAAA,CAAA;AAC3B,IAAA,WAAA,CAAY,MAAM;AAChB,MAAI,IAAA,EAAE,kBAAqB,GAAA,QAAA,CAAA;AAC3B,MAAI,IAAA,CAAC,gBAAoB,IAAA,gBAAA,KAAqB,MAAQ,EAAA;AACpD,QAAmB,gBAAA,GAAA,EAAA,CAAA;AAAA,OACrB;AACA,MAAO,OAAA,gBAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAAA,GACA,EAAA,CAAC,QAAU,EAAA,QAAA,EAAU,WAAW,CAAC,CAAA,CAAA;AAEpC,EAAA,MAAM,QAAW,GAAA,SAAA,CAAU,WAAY,CAAA,WAAW,CAAK,IAAA,WAAA,CAAA;AACvD,EAAM,MAAA,QAAA,GAAW,CAAC,KAAA,EAAO,QAAU,EAAA,QAAQ,EAAE,MAAO,CAAA,OAAO,CAAE,CAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AAEvE,EAAA,MAAM,EAAE,gBAAA,EAAkB,IAAK,EAAA,GAAI,kBAAkB,EAAC,CAAA;AACtD,EAAA,MAAM,YAAY,IAAM,
|
|
1
|
+
{"version":3,"file":"TechDocsReaderPageHeader.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { PropsWithChildren, useEffect } from 'react';\nimport Helmet from 'react-helmet';\n\nimport Grid from '@material-ui/core/Grid';\nimport Skeleton from '@material-ui/lab/Skeleton';\nimport CodeIcon from '@material-ui/icons/Code';\n\nimport {\n TechDocsAddonLocations as locations,\n useTechDocsAddons,\n useTechDocsReaderPage,\n TechDocsEntityMetadata,\n TechDocsMetadata,\n} from '@backstage/plugin-techdocs-react';\nimport {\n EntityRefLink,\n EntityRefLinks,\n getEntityRelations,\n} from '@backstage/plugin-catalog-react';\nimport { RELATION_OWNED_BY, CompoundEntityRef } from '@backstage/catalog-model';\nimport { Header, HeaderLabel } from '@backstage/core-components';\nimport { useRouteRef, configApiRef, useApi } from '@backstage/core-plugin-api';\n\nimport { capitalize } from 'lodash';\n\nimport { rootRouteRef } from '../../../routes';\n\nconst skeleton = <Skeleton animation=\"wave\" variant=\"text\" height={40} />;\n\n/**\n * Props for {@link TechDocsReaderPageHeader}\n *\n * @public\n * @deprecated No need to pass down properties anymore. The component consumes data from `TechDocsReaderPageContext` instead. Use the {@link @backstage/plugin-techdocs-react#useTechDocsReaderPage} hook for custom header.\n */\nexport type TechDocsReaderPageHeaderProps = PropsWithChildren<{\n entityRef?: CompoundEntityRef;\n entityMetadata?: TechDocsEntityMetadata;\n techDocsMetadata?: TechDocsMetadata;\n}>;\n\n/**\n * Renders the reader page header.\n * This component does not accept props, please use\n * the Tech Docs add-ons to customize it\n * @public\n */\nexport const TechDocsReaderPageHeader = (\n props: TechDocsReaderPageHeaderProps,\n) => {\n const { children } = props;\n const addons = useTechDocsAddons();\n const configApi = useApi(configApiRef);\n\n const {\n title,\n setTitle,\n subtitle,\n setSubtitle,\n entityRef,\n metadata: { value: metadata, loading: metadataLoading },\n entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },\n } = useTechDocsReaderPage();\n\n useEffect(() => {\n if (!metadata) return;\n setTitle(metadata.site_name);\n setSubtitle(() => {\n let { site_description } = metadata;\n if (!site_description || site_description === 'None') {\n site_description = '';\n }\n return site_description;\n });\n }, [metadata, setTitle, setSubtitle]);\n\n const appTitle = configApi.getOptional('app.title') || 'Backstage';\n const tabTitle = [title, subtitle, appTitle].filter(Boolean).join(' | ');\n\n const { locationMetadata, spec } = entityMetadata || {};\n const lifecycle = spec?.lifecycle;\n\n const ownedByRelations = entityMetadata\n ? getEntityRelations(entityMetadata, RELATION_OWNED_BY)\n : [];\n\n const docsRootLink = useRouteRef(rootRouteRef)();\n\n const labels = (\n <>\n <HeaderLabel\n label={capitalize(entityMetadata?.kind || 'entity')}\n value={\n <EntityRefLink\n color=\"inherit\"\n entityRef={entityRef}\n title={entityMetadata?.metadata.title}\n defaultKind=\"Component\"\n />\n }\n />\n {ownedByRelations.length > 0 && (\n <HeaderLabel\n label=\"Owner\"\n value={\n <EntityRefLinks\n color=\"inherit\"\n entityRefs={ownedByRelations}\n defaultKind=\"group\"\n />\n }\n />\n )}\n {lifecycle ? (\n <HeaderLabel label=\"Lifecycle\" value={String(lifecycle)} />\n ) : null}\n {locationMetadata &&\n locationMetadata.type !== 'dir' &&\n locationMetadata.type !== 'file' ? (\n <HeaderLabel\n label=\"\"\n value={\n <Grid container direction=\"column\" alignItems=\"center\">\n <Grid style={{ padding: 0 }} item>\n <CodeIcon style={{ marginTop: '-25px' }} />\n </Grid>\n <Grid style={{ padding: 0 }} item>\n Source\n </Grid>\n </Grid>\n }\n url={locationMetadata.target}\n />\n ) : null}\n </>\n );\n\n // If there is no entity or techdocs metadata, there's no reason to show the\n // header (hides the header on 404 error pages).\n const noEntMetadata = !entityMetadataLoading && entityMetadata === undefined;\n const noTdMetadata = !metadataLoading && metadata === undefined;\n if (noEntMetadata || noTdMetadata) return null;\n\n return (\n <Header\n type=\"Documentation\"\n typeLink={docsRootLink}\n title={title || skeleton}\n subtitle={subtitle === '' ? undefined : subtitle || skeleton}\n >\n <Helmet titleTemplate=\"%s\">\n <title>{tabTitle}</title>\n </Helmet>\n {labels}\n {children}\n {addons.renderComponentsByLocation(locations.Header)}\n </Header>\n );\n};\n"],"names":["locations"],"mappings":"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"}
|
|
@@ -70,7 +70,6 @@ function reducer(oldState, action) {
|
|
|
70
70
|
return newState;
|
|
71
71
|
}
|
|
72
72
|
function useReaderState(kind, namespace, name, path) {
|
|
73
|
-
var _a, _b;
|
|
74
73
|
const [state, dispatch] = useReducer(reducer, {
|
|
75
74
|
activeSyncState: "CHECKING",
|
|
76
75
|
path,
|
|
@@ -153,8 +152,8 @@ function useReaderState(kind, namespace, name, path) {
|
|
|
153
152
|
contentReload,
|
|
154
153
|
path: state.path,
|
|
155
154
|
content: state.content,
|
|
156
|
-
contentErrorMessage:
|
|
157
|
-
syncErrorMessage:
|
|
155
|
+
contentErrorMessage: state.contentError?.toString(),
|
|
156
|
+
syncErrorMessage: state.syncError?.toString(),
|
|
158
157
|
buildLog: state.buildLog
|
|
159
158
|
};
|
|
160
159
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useReaderState.esm.js","sources":["../../../src/reader/components/useReaderState.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useApi } from '@backstage/core-plugin-api';\nimport { useMemo, useReducer, useRef } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport useAsyncRetry from 'react-use/esm/useAsyncRetry';\nimport { techdocsStorageApiRef } from '@backstage/plugin-techdocs-react';\n\n/**\n * @public\n * A state representation that is used to configure the UI of <Reader />\n */\nexport type ContentStateTypes =\n /** There is nothing to display but a loading indicator */\n | 'CHECKING'\n\n /** There is no content yet -> present a full screen loading page */\n | 'INITIAL_BUILD'\n\n /** There is content, but the backend is about to update it */\n | 'CONTENT_STALE_REFRESHING'\n\n /** There is content, but after a reload, the content will be different */\n | 'CONTENT_STALE_READY'\n\n /** There is content, the backend tried to update it, but failed */\n | 'CONTENT_STALE_ERROR'\n\n /** There is nothing to see but a \"not found\" page. Is also shown on page load errors */\n | 'CONTENT_NOT_FOUND'\n\n /** There is only the latest and greatest content */\n | 'CONTENT_FRESH';\n\n/**\n * Calculate the state that should be reported to the display component.\n */\nexport function calculateDisplayState({\n contentLoading,\n content,\n activeSyncState,\n}: Pick<\n ReducerState,\n 'contentLoading' | 'content' | 'activeSyncState'\n>): ContentStateTypes {\n // we have nothing to display yet\n if (contentLoading) {\n return 'CHECKING';\n }\n\n // the build is ready, but it triggered a content reload and the content variable is not trusted\n if (activeSyncState === 'BUILD_READY_RELOAD') {\n return 'CHECKING';\n }\n\n // there is no content, but the sync process is still evaluating\n if (!content && activeSyncState === 'CHECKING') {\n return 'CHECKING';\n }\n\n // there is no content yet so we assume that we are building it for the first time\n if (!content && activeSyncState === 'BUILDING') {\n return 'INITIAL_BUILD';\n }\n\n // if there is still no content after building, it might just not exist\n if (!content) {\n return 'CONTENT_NOT_FOUND';\n }\n\n // we are still building, but we already show stale content\n if (activeSyncState === 'BUILDING') {\n return 'CONTENT_STALE_REFRESHING';\n }\n\n // the build is ready, but the content is still stale\n if (activeSyncState === 'BUILD_READY') {\n return 'CONTENT_STALE_READY';\n }\n\n // the build failed, but the content is still stale\n if (activeSyncState === 'ERROR') {\n return 'CONTENT_STALE_ERROR';\n }\n\n // seems like the content is up-to-date (or we don't know yet and the sync process is still evaluating in the background)\n return 'CONTENT_FRESH';\n}\n\n/**\n * The state of the synchronization task. It checks whether the docs are\n * up-to-date. If they aren't, it triggers a build.\n */\ntype SyncStates =\n /** Checking if it should be synced */\n | 'CHECKING'\n\n /** Building the documentation */\n | 'BUILDING'\n\n /** Finished building the documentation */\n | 'BUILD_READY'\n\n /**\n * Finished building the documentation and triggered a content reload.\n * This state is left toward UP_TO_DATE when the content loading has finished.\n */\n | 'BUILD_READY_RELOAD'\n\n /** No need for a sync. The content was already up-to-date. */\n | 'UP_TO_DATE'\n\n /** An error occurred */\n | 'ERROR';\n\ntype ReducerActions =\n | {\n type: 'sync';\n state: SyncStates;\n syncError?: Error;\n }\n | { type: 'contentLoading' }\n | {\n type: 'content';\n path?: string;\n content?: string;\n contentError?: Error;\n }\n | { type: 'buildLog'; log: string };\n\ntype ReducerState = {\n /**\n * The path of the current page\n */\n path: string;\n\n /**\n * The current sync state\n */\n activeSyncState: SyncStates;\n\n /**\n * If true, the content is downloading from the storage.\n */\n contentLoading: boolean;\n /**\n * The content that has been downloaded and should be displayed.\n */\n content?: string;\n\n contentError?: Error;\n syncError?: Error;\n\n /**\n * A list of log messages that were emitted by the build process.\n */\n buildLog: string[];\n};\n\nexport function reducer(\n oldState: ReducerState,\n action: ReducerActions,\n): ReducerState {\n const newState = { ...oldState };\n\n switch (action.type) {\n case 'sync':\n // reset the build log when a new check starts\n if (action.state === 'CHECKING') {\n newState.buildLog = [];\n }\n\n newState.activeSyncState = action.state;\n newState.syncError = action.syncError;\n break;\n\n case 'contentLoading':\n newState.contentLoading = true;\n\n // only reset errors but keep the old content until it is replaced by the 'content' action\n newState.contentError = undefined;\n break;\n\n case 'content':\n // only override the path if it is part of the action\n if (typeof action.path === 'string') {\n newState.path = action.path;\n }\n\n newState.contentLoading = false;\n newState.content = action.content;\n newState.contentError = action.contentError;\n break;\n\n case 'buildLog':\n newState.buildLog = newState.buildLog.concat(action.log);\n break;\n\n default:\n throw new Error();\n }\n\n // a content update loads fresh content so the build is updated to being up-to-date\n if (\n ['BUILD_READY', 'BUILD_READY_RELOAD'].includes(newState.activeSyncState) &&\n ['contentLoading', 'content'].includes(action.type)\n ) {\n newState.activeSyncState = 'UP_TO_DATE';\n newState.buildLog = [];\n }\n\n return newState;\n}\n/**\n * @public shared reader state\n */\nexport type ReaderState = {\n state: ContentStateTypes;\n path: string;\n contentReload: () => void;\n content?: string;\n contentErrorMessage?: string;\n syncErrorMessage?: string;\n buildLog: string[];\n};\n\nexport function useReaderState(\n kind: string,\n namespace: string,\n name: string,\n path: string,\n): ReaderState {\n const [state, dispatch] = useReducer(reducer, {\n activeSyncState: 'CHECKING',\n path,\n contentLoading: true,\n buildLog: [],\n });\n\n const techdocsStorageApi = useApi(techdocsStorageApiRef);\n\n // try to load the content. the function will fire events and we don't care for the return values\n const { retry: contentReload } = useAsyncRetry(async () => {\n dispatch({ type: 'contentLoading' });\n\n try {\n const entityDocs = await techdocsStorageApi.getEntityDocs(\n { kind, namespace, name },\n path,\n );\n\n // update content and path at the same time\n dispatch({ type: 'content', content: entityDocs, path });\n\n return entityDocs;\n } catch (e) {\n dispatch({ type: 'content', contentError: e, path });\n }\n\n return undefined;\n }, [techdocsStorageApi, kind, namespace, name, path]);\n\n // create a ref that holds the latest content. This provides a useAsync hook\n // with the latest content without restarting the useAsync hook.\n const contentRef = useRef<{ content?: string; reload: () => void }>({\n content: undefined,\n reload: () => {},\n });\n contentRef.current = { content: state.content, reload: contentReload };\n\n // try to derive the state. the function will fire events and we don't care for the return values\n useAsync(async () => {\n dispatch({ type: 'sync', state: 'CHECKING' });\n\n // should only switch to BUILDING if the request takes more than 1 seconds\n const buildingTimeout = setTimeout(() => {\n dispatch({ type: 'sync', state: 'BUILDING' });\n }, 1000);\n\n try {\n const result = await techdocsStorageApi.syncEntityDocs(\n {\n kind,\n namespace,\n name,\n },\n log => {\n dispatch({ type: 'buildLog', log });\n },\n );\n\n switch (result) {\n case 'updated':\n // if there was no content prior to building, retry the loading\n if (!contentRef.current.content) {\n contentRef.current.reload();\n dispatch({ type: 'sync', state: 'BUILD_READY_RELOAD' });\n } else {\n dispatch({ type: 'sync', state: 'BUILD_READY' });\n }\n break;\n case 'cached':\n dispatch({ type: 'sync', state: 'UP_TO_DATE' });\n break;\n\n default:\n dispatch({\n type: 'sync',\n state: 'ERROR',\n syncError: new Error('Unexpected return state'),\n });\n break;\n }\n } catch (e) {\n dispatch({ type: 'sync', state: 'ERROR', syncError: e });\n } finally {\n // Cancel the timer that sets the state \"BUILDING\"\n clearTimeout(buildingTimeout);\n }\n }, [kind, name, namespace, techdocsStorageApi, dispatch, contentRef]);\n\n const displayState = useMemo(\n () =>\n calculateDisplayState({\n activeSyncState: state.activeSyncState,\n contentLoading: state.contentLoading,\n content: state.content,\n }),\n [state.activeSyncState, state.content, state.contentLoading],\n );\n\n return {\n state: displayState,\n contentReload,\n path: state.path,\n content: state.content,\n contentErrorMessage: state.contentError?.toString(),\n syncErrorMessage: state.syncError?.toString(),\n buildLog: state.buildLog,\n };\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useReaderState.esm.js","sources":["../../../src/reader/components/useReaderState.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useApi } from '@backstage/core-plugin-api';\nimport { useMemo, useReducer, useRef } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport useAsyncRetry from 'react-use/esm/useAsyncRetry';\nimport { techdocsStorageApiRef } from '@backstage/plugin-techdocs-react';\n\n/**\n * @public\n * A state representation that is used to configure the UI of <Reader />\n */\nexport type ContentStateTypes =\n /** There is nothing to display but a loading indicator */\n | 'CHECKING'\n\n /** There is no content yet -> present a full screen loading page */\n | 'INITIAL_BUILD'\n\n /** There is content, but the backend is about to update it */\n | 'CONTENT_STALE_REFRESHING'\n\n /** There is content, but after a reload, the content will be different */\n | 'CONTENT_STALE_READY'\n\n /** There is content, the backend tried to update it, but failed */\n | 'CONTENT_STALE_ERROR'\n\n /** There is nothing to see but a \"not found\" page. Is also shown on page load errors */\n | 'CONTENT_NOT_FOUND'\n\n /** There is only the latest and greatest content */\n | 'CONTENT_FRESH';\n\n/**\n * Calculate the state that should be reported to the display component.\n */\nexport function calculateDisplayState({\n contentLoading,\n content,\n activeSyncState,\n}: Pick<\n ReducerState,\n 'contentLoading' | 'content' | 'activeSyncState'\n>): ContentStateTypes {\n // we have nothing to display yet\n if (contentLoading) {\n return 'CHECKING';\n }\n\n // the build is ready, but it triggered a content reload and the content variable is not trusted\n if (activeSyncState === 'BUILD_READY_RELOAD') {\n return 'CHECKING';\n }\n\n // there is no content, but the sync process is still evaluating\n if (!content && activeSyncState === 'CHECKING') {\n return 'CHECKING';\n }\n\n // there is no content yet so we assume that we are building it for the first time\n if (!content && activeSyncState === 'BUILDING') {\n return 'INITIAL_BUILD';\n }\n\n // if there is still no content after building, it might just not exist\n if (!content) {\n return 'CONTENT_NOT_FOUND';\n }\n\n // we are still building, but we already show stale content\n if (activeSyncState === 'BUILDING') {\n return 'CONTENT_STALE_REFRESHING';\n }\n\n // the build is ready, but the content is still stale\n if (activeSyncState === 'BUILD_READY') {\n return 'CONTENT_STALE_READY';\n }\n\n // the build failed, but the content is still stale\n if (activeSyncState === 'ERROR') {\n return 'CONTENT_STALE_ERROR';\n }\n\n // seems like the content is up-to-date (or we don't know yet and the sync process is still evaluating in the background)\n return 'CONTENT_FRESH';\n}\n\n/**\n * The state of the synchronization task. It checks whether the docs are\n * up-to-date. If they aren't, it triggers a build.\n */\ntype SyncStates =\n /** Checking if it should be synced */\n | 'CHECKING'\n\n /** Building the documentation */\n | 'BUILDING'\n\n /** Finished building the documentation */\n | 'BUILD_READY'\n\n /**\n * Finished building the documentation and triggered a content reload.\n * This state is left toward UP_TO_DATE when the content loading has finished.\n */\n | 'BUILD_READY_RELOAD'\n\n /** No need for a sync. The content was already up-to-date. */\n | 'UP_TO_DATE'\n\n /** An error occurred */\n | 'ERROR';\n\ntype ReducerActions =\n | {\n type: 'sync';\n state: SyncStates;\n syncError?: Error;\n }\n | { type: 'contentLoading' }\n | {\n type: 'content';\n path?: string;\n content?: string;\n contentError?: Error;\n }\n | { type: 'buildLog'; log: string };\n\ntype ReducerState = {\n /**\n * The path of the current page\n */\n path: string;\n\n /**\n * The current sync state\n */\n activeSyncState: SyncStates;\n\n /**\n * If true, the content is downloading from the storage.\n */\n contentLoading: boolean;\n /**\n * The content that has been downloaded and should be displayed.\n */\n content?: string;\n\n contentError?: Error;\n syncError?: Error;\n\n /**\n * A list of log messages that were emitted by the build process.\n */\n buildLog: string[];\n};\n\nexport function reducer(\n oldState: ReducerState,\n action: ReducerActions,\n): ReducerState {\n const newState = { ...oldState };\n\n switch (action.type) {\n case 'sync':\n // reset the build log when a new check starts\n if (action.state === 'CHECKING') {\n newState.buildLog = [];\n }\n\n newState.activeSyncState = action.state;\n newState.syncError = action.syncError;\n break;\n\n case 'contentLoading':\n newState.contentLoading = true;\n\n // only reset errors but keep the old content until it is replaced by the 'content' action\n newState.contentError = undefined;\n break;\n\n case 'content':\n // only override the path if it is part of the action\n if (typeof action.path === 'string') {\n newState.path = action.path;\n }\n\n newState.contentLoading = false;\n newState.content = action.content;\n newState.contentError = action.contentError;\n break;\n\n case 'buildLog':\n newState.buildLog = newState.buildLog.concat(action.log);\n break;\n\n default:\n throw new Error();\n }\n\n // a content update loads fresh content so the build is updated to being up-to-date\n if (\n ['BUILD_READY', 'BUILD_READY_RELOAD'].includes(newState.activeSyncState) &&\n ['contentLoading', 'content'].includes(action.type)\n ) {\n newState.activeSyncState = 'UP_TO_DATE';\n newState.buildLog = [];\n }\n\n return newState;\n}\n/**\n * @public shared reader state\n */\nexport type ReaderState = {\n state: ContentStateTypes;\n path: string;\n contentReload: () => void;\n content?: string;\n contentErrorMessage?: string;\n syncErrorMessage?: string;\n buildLog: string[];\n};\n\nexport function useReaderState(\n kind: string,\n namespace: string,\n name: string,\n path: string,\n): ReaderState {\n const [state, dispatch] = useReducer(reducer, {\n activeSyncState: 'CHECKING',\n path,\n contentLoading: true,\n buildLog: [],\n });\n\n const techdocsStorageApi = useApi(techdocsStorageApiRef);\n\n // try to load the content. the function will fire events and we don't care for the return values\n const { retry: contentReload } = useAsyncRetry(async () => {\n dispatch({ type: 'contentLoading' });\n\n try {\n const entityDocs = await techdocsStorageApi.getEntityDocs(\n { kind, namespace, name },\n path,\n );\n\n // update content and path at the same time\n dispatch({ type: 'content', content: entityDocs, path });\n\n return entityDocs;\n } catch (e) {\n dispatch({ type: 'content', contentError: e, path });\n }\n\n return undefined;\n }, [techdocsStorageApi, kind, namespace, name, path]);\n\n // create a ref that holds the latest content. This provides a useAsync hook\n // with the latest content without restarting the useAsync hook.\n const contentRef = useRef<{ content?: string; reload: () => void }>({\n content: undefined,\n reload: () => {},\n });\n contentRef.current = { content: state.content, reload: contentReload };\n\n // try to derive the state. the function will fire events and we don't care for the return values\n useAsync(async () => {\n dispatch({ type: 'sync', state: 'CHECKING' });\n\n // should only switch to BUILDING if the request takes more than 1 seconds\n const buildingTimeout = setTimeout(() => {\n dispatch({ type: 'sync', state: 'BUILDING' });\n }, 1000);\n\n try {\n const result = await techdocsStorageApi.syncEntityDocs(\n {\n kind,\n namespace,\n name,\n },\n log => {\n dispatch({ type: 'buildLog', log });\n },\n );\n\n switch (result) {\n case 'updated':\n // if there was no content prior to building, retry the loading\n if (!contentRef.current.content) {\n contentRef.current.reload();\n dispatch({ type: 'sync', state: 'BUILD_READY_RELOAD' });\n } else {\n dispatch({ type: 'sync', state: 'BUILD_READY' });\n }\n break;\n case 'cached':\n dispatch({ type: 'sync', state: 'UP_TO_DATE' });\n break;\n\n default:\n dispatch({\n type: 'sync',\n state: 'ERROR',\n syncError: new Error('Unexpected return state'),\n });\n break;\n }\n } catch (e) {\n dispatch({ type: 'sync', state: 'ERROR', syncError: e });\n } finally {\n // Cancel the timer that sets the state \"BUILDING\"\n clearTimeout(buildingTimeout);\n }\n }, [kind, name, namespace, techdocsStorageApi, dispatch, contentRef]);\n\n const displayState = useMemo(\n () =>\n calculateDisplayState({\n activeSyncState: state.activeSyncState,\n contentLoading: state.contentLoading,\n content: state.content,\n }),\n [state.activeSyncState, state.content, state.contentLoading],\n );\n\n return {\n state: displayState,\n contentReload,\n path: state.path,\n content: state.content,\n contentErrorMessage: state.contentError?.toString(),\n syncErrorMessage: state.syncError?.toString(),\n buildLog: state.buildLog,\n };\n}\n"],"names":[],"mappings":";;;;;;AAmDO,SAAS,qBAAsB,CAAA;AAAA,EACpC,cAAA;AAAA,EACA,OAAA;AAAA,EACA,eAAA;AACF,CAGsB,EAAA;AAEpB,EAAA,IAAI,cAAgB,EAAA;AAClB,IAAO,OAAA,UAAA,CAAA;AAAA,GACT;AAGA,EAAA,IAAI,oBAAoB,oBAAsB,EAAA;AAC5C,IAAO,OAAA,UAAA,CAAA;AAAA,GACT;AAGA,EAAI,IAAA,CAAC,OAAW,IAAA,eAAA,KAAoB,UAAY,EAAA;AAC9C,IAAO,OAAA,UAAA,CAAA;AAAA,GACT;AAGA,EAAI,IAAA,CAAC,OAAW,IAAA,eAAA,KAAoB,UAAY,EAAA;AAC9C,IAAO,OAAA,eAAA,CAAA;AAAA,GACT;AAGA,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAO,OAAA,mBAAA,CAAA;AAAA,GACT;AAGA,EAAA,IAAI,oBAAoB,UAAY,EAAA;AAClC,IAAO,OAAA,0BAAA,CAAA;AAAA,GACT;AAGA,EAAA,IAAI,oBAAoB,aAAe,EAAA;AACrC,IAAO,OAAA,qBAAA,CAAA;AAAA,GACT;AAGA,EAAA,IAAI,oBAAoB,OAAS,EAAA;AAC/B,IAAO,OAAA,qBAAA,CAAA;AAAA,GACT;AAGA,EAAO,OAAA,eAAA,CAAA;AACT,CAAA;AAwEgB,SAAA,OAAA,CACd,UACA,MACc,EAAA;AACd,EAAM,MAAA,QAAA,GAAW,EAAE,GAAG,QAAS,EAAA,CAAA;AAE/B,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,MAAA;AAEH,MAAI,IAAA,MAAA,CAAO,UAAU,UAAY,EAAA;AAC/B,QAAA,QAAA,CAAS,WAAW,EAAC,CAAA;AAAA,OACvB;AAEA,MAAA,QAAA,CAAS,kBAAkB,MAAO,CAAA,KAAA,CAAA;AAClC,MAAA,QAAA,CAAS,YAAY,MAAO,CAAA,SAAA,CAAA;AAC5B,MAAA,MAAA;AAAA,IAEF,KAAK,gBAAA;AACH,MAAA,QAAA,CAAS,cAAiB,GAAA,IAAA,CAAA;AAG1B,MAAA,QAAA,CAAS,YAAe,GAAA,KAAA,CAAA,CAAA;AACxB,MAAA,MAAA;AAAA,IAEF,KAAK,SAAA;AAEH,MAAI,IAAA,OAAO,MAAO,CAAA,IAAA,KAAS,QAAU,EAAA;AACnC,QAAA,QAAA,CAAS,OAAO,MAAO,CAAA,IAAA,CAAA;AAAA,OACzB;AAEA,MAAA,QAAA,CAAS,cAAiB,GAAA,KAAA,CAAA;AAC1B,MAAA,QAAA,CAAS,UAAU,MAAO,CAAA,OAAA,CAAA;AAC1B,MAAA,QAAA,CAAS,eAAe,MAAO,CAAA,YAAA,CAAA;AAC/B,MAAA,MAAA;AAAA,IAEF,KAAK,UAAA;AACH,MAAA,QAAA,CAAS,QAAW,GAAA,QAAA,CAAS,QAAS,CAAA,MAAA,CAAO,OAAO,GAAG,CAAA,CAAA;AACvD,MAAA,MAAA;AAAA,IAEF;AACE,MAAA,MAAM,IAAI,KAAM,EAAA,CAAA;AAAA,GACpB;AAGA,EAAA,IACE,CAAC,aAAA,EAAe,oBAAoB,CAAA,CAAE,SAAS,QAAS,CAAA,eAAe,CACvE,IAAA,CAAC,kBAAkB,SAAS,CAAA,CAAE,QAAS,CAAA,MAAA,CAAO,IAAI,CAClD,EAAA;AACA,IAAA,QAAA,CAAS,eAAkB,GAAA,YAAA,CAAA;AAC3B,IAAA,QAAA,CAAS,WAAW,EAAC,CAAA;AAAA,GACvB;AAEA,EAAO,OAAA,QAAA,CAAA;AACT,CAAA;AAcO,SAAS,cACd,CAAA,IAAA,EACA,SACA,EAAA,IAAA,EACA,IACa,EAAA;AACb,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,WAAW,OAAS,EAAA;AAAA,IAC5C,eAAiB,EAAA,UAAA;AAAA,IACjB,IAAA;AAAA,IACA,cAAgB,EAAA,IAAA;AAAA,IAChB,UAAU,EAAC;AAAA,GACZ,CAAA,CAAA;AAED,EAAM,MAAA,kBAAA,GAAqB,OAAO,qBAAqB,CAAA,CAAA;AAGvD,EAAA,MAAM,EAAE,KAAA,EAAO,aAAc,EAAA,GAAI,cAAc,YAAY;AACzD,IAAS,QAAA,CAAA,EAAE,IAAM,EAAA,gBAAA,EAAkB,CAAA,CAAA;AAEnC,IAAI,IAAA;AACF,MAAM,MAAA,UAAA,GAAa,MAAM,kBAAmB,CAAA,aAAA;AAAA,QAC1C,EAAE,IAAM,EAAA,SAAA,EAAW,IAAK,EAAA;AAAA,QACxB,IAAA;AAAA,OACF,CAAA;AAGA,MAAA,QAAA,CAAS,EAAE,IAAM,EAAA,SAAA,EAAW,OAAS,EAAA,UAAA,EAAY,MAAM,CAAA,CAAA;AAEvD,MAAO,OAAA,UAAA,CAAA;AAAA,aACA,CAAG,EAAA;AACV,MAAA,QAAA,CAAS,EAAE,IAAM,EAAA,SAAA,EAAW,YAAc,EAAA,CAAA,EAAG,MAAM,CAAA,CAAA;AAAA,KACrD;AAEA,IAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACN,CAAC,kBAAA,EAAoB,MAAM,SAAW,EAAA,IAAA,EAAM,IAAI,CAAC,CAAA,CAAA;AAIpD,EAAA,MAAM,aAAa,MAAiD,CAAA;AAAA,IAClE,OAAS,EAAA,KAAA,CAAA;AAAA,IACT,QAAQ,MAAM;AAAA,KAAC;AAAA,GAChB,CAAA,CAAA;AACD,EAAA,UAAA,CAAW,UAAU,EAAE,OAAA,EAAS,KAAM,CAAA,OAAA,EAAS,QAAQ,aAAc,EAAA,CAAA;AAGrE,EAAA,QAAA,CAAS,YAAY;AACnB,IAAA,QAAA,CAAS,EAAE,IAAA,EAAM,MAAQ,EAAA,KAAA,EAAO,YAAY,CAAA,CAAA;AAG5C,IAAM,MAAA,eAAA,GAAkB,WAAW,MAAM;AACvC,MAAA,QAAA,CAAS,EAAE,IAAA,EAAM,MAAQ,EAAA,KAAA,EAAO,YAAY,CAAA,CAAA;AAAA,OAC3C,GAAI,CAAA,CAAA;AAEP,IAAI,IAAA;AACF,MAAM,MAAA,MAAA,GAAS,MAAM,kBAAmB,CAAA,cAAA;AAAA,QACtC;AAAA,UACE,IAAA;AAAA,UACA,SAAA;AAAA,UACA,IAAA;AAAA,SACF;AAAA,QACA,CAAO,GAAA,KAAA;AACL,UAAA,QAAA,CAAS,EAAE,IAAA,EAAM,UAAY,EAAA,GAAA,EAAK,CAAA,CAAA;AAAA,SACpC;AAAA,OACF,CAAA;AAEA,MAAA,QAAQ,MAAQ;AAAA,QACd,KAAK,SAAA;AAEH,UAAI,IAAA,CAAC,UAAW,CAAA,OAAA,CAAQ,OAAS,EAAA;AAC/B,YAAA,UAAA,CAAW,QAAQ,MAAO,EAAA,CAAA;AAC1B,YAAA,QAAA,CAAS,EAAE,IAAA,EAAM,MAAQ,EAAA,KAAA,EAAO,sBAAsB,CAAA,CAAA;AAAA,WACjD,MAAA;AACL,YAAA,QAAA,CAAS,EAAE,IAAA,EAAM,MAAQ,EAAA,KAAA,EAAO,eAAe,CAAA,CAAA;AAAA,WACjD;AACA,UAAA,MAAA;AAAA,QACF,KAAK,QAAA;AACH,UAAA,QAAA,CAAS,EAAE,IAAA,EAAM,MAAQ,EAAA,KAAA,EAAO,cAAc,CAAA,CAAA;AAC9C,UAAA,MAAA;AAAA,QAEF;AACE,UAAS,QAAA,CAAA;AAAA,YACP,IAAM,EAAA,MAAA;AAAA,YACN,KAAO,EAAA,OAAA;AAAA,YACP,SAAA,EAAW,IAAI,KAAA,CAAM,yBAAyB,CAAA;AAAA,WAC/C,CAAA,CAAA;AACD,UAAA,MAAA;AAAA,OACJ;AAAA,aACO,CAAG,EAAA;AACV,MAAA,QAAA,CAAS,EAAE,IAAM,EAAA,MAAA,EAAQ,OAAO,OAAS,EAAA,SAAA,EAAW,GAAG,CAAA,CAAA;AAAA,KACvD,SAAA;AAEA,MAAA,YAAA,CAAa,eAAe,CAAA,CAAA;AAAA,KAC9B;AAAA,GACF,EAAG,CAAC,IAAM,EAAA,IAAA,EAAM,WAAW,kBAAoB,EAAA,QAAA,EAAU,UAAU,CAAC,CAAA,CAAA;AAEpE,EAAA,MAAM,YAAe,GAAA,OAAA;AAAA,IACnB,MACE,qBAAsB,CAAA;AAAA,MACpB,iBAAiB,KAAM,CAAA,eAAA;AAAA,MACvB,gBAAgB,KAAM,CAAA,cAAA;AAAA,MACtB,SAAS,KAAM,CAAA,OAAA;AAAA,KAChB,CAAA;AAAA,IACH,CAAC,KAAM,CAAA,eAAA,EAAiB,KAAM,CAAA,OAAA,EAAS,MAAM,cAAc,CAAA;AAAA,GAC7D,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,KAAO,EAAA,YAAA;AAAA,IACP,aAAA;AAAA,IACA,MAAM,KAAM,CAAA,IAAA;AAAA,IACZ,SAAS,KAAM,CAAA,OAAA;AAAA,IACf,mBAAA,EAAqB,KAAM,CAAA,YAAA,EAAc,QAAS,EAAA;AAAA,IAClD,gBAAA,EAAkB,KAAM,CAAA,SAAA,EAAW,QAAS,EAAA;AAAA,IAC5C,UAAU,KAAM,CAAA,QAAA;AAAA,GAClB,CAAA;AACF;;;;"}
|