🔨 Refactored app/pages/CLI/index.tsx (#2623)

Author: indifferentghost

packages/app/src/app/pages/CLI/index.tsx

@@ -1,43 +1,37 @@
 import React, { useEffect } from 'react';
-
-import { inject, hooksObserver } from 'app/componentConnectors';
 import { Navigation } from 'app/pages/common/Navigation';
-
+import { useOvermind } from 'app/overmind';
 import { Container } from './elements';
 import { Prompt } from './Prompt';
 
-interface Props {
+interface CliProps {
   small: boolean;
-  store: any;
-  signals: any;
 }
 
-const CLI = inject('store', 'signals')(
-  hooksObserver(
-    ({
-      signals: { cliMounted, signInCliClicked },
-      store: { user, authToken, isLoadingCLI, error },
-    }: Props) => {
-      useEffect(() => {
-        cliMounted();
-      }, [cliMounted]);
+const CLI: React.FunctionComponent<CliProps> = ({ small }) => {
+  const {
+    state: { user, authToken, isLoadingCLI, error },
+    actions: { cliMounted, signInCliClicked },
+  } = useOvermind();
+
+  useEffect(() => {
+    cliMounted();
+  }, [cliMounted]);
 
-      return (
-        <Container>
-          <Navigation title="CLI Authorization" />
+  return (
+    <Container>
+      <Navigation title="CLI Authorization" />
 
-          <Prompt
-            error={error}
-            loading={isLoadingCLI}
-            signIn={signInCliClicked}
-            token={authToken}
-            username={user && user.username}
-          />
-        </Container>
-      );
-    }
-  )
-);
+      <Prompt
+        error={error}
+        loading={isLoadingCLI}
+        signIn={signInCliClicked}
+        token={authToken}
+        username={user && user.username}
+      />
+    </Container>
+  );
+};
 
 // eslint-disable-next-line import/no-default-export
 export default CLI;