diff --git a/webapp/channels/src/components/permissions_gates/system_permission_gate/__snapshots__/system_permission_gate.test.tsx.snap b/webapp/channels/src/components/permissions_gates/system_permission_gate/__snapshots__/system_permission_gate.test.tsx.snap
index 0cee0f8eac..679188b6be 100644
--- a/webapp/channels/src/components/permissions_gates/system_permission_gate/__snapshots__/system_permission_gate.test.tsx.snap
+++ b/webapp/channels/src/components/permissions_gates/system_permission_gate/__snapshots__/system_permission_gate.test.tsx.snap
@@ -24,7 +24,6 @@ exports[`components/permissions_gates SystemPermissionGate should match snapshot
     <SystemPermissionGate
       dispatch={[Function]}
       hasPermission={true}
-      invert={false}
       permissions={
         Array [
           "test_system_permission",
@@ -63,7 +62,6 @@ exports[`components/permissions_gates SystemPermissionGate should match snapshot
     <SystemPermissionGate
       dispatch={[Function]}
       hasPermission={true}
-      invert={false}
       permissions={
         Array [
           "test_system_permission",
@@ -136,7 +134,6 @@ exports[`components/permissions_gates SystemPermissionGate should match snapshot
     <SystemPermissionGate
       dispatch={[Function]}
       hasPermission={false}
-      invert={false}
       permissions={
         Array [
           "invalid_permission",
diff --git a/webapp/channels/src/components/permissions_gates/system_permission_gate/system_permission_gate.tsx b/webapp/channels/src/components/permissions_gates/system_permission_gate/system_permission_gate.tsx
index 2463be40ee..a8d45d0009 100644
--- a/webapp/channels/src/components/permissions_gates/system_permission_gate/system_permission_gate.tsx
+++ b/webapp/channels/src/components/permissions_gates/system_permission_gate/system_permission_gate.tsx
@@ -17,7 +17,7 @@ type Props = {
     /**
      * Invert the permission (used for else)
      */
-    invert: boolean;
+    invert?: boolean;
 
     /**
      * Content protected by the permissions gate
@@ -25,18 +25,15 @@ type Props = {
     children: React.ReactNode;
 };
 
-export default class SystemPermissionGate extends React.PureComponent<Props> {
-    public static defaultProps = {
-        invert: false,
-    };
-
-    render() {
-        if (this.props.hasPermission && !this.props.invert) {
-            return this.props.children;
-        }
-        if (!this.props.hasPermission && this.props.invert) {
-            return this.props.children;
-        }
-        return null;
+const SystemPermissionGate = ({
+    invert = false,
+    hasPermission,
+    children,
+}: Props) => {
+    if (hasPermission !== invert) {
+        return <>{children}</>;
     }
-}
+    return null;
+};
+
+export default SystemPermissionGate;