component classes v2

[lemmy-ui.git] / src / shared / components / common / banner-icon-header.tsx

diff --git a/src/shared/components/common/banner-icon-header.tsx b/src/shared/components/common/banner-icon-header.tsx
index a72400a3dc824cd075ea39607d1bbb663a6350da..d2cba13efd53841a62e20fd084c2600662f8c9aa 100644 (file)
--- a/src/shared/components/common/banner-icon-header.tsx
+++ b/src/shared/components/common/banner-icon-header.tsx
@@ -1,10 +1,9 @@
-import { Option } from "@sniptt/monads";
 import { Component } from "inferno";
 import { PictrsImage } from "./pictrs-image";
 
 interface BannerIconHeaderProps {
-  banner: Option<string>;
-  icon: Option<string>;
+  banner?: string;
+  icon?: string;
 }
 
 export class BannerIconHeader extends Component<BannerIconHeaderProps, any> {
@@ -13,24 +12,22 @@ export class BannerIconHeader extends Component<BannerIconHeaderProps, any> {
   }
 
   render() {
+    const banner = this.props.banner;
+    const icon = this.props.icon;
     return (
-      <div className="position-relative mb-2">
-        {this.props.banner.match({
-          some: banner => <PictrsImage src={banner} banner alt="" />,
-          none: <></>,
-        })}
-        {this.props.icon.match({
-          some: icon => (
+      (banner || icon) && (
+        <div className="banner-icon-header position-relative mb-2">
+          {banner && <PictrsImage src={banner} banner alt="" />}
+          {icon && (
             <PictrsImage
               src={icon}
               iconOverlay
-              pushup={this.props.banner.isSome()}
+              pushup={!!this.props.banner}
               alt=""
             />
-          ),
-          none: <></>,
-        })}
-      </div>
+          )}
+        </div>
+      )
     );
   }
 }