added RegistryURL input

.gitignore

@@ -6,7 +6,6 @@
 
 # misc
 .DS_Store
-env/local.env
 
 npm-debug.log*
 yarn-debug.log*

env/local.env

@@ -0,0 +1 @@
+ENV=local

package.json

@@ -8,14 +8,14 @@
     "node": ">=16 <17"
   },
   "dependencies": {
+    "@emotion/react": "^11.9.0",
+    "@emotion/styled": "^11.8.1",
     "@mui/icons-material": "^5.4.2",
     "@mui/material": "^5.4.3",
     "axios": "^0.26.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-router-dom": "^6.2.1",
+    "react-router-dom": "^6.2.1"
-    "svgo": "^2.8.0",
-    "uuid": "^8.3.2"
   },
   "scripts": {
     "start-prod": "BUILD_ENV=PROD GENERATE_SOURCEMAP=false webpack serve --config webpack.config.ts",

src/api/axios.tsx

@@ -1,5 +1,7 @@
 import axios from "axios";
 
-export default axios.create({
+export default (url: string) => {
-  baseURL: "" + "/v2"
+  return axios.create({
-});
+    baseURL: url + "/v2"
+  })
+};

src/components/Home.tsx

@@ -1,10 +1,9 @@
 import React from "react";
+import RegistryURL from "./RegistryURL";
 
 const Home: React.FC = () => {
     return(
-        <>
+        <RegistryURL />
-            <p>Temp</p>
-        </>
     );
 };
 

src/components/RegistryURL.tsx

@@ -0,0 +1,60 @@
+import React from "react";
+import { useState } from "react";
+import { Button, TextField, Grid } from "@mui/material";
+import axios from "../api/axios";
+
+const RegistryURL: React.FC = () => {
+    
+    const [registryURL, setRegistryURL] = useState("");
+    const [hasError, setHasError] = useState(false);
+
+    const requireLogin = () => {
+        console.log("Login is Required");
+    }
+
+    const checkURL = async (e: React.SyntheticEvent) => {
+        e.preventDefault();
+
+        try {
+            let axoisInstance = axios(registryURL);
+            // axoisInstance.interceptors.response.use(
+            //     response => response,
+            //     error => {
+            //         if (error.response.status === 401) {
+            //             requireLogin();
+            //         } else {
+            //             setHasError(true);
+            //         }
+            //         return error;
+            //     }
+            // );
+            let response = await axoisInstance.get(
+                `/`
+            );
+            console.log(registryURL);
+        } catch (error: any) {
+            console.log(error);
+            if (error.response == undefined) {
+                setHasError(false);
+                requireLogin();
+            } else {
+                setHasError(true);
+            }
+        }
+    };
+
+    return(
+        <div className="get-url">
+            <Grid container spacing={2}>
+                <Grid item xs={10} md={10}>
+                    <TextField id="registry-url-input" label="RegistryURL" variant="outlined" value={registryURL} error={hasError} helperText={hasError ? "The registry URL is invalid!" : ""} onChange={(event)=>{setRegistryURL(event.target.value)}} fullWidth />
+                </Grid>
+                <Grid item xs={2} md={2}>
+                    <Button className="submit-url-btn" onClick={checkURL} fullWidth>Next</Button>
+                </Grid>
+            </Grid>
+        </div>
+    );
+};
+
+export default RegistryURL;

src/style/modules/_URL.sass

@@ -0,0 +1,6 @@
+.get-url
+    max-width: 70%
+    margin: auto
+    margin-top: 35%
+    .submit-url-btn
+        margin-top: 6.5%

src/style/modules/_modules-dir.sass

@@ -1 +1,2 @@
-@import "sectionMain"
+@import "sectionMain"
+@import "URL"

src/style/style.css

@@ -5,4 +5,14 @@
 a {
   text-decoration: none;
 }
+
+.get-url {
+  max-width: 70%;
+  margin: auto;
+  margin-top: 35%;
+}
+
+.get-url .submit-url-btn {
+  margin-top: 6.5%;
+}
 /*# sourceMappingURL=style.css.map */

src/style/style.css.map

@@ -1,6 +1,6 @@
 {
     "version": 3,
-    "mappings": "AG8CA,AAAA,WAAW,CAAC;EACR,KAAK,EAAE,IAAI;CAAG;;AAElB,AAAA,CAAC,CAAC;EACE,eAAe,EAAE,IAAI;CAAG",
+    "mappings": "AG8CA,AAAA,WAAW,CAAC;EACR,KAAK,EAAE,IAAI;CAAG;;AAElB,AAAA,CAAC,CAAC;EACE,eAAe,EAAE,IAAI;CAAG;;AMlD5B,AAAA,QAAQ,CAAC;EACL,SAAS,EAAE,GAAG;EACd,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,GAAG;CAEU;;AAL7B,AAII,QAJI,CAIJ,eAAe,CAAC;EACZ,UAAU,EAAE,IAAI;CAAG",
     "sources": [
         "style.sass",
         "_variables.sass",
@@ -10,7 +10,8 @@
         "layouts/_header.sass",
         "layouts/_footer.sass",
         "modules/_modules-dir.sass",
-        "modules/_sectionMain.sass"
+        "modules/_sectionMain.sass",
+        "modules/_URL.sass"
     ],
     "names": [],
     "file": "style.css"