@backstage/plugin-home 0.4.13 → 0.4.14-next.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @backstage/plugin-home
 
+## 0.4.14-next.0
+
+### Patch Changes
+
+- a4a777441d: Adds new StarredEntities component responsible for rendering a list of starred entities on the home page
+- Updated dependencies
+  - @backstage/core-components@0.8.8-next.0
+  - @backstage/plugin-search@0.6.2-next.0
+  - @backstage/plugin-catalog-react@0.6.14-next.0
+
 ## 0.4.13
 
 ### Patch Changes

package/dist/esm/{index-405b0ea2.esm.js → index-bce831c1.esm.js}

@@ -14,4 +14,4 @@ const HomepageCompositionRoot = (props) => {
 };
 
 export { HomepageCompositionRoot };
-//# sourceMappingURL=index-405b0ea2.esm.js.map
+//# sourceMappingURL=index-bce831c1.esm.js.map

package/dist/esm/{index-405b0ea2.esm.js.map → index-bce831c1.esm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-405b0ea2.esm.js","sources":["../../src/components/HomepageCompositionRoot.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, { ReactNode } from 'react';\nimport { useOutlet } from 'react-router';\n\nexport const HomepageCompositionRoot = (props: {\n  title?: string;\n  children?: ReactNode;\n}) => {\n  const outlet = useOutlet();\n  const children = props.children ?? outlet;\n  return <>{children}</>;\n};\n"],"names":[],"mappings":";;;;;;;;MAmBa,0BAA0B,CAAC,UAGlC;AAtBN;AAuBE,QAAM,SAAS;AACf,QAAM,WAAW,YAAM,aAAN,YAAkB;AACnC,mEAAU;AAAA;;;;"}
+{"version":3,"file":"index-bce831c1.esm.js","sources":["../../src/components/HomepageCompositionRoot.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, { ReactNode } from 'react';\nimport { useOutlet } from 'react-router';\n\nexport const HomepageCompositionRoot = (props: {\n  title?: string;\n  children?: ReactNode;\n}) => {\n  const outlet = useOutlet();\n  const children = props.children ?? outlet;\n  return <>{children}</>;\n};\n"],"names":[],"mappings":";;;;;;;;MAmBa,0BAA0B,CAAC,UAGlC;AAtBN;AAuBE,QAAM,SAAS;AACf,QAAM,WAAW,YAAM,aAAN,YAAkB;AACnC,mEAAU;AAAA;;;;"}

package/dist/esm/{index-eddf0731.esm.js → index-f319937c.esm.js}

@@ -80,4 +80,4 @@ const ComponentTab = ({
 };
 
 export { ComponentAccordion, ComponentTab, ComponentTabs };
-//# sourceMappingURL=index-eddf0731.esm.js.map
+//# sourceMappingURL=index-f319937c.esm.js.map

package/dist/esm/{index-eddf0731.esm.js.map → index-f319937c.esm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-eddf0731.esm.js","sources":["../../src/componentRenderers/ComponentAccordion.tsx","../../src/componentRenderers/ComponentTabs/ComponentTabs.tsx","../../src/componentRenderers/ComponentTabs/ComponentTab.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';\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Typography,\n  IconButton,\n  Theme,\n} from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport SettingsIcon from '@material-ui/icons/Settings';\n\nimport { SettingsModal } from '../components';\n\nconst useStyles = makeStyles((theme: Theme) => ({\n  settingsIconButton: {\n    padding: theme.spacing(0, 1, 0, 0),\n  },\n}));\n\nexport const ComponentAccordion = ({\n  title,\n  Content,\n  Actions,\n  Settings,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  const classes = useStyles();\n  const [settingsIsExpanded, setSettingsIsExpanded] = React.useState(false);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n\n  const handleOpenSettings = (e: any) => {\n    e.stopPropagation();\n    setSettingsIsExpanded(prevState => !prevState);\n  };\n\n  const innerContent = (\n    <>\n      {Settings && (\n        <SettingsModal\n          open={settingsIsExpanded}\n          close={() => setSettingsIsExpanded(false)}\n          componentName={title}\n        >\n          <Settings />\n        </SettingsModal>\n      )}\n      <Accordion\n        expanded={isExpanded}\n        onChange={(_e: any, expanded: boolean) => setIsExpanded(expanded)}\n      >\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          {Settings && (\n            <IconButton\n              onClick={handleOpenSettings}\n              className={classes.settingsIconButton}\n            >\n              <SettingsIcon />\n            </IconButton>\n          )}\n          <Typography>{title}</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <div>\n            <Content />\n            {Actions && <Actions />}\n          </div>\n        </AccordionDetails>\n      </Accordion>\n    </>\n  );\n\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>{innerContent}</ContextProvider>\n  ) : (\n    innerContent\n  );\n};\n","/*\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';\nimport { Tabs, Tab } from '@material-ui/core';\nimport { InfoCard } from '@backstage/core-components';\n\ntype TabType = {\n  label: string;\n  Component: () => JSX.Element;\n};\n\nexport const ComponentTabs = ({\n  title,\n  tabs,\n}: {\n  title: string;\n  tabs: TabType[];\n}) => {\n  const [value, setValue] = React.useState(0);\n\n  const handleChange = (_event: any, newValue: number) => {\n    setValue(newValue);\n  };\n\n  return (\n    <InfoCard title={title}>\n      <Tabs value={value} onChange={handleChange}>\n        {tabs.map(t => (\n          <Tab key={t.label} label={t.label} />\n        ))}\n      </Tabs>\n      {tabs.map(({ Component }, idx) => (\n        <div\n          key={idx}\n          {...(idx !== value ? { style: { display: 'none' } } : {})}\n        >\n          <Component />\n        </div>\n      ))}\n    </InfoCard>\n  );\n};\n","/*\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\nexport const ComponentTab = ({\n  title,\n  Content,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>\n      <Content />\n    </ContextProvider>\n  ) : (\n    <Content />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AA+BA,MAAM,YAAY,WAAW,CAAC;AAAkB,EAC9C,oBAAoB;AAAA,IAClB,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG;AAAA;AAAA;MAIvB,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAOC;AACJ,QAAM,UAAU;AAChB,QAAM,CAAC,oBAAoB,yBAAyB,MAAM,SAAS;AACnE,QAAM,CAAC,YAAY,iBAAiB,MAAM,SAAS;AAEnD,QAAM,qBAAqB,CAAC,MAAW;AACrC,MAAE;AACF,0BAAsB,eAAa,CAAC;AAAA;AAGtC,QAAM,yEAED,gDACE,eAAD;AAAA,IACE,MAAM;AAAA,IACN,OAAO,MAAM,sBAAsB;AAAA,IACnC,eAAe;AAAA,yCAEd,UAAD,4CAGH,WAAD;AAAA,IACE,UAAU;AAAA,IACV,UAAU,CAAC,IAAS,aAAsB,cAAc;AAAA,yCAEvD,kBAAD;AAAA,IAAkB,gDAAa,gBAAD;AAAA,KAC3B,gDACE,YAAD;AAAA,IACE,SAAS;AAAA,IACT,WAAW,QAAQ;AAAA,yCAElB,cAAD,4CAGH,YAAD,MAAa,6CAEd,kBAAD,0CACG,OAAD,0CACG,SAAD,OACC,+CAAY,SAAD;AAOtB,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,KAAa,gBAElC;AAAA;;MC1ES,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,CAAC,OAAO,YAAY,MAAM,SAAS;AAEzC,QAAM,eAAe,CAAC,QAAa,aAAqB;AACtD,aAAS;AAAA;AAGX,6CACG,UAAD;AAAA,IAAU;AAAA,yCACP,MAAD;AAAA,IAAM;AAAA,IAAc,UAAU;AAAA,KAC3B,KAAK,IAAI,2CACP,KAAD;AAAA,IAAK,KAAK,EAAE;AAAA,IAAO,OAAO,EAAE;AAAA,QAG/B,KAAK,IAAI,CAAC,EAAE,aAAa,4CACvB,OAAD;AAAA,IACE,KAAK;AAAA,OACA,QAAQ,QAAQ,EAAE,OAAO,EAAE,SAAS,aAAa;AAAA,yCAErD,WAAD;AAAA;;MChCG,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAKC;AACJ,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,yCAClB,SAAD,6CAGD,SAAD;AAAA;;;;"}
+{"version":3,"file":"index-f319937c.esm.js","sources":["../../src/componentRenderers/ComponentAccordion.tsx","../../src/componentRenderers/ComponentTabs/ComponentTabs.tsx","../../src/componentRenderers/ComponentTabs/ComponentTab.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';\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Typography,\n  IconButton,\n  Theme,\n} from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport SettingsIcon from '@material-ui/icons/Settings';\n\nimport { SettingsModal } from '../components';\n\nconst useStyles = makeStyles((theme: Theme) => ({\n  settingsIconButton: {\n    padding: theme.spacing(0, 1, 0, 0),\n  },\n}));\n\nexport const ComponentAccordion = ({\n  title,\n  Content,\n  Actions,\n  Settings,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  const classes = useStyles();\n  const [settingsIsExpanded, setSettingsIsExpanded] = React.useState(false);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n\n  const handleOpenSettings = (e: any) => {\n    e.stopPropagation();\n    setSettingsIsExpanded(prevState => !prevState);\n  };\n\n  const innerContent = (\n    <>\n      {Settings && (\n        <SettingsModal\n          open={settingsIsExpanded}\n          close={() => setSettingsIsExpanded(false)}\n          componentName={title}\n        >\n          <Settings />\n        </SettingsModal>\n      )}\n      <Accordion\n        expanded={isExpanded}\n        onChange={(_e: any, expanded: boolean) => setIsExpanded(expanded)}\n      >\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          {Settings && (\n            <IconButton\n              onClick={handleOpenSettings}\n              className={classes.settingsIconButton}\n            >\n              <SettingsIcon />\n            </IconButton>\n          )}\n          <Typography>{title}</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <div>\n            <Content />\n            {Actions && <Actions />}\n          </div>\n        </AccordionDetails>\n      </Accordion>\n    </>\n  );\n\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>{innerContent}</ContextProvider>\n  ) : (\n    innerContent\n  );\n};\n","/*\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';\nimport { Tabs, Tab } from '@material-ui/core';\nimport { InfoCard } from '@backstage/core-components';\n\ntype TabType = {\n  label: string;\n  Component: () => JSX.Element;\n};\n\nexport const ComponentTabs = ({\n  title,\n  tabs,\n}: {\n  title: string;\n  tabs: TabType[];\n}) => {\n  const [value, setValue] = React.useState(0);\n\n  const handleChange = (_event: any, newValue: number) => {\n    setValue(newValue);\n  };\n\n  return (\n    <InfoCard title={title}>\n      <Tabs value={value} onChange={handleChange}>\n        {tabs.map(t => (\n          <Tab key={t.label} label={t.label} />\n        ))}\n      </Tabs>\n      {tabs.map(({ Component }, idx) => (\n        <div\n          key={idx}\n          {...(idx !== value ? { style: { display: 'none' } } : {})}\n        >\n          <Component />\n        </div>\n      ))}\n    </InfoCard>\n  );\n};\n","/*\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\nexport const ComponentTab = ({\n  title,\n  Content,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>\n      <Content />\n    </ContextProvider>\n  ) : (\n    <Content />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AA+BA,MAAM,YAAY,WAAW,CAAC;AAAkB,EAC9C,oBAAoB;AAAA,IAClB,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG;AAAA;AAAA;MAIvB,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAOC;AACJ,QAAM,UAAU;AAChB,QAAM,CAAC,oBAAoB,yBAAyB,MAAM,SAAS;AACnE,QAAM,CAAC,YAAY,iBAAiB,MAAM,SAAS;AAEnD,QAAM,qBAAqB,CAAC,MAAW;AACrC,MAAE;AACF,0BAAsB,eAAa,CAAC;AAAA;AAGtC,QAAM,yEAED,gDACE,eAAD;AAAA,IACE,MAAM;AAAA,IACN,OAAO,MAAM,sBAAsB;AAAA,IACnC,eAAe;AAAA,yCAEd,UAAD,4CAGH,WAAD;AAAA,IACE,UAAU;AAAA,IACV,UAAU,CAAC,IAAS,aAAsB,cAAc;AAAA,yCAEvD,kBAAD;AAAA,IAAkB,gDAAa,gBAAD;AAAA,KAC3B,gDACE,YAAD;AAAA,IACE,SAAS;AAAA,IACT,WAAW,QAAQ;AAAA,yCAElB,cAAD,4CAGH,YAAD,MAAa,6CAEd,kBAAD,0CACG,OAAD,0CACG,SAAD,OACC,+CAAY,SAAD;AAOtB,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,KAAa,gBAElC;AAAA;;MC1ES,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,CAAC,OAAO,YAAY,MAAM,SAAS;AAEzC,QAAM,eAAe,CAAC,QAAa,aAAqB;AACtD,aAAS;AAAA;AAGX,6CACG,UAAD;AAAA,IAAU;AAAA,yCACP,MAAD;AAAA,IAAM;AAAA,IAAc,UAAU;AAAA,KAC3B,KAAK,IAAI,2CACP,KAAD;AAAA,IAAK,KAAK,EAAE;AAAA,IAAO,OAAO,EAAE;AAAA,QAG/B,KAAK,IAAI,CAAC,EAAE,aAAa,4CACvB,OAAD;AAAA,IACE,KAAK;AAAA,OACA,QAAQ,QAAQ,EAAE,OAAO,EAAE,SAAS,aAAa;AAAA,yCAErD,WAAD;AAAA;;MChCG,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAKC;AACJ,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,yCAClB,SAAD,6CAGD,SAAD;AAAA;;;;"}

package/dist/esm/index-f6482ca5.esm.js

@@ -0,0 +1,32 @@
+import { entityRouteRef, useStarredEntities } from '@backstage/plugin-catalog-react';
+import { parseEntityRef } from '@backstage/catalog-model';
+import { useRouteRef } from '@backstage/core-plugin-api';
+import { Link } from '@backstage/core-components';
+import { Typography, List, ListItem, ListItemText, ListItemSecondaryAction, Tooltip, IconButton } from '@material-ui/core';
+import StarIcon from '@material-ui/icons/Star';
+import React from 'react';
+
+const Content = () => {
+  const catalogEntityRoute = useRouteRef(entityRouteRef);
+  const { starredEntities, toggleStarredEntity } = useStarredEntities();
+  if (starredEntities.size === 0)
+    return /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body1"
+    }, "You do not have any starred entities yet!");
+  return /* @__PURE__ */ React.createElement(List, null, Array.from(starredEntities).map((entity) => /* @__PURE__ */ React.createElement(ListItem, {
+    key: entity
+  }, /* @__PURE__ */ React.createElement(Link, {
+    to: catalogEntityRoute(parseEntityRef(entity))
+  }, /* @__PURE__ */ React.createElement(ListItemText, {
+    primary: parseEntityRef(entity).name
+  })), /* @__PURE__ */ React.createElement(ListItemSecondaryAction, null, /* @__PURE__ */ React.createElement(Tooltip, {
+    title: "Remove from starred"
+  }, /* @__PURE__ */ React.createElement(IconButton, {
+    edge: "end",
+    "aria-label": "unstar",
+    onClick: () => toggleStarredEntity(entity)
+  }, /* @__PURE__ */ React.createElement(StarIcon, null)))))));
+};
+
+export { Content };
+//# sourceMappingURL=index-f6482ca5.esm.js.map

package/dist/esm/index-f6482ca5.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-f6482ca5.esm.js","sources":["../../src/homePageComponents/StarredEntities/Content.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 {\n  useStarredEntities,\n  entityRouteRef,\n} from '@backstage/plugin-catalog-react';\nimport { parseEntityRef } from '@backstage/catalog-model';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { Link } from '@backstage/core-components';\nimport {\n  List,\n  ListItem,\n  ListItemSecondaryAction,\n  IconButton,\n  ListItemText,\n  Tooltip,\n  Typography,\n} from '@material-ui/core';\nimport StarIcon from '@material-ui/icons/Star';\nimport React from 'react';\n\n/**\n * A component to display a list of starred entities for the user.\n *\n * @public\n */\n\nexport const Content = () => {\n  const catalogEntityRoute = useRouteRef(entityRouteRef);\n  const { starredEntities, toggleStarredEntity } = useStarredEntities();\n\n  if (starredEntities.size === 0)\n    return (\n      <Typography variant=\"body1\">\n        You do not have any starred entities yet!\n      </Typography>\n    );\n\n  return (\n    <List>\n      {Array.from(starredEntities).map(entity => (\n        <ListItem key={entity}>\n          <Link to={catalogEntityRoute(parseEntityRef(entity))}>\n            <ListItemText primary={parseEntityRef(entity).name} />\n          </Link>\n          <ListItemSecondaryAction>\n            <Tooltip title=\"Remove from starred\">\n              <IconButton\n                edge=\"end\"\n                aria-label=\"unstar\"\n                onClick={() => toggleStarredEntity(entity)}\n              >\n                <StarIcon />\n              </IconButton>\n            </Tooltip>\n          </ListItemSecondaryAction>\n        </ListItem>\n      ))}\n    </List>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;MAyCa,UAAU,MAAM;AAC3B,QAAM,qBAAqB,YAAY;AACvC,QAAM,EAAE,iBAAiB,wBAAwB;AAEjD,MAAI,gBAAgB,SAAS;AAC3B,+CACG,YAAD;AAAA,MAAY,SAAQ;AAAA,OAAQ;AAKhC,6CACG,MAAD,MACG,MAAM,KAAK,iBAAiB,IAAI,gDAC9B,UAAD;AAAA,IAAU,KAAK;AAAA,yCACZ,MAAD;AAAA,IAAM,IAAI,mBAAmB,eAAe;AAAA,yCACzC,cAAD;AAAA,IAAc,SAAS,eAAe,QAAQ;AAAA,2CAE/C,yBAAD,0CACG,SAAD;AAAA,IAAS,OAAM;AAAA,yCACZ,YAAD;AAAA,IACE,MAAK;AAAA,IACL,cAAW;AAAA,IACX,SAAS,MAAM,oBAAoB;AAAA,yCAElC,UAAD;AAAA;;;;"}

package/dist/index.d.ts

@@ -97,6 +97,14 @@ declare const HomePageRandomJoke: (props: ComponentRenderer & {
 declare const HomePageToolkit: (props: ComponentRenderer & {
     title?: string | undefined;
 } & ToolkitContentProps) => JSX.Element;
+/**
+ * A component to display a list of starred entities for the user.
+ *
+ * @public
+ */
+declare const HomePageStarredEntities: (props: ComponentRenderer & {
+    title?: string | undefined;
+}) => JSX.Element;
 
 declare const SettingsModal: ({ open, close, componentName, children, }: {
     open: boolean;
@@ -113,4 +121,4 @@ declare const HeaderWorldClock: ({ clockConfigs, }: {
     clockConfigs: ClockConfig[];
 }) => JSX.Element | null;
 
-export { ClockConfig, ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageCompanyLogo, HomePageRandomJoke, HomePageToolkit, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };
+export { ClockConfig, ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageCompanyLogo, HomePageRandomJoke, HomePageStarredEntities, HomePageToolkit, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };

package/dist/index.esm.js

@@ -146,25 +146,25 @@ const homePlugin = createPlugin({
 });
 const HomepageCompositionRoot = homePlugin.provide(createRoutableExtension({
   name: "HomepageCompositionRoot",
-  component: () => import('./esm/index-405b0ea2.esm.js').then((m) => m.HomepageCompositionRoot),
+  component: () => import('./esm/index-bce831c1.esm.js').then((m) => m.HomepageCompositionRoot),
   mountPoint: rootRouteRef
 }));
 const ComponentAccordion = homePlugin.provide(createComponentExtension({
   name: "ComponentAccordion",
   component: {
-    lazy: () => import('./esm/index-eddf0731.esm.js').then((m) => m.ComponentAccordion)
+    lazy: () => import('./esm/index-f319937c.esm.js').then((m) => m.ComponentAccordion)
   }
 }));
 const ComponentTabs = homePlugin.provide(createComponentExtension({
   name: "ComponentTabs",
   component: {
-    lazy: () => import('./esm/index-eddf0731.esm.js').then((m) => m.ComponentTabs)
+    lazy: () => import('./esm/index-f319937c.esm.js').then((m) => m.ComponentTabs)
   }
 }));
 const ComponentTab = homePlugin.provide(createComponentExtension({
   name: "ComponentTab",
   component: {
-    lazy: () => import('./esm/index-eddf0731.esm.js').then((m) => m.ComponentTab)
+    lazy: () => import('./esm/index-f319937c.esm.js').then((m) => m.ComponentTab)
   }
 }));
 const WelcomeTitle = homePlugin.provide(createComponentExtension({
@@ -189,6 +189,11 @@ const HomePageToolkit = homePlugin.provide(createCardExtension({
   title: "Toolkit",
   components: () => import('./esm/index-e6d55b70.esm.js')
 }));
+const HomePageStarredEntities = homePlugin.provide(createCardExtension({
+  name: "HomePageStarredEntities",
+  title: "Your Starred Entities",
+  components: () => import('./esm/index-f6482ca5.esm.js')
+}));
 
-export { ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageCompanyLogo, HomePageRandomJoke, HomePageToolkit, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };
+export { ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageCompanyLogo, HomePageRandomJoke, HomePageStarredEntities, HomePageToolkit, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };
 //# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../src/components/SettingsModal.tsx","../src/components/HeaderWorldClock/HeaderWorldClock.tsx","../src/extensions.tsx","../src/routes.ts","../src/plugin.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 React from 'react';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n} from '@material-ui/core';\n\nexport const SettingsModal = ({\n  open,\n  close,\n  componentName,\n  children,\n}: {\n  open: boolean;\n  close: Function;\n  componentName: string;\n  children: JSX.Element;\n}) => {\n  return (\n    <Dialog open={open} onClose={() => close()}>\n      <DialogTitle>Settings - {componentName}</DialogTitle>\n      <DialogContent>{children}</DialogContent>\n      <DialogActions>\n        <Button onClick={() => close()} color=\"primary\" variant=\"contained\">\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n","/*\n * Copyright 2020 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 { HeaderLabel } from '@backstage/core-components';\n\nconst timeFormat: Intl.DateTimeFormatOptions = {\n  hour: '2-digit',\n  minute: '2-digit',\n};\n\ntype TimeObj = {\n  time: string;\n  label: string;\n};\n\nexport type ClockConfig = {\n  label: string;\n  timeZone: string;\n};\n\nfunction getTimes(clockConfigs: ClockConfig[]) {\n  const d = new Date();\n  const lang = window.navigator.language;\n\n  const clocks: TimeObj[] = [];\n\n  if (!clockConfigs) {\n    return clocks;\n  }\n\n  for (const clockConfig of clockConfigs) {\n    let label = clockConfig.label;\n\n    const options: Intl.DateTimeFormatOptions = {\n      timeZone: clockConfig.timeZone,\n      ...timeFormat,\n    };\n\n    try {\n      new Date().toLocaleString(lang, options);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `The timezone ${options.timeZone} is invalid. Defaulting to GMT`,\n      );\n      options.timeZone = 'GMT';\n      label = 'GMT';\n    }\n\n    const time = d.toLocaleTimeString(lang, options);\n    clocks.push({ time, label });\n  }\n\n  return clocks;\n}\n\nexport const HeaderWorldClock = ({\n  clockConfigs,\n}: {\n  clockConfigs: ClockConfig[];\n}) => {\n  const defaultTimes: TimeObj[] = [];\n  const [clocks, setTimes] = React.useState(defaultTimes);\n\n  React.useEffect(() => {\n    setTimes(getTimes(clockConfigs));\n\n    const intervalId = setInterval(() => {\n      setTimes(getTimes(clockConfigs));\n    }, 1000);\n\n    return () => {\n      clearInterval(intervalId);\n    };\n  }, [clockConfigs]);\n\n  if (clocks.length !== 0) {\n    return (\n      <>\n        {clocks.map(clock => (\n          <HeaderLabel\n            label={clock.label}\n            value={clock.time}\n            key={clock.label}\n          />\n        ))}\n      </>\n    );\n  }\n  return null;\n};\n","/*\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, { Suspense } from 'react';\nimport { IconButton } from '@material-ui/core';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { InfoCard } from '@backstage/core-components';\nimport { SettingsModal } from './components';\nimport { createReactExtension, useApp } from '@backstage/core-plugin-api';\n\nexport type ComponentRenderer = {\n  Renderer?: (props: RendererProps) => JSX.Element;\n};\n\ntype ComponentParts = {\n  Content: (props?: any) => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n};\n\ntype RendererProps = { title: string } & ComponentParts;\n\ntype CardExtensionProps<T> = ComponentRenderer & { title?: string } & T;\n\n/**\n * An extension creator to create card based components for the homepage\n *\n * @public\n */\nexport function createCardExtension<T>({\n  title,\n  components,\n  name,\n}: {\n  title: string;\n  components: () => Promise<ComponentParts>;\n  name?: string;\n}) {\n  return createReactExtension({\n    name,\n    component: {\n      lazy: () =>\n        components().then(({ Content, Actions, Settings, ContextProvider }) => {\n          const CardExtension = (props: CardExtensionProps<T>) => {\n            const { Renderer, title: overrideTitle, ...childProps } = props;\n            const app = useApp();\n            const { Progress } = app.getComponents();\n            const [settingsOpen, setSettingsOpen] = React.useState(false);\n\n            if (Renderer) {\n              return (\n                <Suspense fallback={<Progress />}>\n                  <Renderer\n                    title={overrideTitle || title}\n                    {...{\n                      Content,\n                      ...(Actions ? { Actions } : {}),\n                      ...(Settings ? { Settings } : {}),\n                      ...(ContextProvider ? { ContextProvider } : {}),\n                      ...childProps,\n                    }}\n                  />\n                </Suspense>\n              );\n            }\n\n            const cardProps = {\n              title: overrideTitle ?? title,\n              ...(Settings\n                ? {\n                    action: (\n                      <IconButton onClick={() => setSettingsOpen(true)}>\n                        <SettingsIcon>Settings</SettingsIcon>\n                      </IconButton>\n                    ),\n                  }\n                : {}),\n              ...(Actions\n                ? {\n                    actions: <Actions />,\n                  }\n                : {}),\n            };\n\n            const innerContent = (\n              <InfoCard {...cardProps}>\n                {Settings && (\n                  <SettingsModal\n                    open={settingsOpen}\n                    componentName={title}\n                    close={() => setSettingsOpen(false)}\n                  >\n                    <Settings />\n                  </SettingsModal>\n                )}\n                <Content {...childProps} />\n              </InfoCard>\n            );\n\n            return (\n              <Suspense fallback={<Progress />}>\n                {ContextProvider ? (\n                  <ContextProvider {...childProps}>\n                    {innerContent}\n                  </ContextProvider>\n                ) : (\n                  innerContent\n                )}\n              </Suspense>\n            );\n          };\n          return CardExtension;\n        }),\n    },\n  });\n}\n","/*\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 */\nimport { createRouteRef } from '@backstage/core-plugin-api';\n\nexport const rootRouteRef = createRouteRef({\n  id: 'home',\n});\n","/*\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 */\nimport {\n  createComponentExtension,\n  createPlugin,\n  createRoutableExtension,\n} from '@backstage/core-plugin-api';\nimport { createCardExtension } from './extensions';\nimport { ToolkitContentProps } from './homePageComponents';\n\nimport { rootRouteRef } from './routes';\n\nexport const homePlugin = createPlugin({\n  id: 'home',\n  routes: {\n    root: rootRouteRef,\n  },\n});\n\nexport const HomepageCompositionRoot = homePlugin.provide(\n  createRoutableExtension({\n    name: 'HomepageCompositionRoot',\n    component: () =>\n      import('./components').then(m => m.HomepageCompositionRoot),\n    mountPoint: rootRouteRef,\n  }),\n);\n\nexport const ComponentAccordion = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentAccordion',\n    component: {\n      lazy: () =>\n        import('./componentRenderers').then(m => m.ComponentAccordion),\n    },\n  }),\n);\nexport const ComponentTabs = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTabs',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTabs),\n    },\n  }),\n);\nexport const ComponentTab = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTab',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTab),\n    },\n  }),\n);\n\n/**\n * A component to display a playful greeting for the user.\n *\n * @public\n */\nexport const WelcomeTitle = homePlugin.provide(\n  createComponentExtension({\n    name: 'WelcomeTitle',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/WelcomeTitle').then(m => m.WelcomeTitle),\n    },\n  }),\n);\n\n/**\n * A component to display a company logo for the user.\n *\n * @public\n */\nexport const HomePageCompanyLogo = homePlugin.provide(\n  createComponentExtension({\n    name: 'CompanyLogo',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/CompanyLogo').then(m => m.CompanyLogo),\n    },\n  }),\n);\n\nexport const HomePageRandomJoke = homePlugin.provide(\n  createCardExtension<{ defaultCategory?: 'any' | 'programming' }>({\n    name: 'HomePageRandomJoke',\n    title: 'Random Joke',\n    components: () => import('./homePageComponents/RandomJoke'),\n  }),\n);\n\n/**\n * A component to display a list of tools for the user.\n *\n * @public\n */\nexport const HomePageToolkit = homePlugin.provide(\n  createCardExtension<ToolkitContentProps>({\n    name: 'HomePageToolkit',\n    title: 'Toolkit',\n    components: () => import('./homePageComponents/Toolkit'),\n  }),\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../src/components/SettingsModal.tsx","../src/components/HeaderWorldClock/HeaderWorldClock.tsx","../src/extensions.tsx","../src/routes.ts","../src/plugin.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 React from 'react';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n} from '@material-ui/core';\n\nexport const SettingsModal = ({\n  open,\n  close,\n  componentName,\n  children,\n}: {\n  open: boolean;\n  close: Function;\n  componentName: string;\n  children: JSX.Element;\n}) => {\n  return (\n    <Dialog open={open} onClose={() => close()}>\n      <DialogTitle>Settings - {componentName}</DialogTitle>\n      <DialogContent>{children}</DialogContent>\n      <DialogActions>\n        <Button onClick={() => close()} color=\"primary\" variant=\"contained\">\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n","/*\n * Copyright 2020 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 { HeaderLabel } from '@backstage/core-components';\n\nconst timeFormat: Intl.DateTimeFormatOptions = {\n  hour: '2-digit',\n  minute: '2-digit',\n};\n\ntype TimeObj = {\n  time: string;\n  label: string;\n};\n\nexport type ClockConfig = {\n  label: string;\n  timeZone: string;\n};\n\nfunction getTimes(clockConfigs: ClockConfig[]) {\n  const d = new Date();\n  const lang = window.navigator.language;\n\n  const clocks: TimeObj[] = [];\n\n  if (!clockConfigs) {\n    return clocks;\n  }\n\n  for (const clockConfig of clockConfigs) {\n    let label = clockConfig.label;\n\n    const options: Intl.DateTimeFormatOptions = {\n      timeZone: clockConfig.timeZone,\n      ...timeFormat,\n    };\n\n    try {\n      new Date().toLocaleString(lang, options);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `The timezone ${options.timeZone} is invalid. Defaulting to GMT`,\n      );\n      options.timeZone = 'GMT';\n      label = 'GMT';\n    }\n\n    const time = d.toLocaleTimeString(lang, options);\n    clocks.push({ time, label });\n  }\n\n  return clocks;\n}\n\nexport const HeaderWorldClock = ({\n  clockConfigs,\n}: {\n  clockConfigs: ClockConfig[];\n}) => {\n  const defaultTimes: TimeObj[] = [];\n  const [clocks, setTimes] = React.useState(defaultTimes);\n\n  React.useEffect(() => {\n    setTimes(getTimes(clockConfigs));\n\n    const intervalId = setInterval(() => {\n      setTimes(getTimes(clockConfigs));\n    }, 1000);\n\n    return () => {\n      clearInterval(intervalId);\n    };\n  }, [clockConfigs]);\n\n  if (clocks.length !== 0) {\n    return (\n      <>\n        {clocks.map(clock => (\n          <HeaderLabel\n            label={clock.label}\n            value={clock.time}\n            key={clock.label}\n          />\n        ))}\n      </>\n    );\n  }\n  return null;\n};\n","/*\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, { Suspense } from 'react';\nimport { IconButton } from '@material-ui/core';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { InfoCard } from '@backstage/core-components';\nimport { SettingsModal } from './components';\nimport { createReactExtension, useApp } from '@backstage/core-plugin-api';\n\nexport type ComponentRenderer = {\n  Renderer?: (props: RendererProps) => JSX.Element;\n};\n\ntype ComponentParts = {\n  Content: (props?: any) => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n};\n\ntype RendererProps = { title: string } & ComponentParts;\n\ntype CardExtensionProps<T> = ComponentRenderer & { title?: string } & T;\n\n/**\n * An extension creator to create card based components for the homepage\n *\n * @public\n */\nexport function createCardExtension<T>({\n  title,\n  components,\n  name,\n}: {\n  title: string;\n  components: () => Promise<ComponentParts>;\n  name?: string;\n}) {\n  return createReactExtension({\n    name,\n    component: {\n      lazy: () =>\n        components().then(({ Content, Actions, Settings, ContextProvider }) => {\n          const CardExtension = (props: CardExtensionProps<T>) => {\n            const { Renderer, title: overrideTitle, ...childProps } = props;\n            const app = useApp();\n            const { Progress } = app.getComponents();\n            const [settingsOpen, setSettingsOpen] = React.useState(false);\n\n            if (Renderer) {\n              return (\n                <Suspense fallback={<Progress />}>\n                  <Renderer\n                    title={overrideTitle || title}\n                    {...{\n                      Content,\n                      ...(Actions ? { Actions } : {}),\n                      ...(Settings ? { Settings } : {}),\n                      ...(ContextProvider ? { ContextProvider } : {}),\n                      ...childProps,\n                    }}\n                  />\n                </Suspense>\n              );\n            }\n\n            const cardProps = {\n              title: overrideTitle ?? title,\n              ...(Settings\n                ? {\n                    action: (\n                      <IconButton onClick={() => setSettingsOpen(true)}>\n                        <SettingsIcon>Settings</SettingsIcon>\n                      </IconButton>\n                    ),\n                  }\n                : {}),\n              ...(Actions\n                ? {\n                    actions: <Actions />,\n                  }\n                : {}),\n            };\n\n            const innerContent = (\n              <InfoCard {...cardProps}>\n                {Settings && (\n                  <SettingsModal\n                    open={settingsOpen}\n                    componentName={title}\n                    close={() => setSettingsOpen(false)}\n                  >\n                    <Settings />\n                  </SettingsModal>\n                )}\n                <Content {...childProps} />\n              </InfoCard>\n            );\n\n            return (\n              <Suspense fallback={<Progress />}>\n                {ContextProvider ? (\n                  <ContextProvider {...childProps}>\n                    {innerContent}\n                  </ContextProvider>\n                ) : (\n                  innerContent\n                )}\n              </Suspense>\n            );\n          };\n          return CardExtension;\n        }),\n    },\n  });\n}\n","/*\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 */\nimport { createRouteRef } from '@backstage/core-plugin-api';\n\nexport const rootRouteRef = createRouteRef({\n  id: 'home',\n});\n","/*\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 */\nimport {\n  createComponentExtension,\n  createPlugin,\n  createRoutableExtension,\n} from '@backstage/core-plugin-api';\nimport { createCardExtension } from './extensions';\nimport { ToolkitContentProps } from './homePageComponents';\n\nimport { rootRouteRef } from './routes';\n\nexport const homePlugin = createPlugin({\n  id: 'home',\n  routes: {\n    root: rootRouteRef,\n  },\n});\n\nexport const HomepageCompositionRoot = homePlugin.provide(\n  createRoutableExtension({\n    name: 'HomepageCompositionRoot',\n    component: () =>\n      import('./components').then(m => m.HomepageCompositionRoot),\n    mountPoint: rootRouteRef,\n  }),\n);\n\nexport const ComponentAccordion = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentAccordion',\n    component: {\n      lazy: () =>\n        import('./componentRenderers').then(m => m.ComponentAccordion),\n    },\n  }),\n);\nexport const ComponentTabs = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTabs',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTabs),\n    },\n  }),\n);\nexport const ComponentTab = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTab',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTab),\n    },\n  }),\n);\n\n/**\n * A component to display a playful greeting for the user.\n *\n * @public\n */\nexport const WelcomeTitle = homePlugin.provide(\n  createComponentExtension({\n    name: 'WelcomeTitle',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/WelcomeTitle').then(m => m.WelcomeTitle),\n    },\n  }),\n);\n\n/**\n * A component to display a company logo for the user.\n *\n * @public\n */\nexport const HomePageCompanyLogo = homePlugin.provide(\n  createComponentExtension({\n    name: 'CompanyLogo',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/CompanyLogo').then(m => m.CompanyLogo),\n    },\n  }),\n);\n\nexport const HomePageRandomJoke = homePlugin.provide(\n  createCardExtension<{ defaultCategory?: 'any' | 'programming' }>({\n    name: 'HomePageRandomJoke',\n    title: 'Random Joke',\n    components: () => import('./homePageComponents/RandomJoke'),\n  }),\n);\n\n/**\n * A component to display a list of tools for the user.\n *\n * @public\n */\nexport const HomePageToolkit = homePlugin.provide(\n  createCardExtension<ToolkitContentProps>({\n    name: 'HomePageToolkit',\n    title: 'Toolkit',\n    components: () => import('./homePageComponents/Toolkit'),\n  }),\n);\n\n/**\n * A component to display a list of starred entities for the user.\n *\n * @public\n */\nexport const HomePageStarredEntities = homePlugin.provide(\n  createCardExtension({\n    name: 'HomePageStarredEntities',\n    title: 'Your Starred Entities',\n    components: () => import('./homePageComponents/StarredEntities'),\n  }),\n);\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@backstage/plugin-home",
   "description": "A Backstage plugin that helps you build a home page",
-  "version": "0.4.13",
+  "version": "0.4.14-next.0",
   "main": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "license": "Apache-2.0",
@@ -21,9 +21,11 @@
     "clean": "backstage-cli clean"
   },
   "dependencies": {
-    "@backstage/core-components": "^0.8.7",
+    "@backstage/catalog-model": "^0.9.10",
+    "@backstage/core-components": "^0.8.8-next.0",
     "@backstage/core-plugin-api": "^0.6.0",
-    "@backstage/plugin-search": "^0.6.1",
+    "@backstage/plugin-catalog-react": "^0.6.14-next.0",
+    "@backstage/plugin-search": "^0.6.2-next.0",
     "@backstage/theme": "^0.2.14",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
@@ -37,9 +39,9 @@
     "react": "^16.13.1 || ^17.0.0"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.13.1",
+    "@backstage/cli": "^0.13.2-next.0",
     "@backstage/core-app-api": "^0.5.2",
-    "@backstage/dev-utils": "^0.2.20",
+    "@backstage/dev-utils": "^0.2.21-next.0",
     "@backstage/test-utils": "^0.2.4",
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^11.2.5",
@@ -52,5 +54,5 @@
   "files": [
     "dist"
   ],
-  "gitHead": "f944a625c4a8ec7f6a6237502691da9209ce6b14"
+  "gitHead": "e6f167225d843beeb974c287c3364d951b587626"
 }