feat: add checkRepoTab

packages/app/src/components/CheckRepoTab.tsx

@@ -0,0 +1,67 @@
+import React from 'react';
+// import LinearProgress from '@material-ui/core/LinearProgress';
+import { makeStyles } from '@material-ui/core/styles';
+import TextField from '@material-ui/core/TextField';
+// import { Alert, AlertTitle } from '@material-ui/lab';
+import { getFiles } from 'jsonld-checker';
+// import ResultTable from './ResultTable';
+import { getQueryParameter, updateQueryParameter } from '../utils';
+import LoaderButton from './LoaderButton';
+
+const useStyles = makeStyles((theme) => ({
+  root: {
+    display: 'flex',
+    flexWrap: 'wrap',
+  },
+  progressBar: {
+    width: '100%',
+    marginTop: theme.spacing(2),
+    marginBottom: theme.spacing(2),
+  },
+}));
+
+const CheckRepoTab: React.FunctionComponent<{}> = () => {
+  const classes = useStyles();
+
+  const [repo, setRepo] = React.useState(() => {
+    const repoQueryParameter = getQueryParameter('repo');
+    if (repoQueryParameter) {
+      return decodeURIComponent(repoQueryParameter);
+    }
+    return 'https://github.com/transmute-industries/universal-wallet';
+  });
+  const [files, setFiles] = React.useState<Array<{ path: string }>>([]);
+  console.log(files);
+
+  React.useEffect(() => {
+    updateQueryParameter('repo', repo);
+  }, [repo]);
+
+  const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setRepo(event.target.value);
+  };
+
+  const onClick = async () => {
+    const filesInRepo = await getFiles('gjgd', 'jsonld-checker');
+    setFiles(filesInRepo);
+  };
+
+  return (
+    <div className={classes.root}>
+      <LoaderButton onClick={onClick} buttonText="Check Repo" />
+      <TextField
+        label="Enter the URL of a Github repo"
+        onChange={onChange}
+        defaultValue={repo}
+        style={{ margin: 8 }}
+        fullWidth
+        margin="normal"
+      />
+      {files.map((file) => (
+        <div>{file.path}</div>
+      ))}
+    </div>
+  );
+};
+
+export default CheckRepoTab;

packages/app/src/components/Tabs.tsx

@@ -6,6 +6,7 @@ import Tab from '@material-ui/core/Tab';
 import Box from '@material-ui/core/Box';
 import CheckJsonTab from './CheckJsonTab';
 import CheckFileTab from './CheckFileTab';
+import CheckRepoTab from './CheckRepoTab';
 import { updateQueryParameter, getQueryParameter } from '../utils';
 
 type TabPanelProps = {
@@ -50,8 +51,8 @@ export default function SimpleTabs() {
     let defaultTab: number;
     if (tabQueryParameter) {
       defaultTab = Number.parseInt(tabQueryParameter, 10);
-      if (defaultTab > 1) {
-        defaultTab = 1;
+      if (defaultTab > 2) {
+        defaultTab = 0;
       }
     } else {
       defaultTab = 0;
@@ -60,11 +61,7 @@ export default function SimpleTabs() {
   });
 
   const handleChange = (event: ChangeEvent<{}>, newTab: number) => {
-    if (newTab === 2) {
-      alert('Not implemented yet');
-    } else {
-      setTab(newTab);
-    }
+    setTab(newTab);
   };
 
   React.useEffect(() => {
@@ -87,7 +84,7 @@ export default function SimpleTabs() {
         <CheckFileTab />
       </TabPanel>
       <TabPanel value={tab} index={2}>
-        <div>TODO</div>
+        <CheckRepoTab />
       </TabPanel>
     </div>
   );