diff --git a/packages/cli/templates/default-plugin/src/components/ExampleComponent/ExampleComponent.tsx.hbs b/packages/cli/templates/default-plugin/src/components/ExampleComponent/ExampleComponent.tsx.hbs
index ac101c6583..c49d7faebb 100644
--- a/packages/cli/templates/default-plugin/src/components/ExampleComponent/ExampleComponent.tsx.hbs
+++ b/packages/cli/templates/default-plugin/src/components/ExampleComponent/ExampleComponent.tsx.hbs
@@ -8,6 +8,7 @@ import {
Content,
ContentHeader,
HeaderLabel,
+ SupportButton,
} from '@spotify-backstage/core';
import ExampleFetchComponent from '../ExampleFetchComponent';
@@ -18,7 +19,9 @@ const ExampleComponent: FC<{}> = () => (
-
+
+ A description of your plugin goes here.
+
({
+ leftIcon: {
+ marginRight: theme.spacing(1),
+ },
+ popoverList: {
+ minWidth: 260,
+ maxWidth: 320,
+ },
+}));
+
+const SupportButton: FC = ({
+ slackChannel = '#backstage',
+ email = [],
+ children,
+ // plugin,
+}) => {
+ // TODO: get plugin manifest with hook
+
+ const [popoverOpen, setPopoverOpen] = useState(false);
+ const [anchorEl, setAnchorEl] = useState(null);
+ const classes = useStyles();
+
+ const onClickHandler = event => {
+ setAnchorEl(event.currentTarget);
+ setPopoverOpen(true);
+ };
+
+ const popoverCloseHandler = () => {
+ setPopoverOpen(false);
+ };
+
+ // const tags = plugin ? plugin.stackoverflowTags : undefined;
+ const slackChannels = Array.isArray(slackChannel)
+ ? slackChannel
+ : [slackChannel];
+ const contactEmails = Array.isArray(email) ? email : [email];
+
+ return (
+
+
+
+
+ {React.Children.map(children, (child, i) => (
+
+ {child}
+
+ ))}
+ {/* {tags && tags.length > 0 && (
+
+
+ {tags.map((tag, i) => (
+
+ ))}
+
+
+ )} */}
+ {slackChannels && (
+
+
+
+
+
+ {slackChannels.map((channel, i) => (
+ {channel}
+ ))}
+
+ }
+ />
+
+ )}
+ {contactEmails.length > 0 && (
+
+
+
+
+
+ {contactEmails.map((email, index) => (
+
+ {email}
+
+ ))}
+
+ )}
+
+
+
+ );
+};
+
+export default SupportButton;
diff --git a/packages/core/src/components/SupportButton/index.ts b/packages/core/src/components/SupportButton/index.ts
new file mode 100644
index 0000000000..1e0974b2a2
--- /dev/null
+++ b/packages/core/src/components/SupportButton/index.ts
@@ -0,0 +1 @@
+export { default } from './SupportButton';
diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
index 41f193853d..9c84e12416 100644
--- a/packages/core/src/index.ts
+++ b/packages/core/src/index.ts
@@ -18,5 +18,6 @@ export { default as HorizontalScrollGrid } from './components/HorizontalScrollGr
export { default as ProgressCard } from './components/ProgressCard';
export { default as CircleProgress } from './components/CircleProgress';
export { default as Progress } from './components/Progress';
+export { default as SupportButton } from './components/SupportButton';
export { default as SortableTable } from './components/SortableTable';
export { default as TemplateList } from './components/TemplateList/TemplateList';