dev-utils: add EntityGridItem for easily displaying various entity cards

Co-authored-by: blam <ben@blam.sh>

packages/dev-utils/package.json

@@ -30,6 +30,8 @@
   },
   "dependencies": {
     "@backstage/core": "^0.4.0",
+    "@backstage/catalog-model": "^0.6.0",
+    "@backstage/plugin-catalog": "^0.2.8",
     "@backstage/test-utils": "^0.1.5",
     "@backstage/theme": "^0.2.2",
     "@material-ui/core": "^4.11.0",

packages/dev-utils/src/components/EntityGridItem/EntityGridItem.tsx

@@ -0,0 +1,31 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { Grid, GridProps } from '@material-ui/core';
+import { Entity } from '@backstage/catalog-model';
+import { EntityProvider } from '@backstage/plugin-catalog';
+
+export const EntityGridItem = ({
+  entity,
+  ...rest
+}: Omit<GridProps, 'item' | 'container'> & { entity: Entity }): JSX.Element => {
+  return (
+    <EntityProvider entity={entity}>
+      <Grid {...rest} item />
+    </EntityProvider>
+  );
+};

packages/dev-utils/src/components/EntityGridItem/index.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export { EntityGridItem } from './EntityGridItem';

packages/dev-utils/src/components/index.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './EntityGridItem';

packages/dev-utils/src/index.ts

@@ -13,4 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+export * from './components';
 export * from './devApp';