From 54e937ee90cd5c70fd2d8544f39bfd0b5528520b Mon Sep 17 00:00:00 2001
From: Samira Mokaram <samiram@spotify.com>
Date: Wed, 23 Sep 2020 14:57:55 +0200
Subject: [PATCH] change class component to functional component

---
 .../StructuredMetadataTable.tsx               | 22 +++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/core/src/components/StructuredMetadataTable/StructuredMetadataTable.tsx b/packages/core/src/components/StructuredMetadataTable/StructuredMetadataTable.tsx
index f966bd570f..52ad9a320a 100644
--- a/packages/core/src/components/StructuredMetadataTable/StructuredMetadataTable.tsx
+++ b/packages/core/src/components/StructuredMetadataTable/StructuredMetadataTable.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { Component, Fragment, ReactElement } from 'react';
+import React, { Fragment, ReactElement } from 'react';
 import { withStyles, createStyles, WithStyles, Theme } from '@material-ui/core';
 import startCase from 'lodash/startCase';
 
@@ -142,17 +142,17 @@ const TableItem = ({
   );
 };
 
-interface ComponentProps {
+type Props = {
   metadata: { [key: string]: any };
   dense?: boolean;
   options?: any;
-}
+};
 
-export class StructuredMetadataTable extends Component<ComponentProps> {
-  render() {
-    const { metadata, dense, options } = this.props;
-    const metadataItems = mapToItems(metadata, options || {});
-
-    return <MetadataTable dense={dense}>{metadataItems}</MetadataTable>;
-  }
-}
+export const StructuredMetadataTable = ({
+  metadata,
+  dense = true,
+  options,
+}: Props) => {
+  const metadataItems = mapToItems(metadata, options || {});
+  return <MetadataTable dense={dense}>{metadataItems}</MetadataTable>;
+};