From 58904a35e6b502469ad274f567a1550644bdd85d Mon Sep 17 00:00:00 2001
From: Puskar-Roy <puskarroy600@gmail.com>
Date: Sun, 14 Jul 2024 16:18:28 +0530
Subject: [PATCH 1/2] feat : profile set

---
 apps/frontend/src/App.tsx                     |   2 +
 apps/frontend/src/components/ProfileSetup.tsx | 211 ++++++++++++++++++
 2 files changed, 213 insertions(+)
 create mode 100644 apps/frontend/src/components/ProfileSetup.tsx

diff --git a/apps/frontend/src/App.tsx b/apps/frontend/src/App.tsx
index 025989c..197eaa2 100644
--- a/apps/frontend/src/App.tsx
+++ b/apps/frontend/src/App.tsx
@@ -2,6 +2,7 @@ import { Route, Routes } from "react-router-dom";
 import Home from "./components/Home";
 import Navbar from "./components/Navbar";
 import Login from "./components/Login";
+import ProfileSetup from "./components/ProfileSetup";
 
 
 function App() {
@@ -14,6 +15,7 @@ function App() {
           element={<Home />}
         />
         <Route path="/login" element={<Login />} />
+        <Route path="/profile" element={ <ProfileSetup/> }/>
       </Routes>
 
     </>
diff --git a/apps/frontend/src/components/ProfileSetup.tsx b/apps/frontend/src/components/ProfileSetup.tsx
new file mode 100644
index 0000000..c6e5139
--- /dev/null
+++ b/apps/frontend/src/components/ProfileSetup.tsx
@@ -0,0 +1,211 @@
+import React, { useState, ChangeEvent, FormEvent } from 'react';
+
+
+
+interface FormData {
+    companyName: string;
+    companyMail: string;
+    companyWebsite: string;
+    companyAddress: string;
+    location: string;
+    description: string;
+    logo: File | null;
+  }
+
+const ProfileSetup = () => {
+    const [formData, setFormData] = useState<FormData>({
+        companyName: '',
+        companyMail: '',
+        companyWebsite: '',
+        companyAddress: '',
+        location: '',
+        description: '',
+        logo: null,
+      });
+    
+      const handleInputChange = (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => {
+        const { name, value } = e.target;
+        setFormData({ ...formData, [name]: value });
+      };
+    
+      const handleFileChange = (e: ChangeEvent<HTMLInputElement>) => {
+        const file = e.target.files ? e.target.files[0] : null;
+        setFormData({ ...formData, logo: file });
+      };
+    
+      const handleSubmit = (e: FormEvent<HTMLFormElement>) => {
+        e.preventDefault();
+        // Handle form submission
+        console.log(formData);
+      };
+
+  return (
+    <div
+      className="relative min-h-screen flex items-center justify-center bg-center bg-gray-50 py-12 px-4 sm:px-6 lg:px-8 bg-gray-500 bg-no-repeat bg-cover"
+      style={{
+        backgroundImage:
+          'url(https://images.unsplash.com/photo-1532423622396-10a3f979251a?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1500&q=80)',
+      }}
+    >
+      <div className="absolute bg-black opacity-60 inset-0 z-0"></div>
+      <div className="max-w-md w-full space-y-8 p-10 bg-white rounded-xl shadow-lg z-10">
+        <div className="grid gap-8 grid-cols-1">
+          <div className="flex flex-col">
+            <div className="flex flex-col sm:flex-row items-center">
+              <h2 className="font-semibold text-lg mr-auto">Profile Setup</h2>
+              <div className="w-full sm:w-auto sm:ml-auto mt-3 sm:mt-0"></div>
+            </div>
+            <div className="mt-5">
+              <form onSubmit={handleSubmit}>
+                <div className="md:space-y-2 mb-3">
+                  <label className="text-xs font-semibold text-gray-600 py-2">
+                    Puskar Roy<abbr className="hidden" title="required">*</abbr>
+                  </label>
+                  <div className="flex items-center py-6">
+                    <div className="w-12 h-12 mr-4 flex-none rounded-xl border overflow-hidden">
+                      {formData.logo && (
+                        <img
+                          className="w-12 h-12 mr-4 object-cover"
+                          src={URL.createObjectURL(formData.logo)}
+                          alt="Avatar Upload"
+                        />
+                      )}
+                    </div>
+                    <label className="cursor-pointer">
+                      <span className="focus:outline-none text-white text-sm py-2 px-4 rounded-full bg-blue-400 hover:bg-blue-500 hover:shadow-lg">
+                        Upload
+                      </span>
+                      <input type="file" className="hidden" onChange={handleFileChange} />
+                    </label>
+                  </div>
+                </div>
+                <div className="md:flex flex-row md:space-x-4 w-full text-xs">
+                  <div className="mb-3 space-y-2 w-full text-xs">
+                    <label className="font-semibold text-gray-600 py-2">
+                      Your Name <abbr title="required">*</abbr>
+                    </label>
+                    <input
+                      placeholder="Name"
+                      className="appearance-none block w-full bg-grey-lighter text-grey-darker border border-grey-lighter rounded-lg h-10 px-4"
+                      required
+                      type="text"
+                      name="companyName"
+                      value={formData.companyName}
+                      onChange={handleInputChange}
+                    />
+                  </div>
+                  <div className="mb-3 space-y-2 w-full text-xs">
+                    <label className="font-semibold text-gray-600 py-2">
+                      Your Mail <abbr title="required">*</abbr>
+                    </label>
+                    <input
+                      placeholder="Email ID"
+                      className="appearance-none block w-full bg-grey-lighter text-grey-darker border border-grey-lighter rounded-lg h-10 px-4"
+                      required
+                      type="email"
+                      name="companyMail"
+                      value={formData.companyMail}
+                      onChange={handleInputChange}
+                    />
+                  </div>
+                </div>
+                <div className="mb-3 space-y-2 w-full text-xs">
+                  <label className="font-semibold text-gray-600 py-2">Company Website</label>
+                  <div className="flex flex-wrap items-stretch w-full mb-4 relative">
+                    <div className="flex">
+                      <span className="flex items-center leading-normal bg-grey-lighter border-1 rounded-r-none border border-r-0 border-blue-300 px-3 whitespace-no-wrap text-grey-dark text-sm w-12 h-10 bg-blue-300 justify-center items-center text-xl rounded-lg text-white">
+                        <svg
+                          xmlns="http://www.w3.org/2000/svg"
+                          className="h-6 w-6"
+                          fill="none"
+                          viewBox="0 0 24 24"
+                          stroke="currentColor"
+                        >
+                          <path
+                            strokeLinecap="round"
+                            strokeLinejoin="round"
+                            strokeWidth="2"
+                            d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+                          />
+                        </svg>
+                      </span>
+                    </div>
+                    <input
+                      type="url"
+                      className="flex-shrink flex-grow flex-auto leading-normal w-px flex-1 border border-l-0 h-10 border-grey-light rounded-lg rounded-l-none px-3 relative focus:border-blue focus:shadow"
+                      placeholder="https://"
+                      name="companyWebsite"
+                      value={formData.companyWebsite}
+                      onChange={handleInputChange}
+                    />
+                  </div>
+                </div>
+                <div className="md:flex md:flex-row md:space-x-4 w-full text-xs">
+                  <div className="w-full flex flex-col mb-3">
+                    <label className="font-semibold text-gray-600 py-2">Your Address</label>
+                    <input
+                      placeholder="Address"
+                      className="appearance-none block w-full bg-grey-lighter text-grey-darker border border-grey-lighter rounded-lg h-10 px-4"
+                      type="text"
+                      name="companyAddress"
+                      value={formData.companyAddress}
+                      onChange={handleInputChange}
+                    />
+                  </div>
+                  <div className="w-full flex flex-col mb-3">
+                    <label className="font-semibold text-gray-600 py-2">
+                      Your Service<abbr title="required">*</abbr>
+                    </label>
+                    <select
+                      className="block w-full bg-grey-lighter text-grey-darker border border-grey-lighter rounded-lg h-10 px-4 md:w-full"
+                      required
+                      name="location"
+                      value={formData.location}
+                      onChange={handleInputChange}
+                    >
+                      <option value="USER">USER</option>
+                      <option value="CHARITY ">CHARITY </option>
+                      <option value="ELECTRICIAN">ELECTRICIAN</option>
+                      <option value="PLUMBER">PLUMBER</option>
+                      <option value="CARPENTER">CARPENTER</option>
+                      
+                    
+                    </select>
+                  </div>
+                </div>
+                <div className="flex-auto w-full mb-1 text-xs space-y-2">
+                  <label className="font-semibold text-gray-600 py-2">Description</label>
+                  <textarea
+                    required
+                    name="description"
+                    className="w-full min-h-[100px] max-h-[300px] h-28 appearance-none block w-full bg-grey-lighter text-grey-darker border border-grey-lighter rounded-lg py-4 px-4"
+                    placeholder="Tell Me About Your Self"
+                    spellCheck="false"
+                    value={formData.description}
+                    onChange={handleInputChange}
+                  ></textarea>
+                </div>
+                <div className="mt-5 text-right md:space-x-3 md:block flex flex-col-reverse">
+                  <button
+                    type="button"
+                    className="mb-2 md:mb-0 bg-white px-5 py-2 text-sm shadow-sm font-medium tracking-wider border text-gray-600 rounded-full hover:shadow-lg hover:bg-gray-100"
+                  >
+                    Cancel
+                  </button>
+                  <button
+                    type="submit"
+                    className="mb-2 md:mb-0 bg-blue-400 px-5 py-2 text-sm shadow-sm font-medium tracking-wider text-white rounded-full hover:shadow-lg hover:bg-blue-500"
+                  >
+                    Submit
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default ProfileSetup;
\ No newline at end of file

From 0d41a763c7c34e2b030abb2cf4f07f6d0047a24c Mon Sep 17 00:00:00 2001
From: Puskar-Roy <puskarroy600@gmail.com>
Date: Sun, 14 Jul 2024 16:22:22 +0530
Subject: [PATCH 2/2] feat : profile socials

---
 apps/frontend/src/components/ProfileSetup.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/frontend/src/components/ProfileSetup.tsx b/apps/frontend/src/components/ProfileSetup.tsx
index c6e5139..8d102f6 100644
--- a/apps/frontend/src/components/ProfileSetup.tsx
+++ b/apps/frontend/src/components/ProfileSetup.tsx
@@ -110,7 +110,7 @@ const ProfileSetup = () => {
                   </div>
                 </div>
                 <div className="mb-3 space-y-2 w-full text-xs">
-                  <label className="font-semibold text-gray-600 py-2">Company Website</label>
+                  <label className="font-semibold text-gray-600 py-2">Your Any Social</label>
                   <div className="flex flex-wrap items-stretch w-full mb-4 relative">
                     <div className="flex">
                       <span className="flex items-center leading-normal bg-grey-lighter border-1 rounded-r-none border border-r-0 border-blue-300 px-3 whitespace-no-wrap text-grey-dark text-sm w-12 h-10 bg-blue-300 justify-center items-center text-xl rounded-lg text-white">