Extract Git

Author: MichaelDeBoey

packages/app/src/app/pages/Sandbox/Editor/Workspace/Project/Git.tsx

@@ -0,0 +1,31 @@
+import GithubBadge from '@codesandbox/common/lib/components/GithubBadge';
+import { githubRepoUrl } from '@codesandbox/common/lib/utils/url-generator';
+import React, { FunctionComponent } from 'react';
+import { useOvermind } from 'app/overmind';
+
+import { Item } from './elements';
+
+export const Git: FunctionComponent = () => {
+  const {
+    state: {
+      editor: {
+        currentSandbox: {
+          git,
+          git: { branch, commitSha, repo, username },
+        },
+      },
+    },
+  } = useOvermind();
+
+  return (
+    <Item>
+      <GithubBadge
+        branch={branch}
+        commitSha={commitSha}
+        repo={repo}
+        url={githubRepoUrl(git)}
+        username={username}
+      />
+    </Item>
+  );
+};

packages/app/src/app/pages/Sandbox/Editor/Workspace/Project/index.tsx

@@ -1,9 +1,7 @@
-import GithubBadge from '@codesandbox/common/lib/components/GithubBadge';
 import Tooltip from '@codesandbox/common/lib/components/Tooltip';
 import getTemplateDefinition from '@codesandbox/common/lib/templates';
 import { getSandboxName } from '@codesandbox/common/lib/utils/get-sandbox-name';
 import {
-  githubRepoUrl,
   patronUrl,
   sandboxUrl,
 } from '@codesandbox/common/lib/utils/url-generator';
@@ -31,6 +29,7 @@ import {
   TemplateStyledLink,
 } from './elements';
 import { Frozen } from './Frozen';
+import { Git } from './Git';
 import { Keywords } from './Keywords';
 import { SandboxConfig } from './SandboxConfig';
 import { Team } from './Team';
@@ -76,17 +75,7 @@ export const Project: FunctionComponent<Props> = ({ editable = false }) => {
 
       {team && <Team />}
 
-      {git && (
-        <Item>
-          <GithubBadge
-            branch={git.branch}
-            commitSha={git.commitSha}
-            repo={git.repo}
-            url={githubRepoUrl(git)}
-            username={git.username}
-          />
-        </Item>
-      )}
+      {git && <Git />}
 
       <StatsContainer>
         <Stats sandbox={currentSandbox} />