Add page for new domain in project settings (#28)

* Add layout to implement addition of new domains

* Handle review changes

* Move AddDomain component to pages directory

* Use useLocation for pathname

* Use relative paths to navigate between pages

---------

Co-authored-by: neeraj <neeraj.rtly@gmail.com>

packages/frontend/src/components/projects/project/settings/Domains.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useParams } from 'react-router-dom';
+import { useParams, Link } from 'react-router-dom';
 import { Button, Typography } from '@material-tailwind/react';
 
 import DomainCard from './DomainCard';
@@ -7,13 +7,16 @@ import domainsData from '../../../../assets/domains.json';
 
 const Domains = () => {
   const { id } = useParams();
+
   return (
     <>
-      <div className="flex justify-between p-2 ">
+      <div className="flex justify-between p-2">
         <Typography variant="h2">Domain</Typography>
-        <Button variant="outlined" className="rounded-full">
-          Add domain
-        </Button>
+        <Link to={`domain/add`}>
+          <Button color="blue" variant="outlined" className="rounded-full">
+            <i>^</i> Add domain
+          </Button>
+        </Link>
       </div>
 
       {domainsData

packages/frontend/src/components/projects/project/settings/SetupDomain.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import { Typography, Button, Input } from '@material-tailwind/react';
+
+const SetupDomain = () => {
+  return (
+    <div className="flex flex-col gap-2">
+      <div>
+        <Typography variant="h3">Setup domain name</Typography>
+        <Typography variant="small">
+          Add your domain and setup redirects
+        </Typography>
+      </div>
+      <div>
+        <Typography variant="lead">Domain name</Typography>
+        <Input
+          type="text"
+          variant="outlined"
+          size="lg"
+          className="border-2 rounded w-full"
+          crossOrigin={''}
+        />
+      </div>
+      <Button className="w-fit" color="blue">
+        <Link to={`config`}>
+          <i>^</i> Next
+        </Link>
+      </Button>
+    </div>
+  );
+};
+
+export default SetupDomain;