fix: updated production issues

Author: deepraj21

client/src/components/MultiSelect/TagInput.d.ts

@@ -0,0 +1,17 @@
+declare module "@/components/MultiSelect/TagInput" {
+    import { FC } from "react";
+
+    interface Tag {
+        value: string;
+        label: string;
+    }
+
+    interface TagInputProps {
+        selectedTags: Tag[];
+        onTagsChange: (tags: Tag[]) => void;
+    }
+
+    const TagInput: FC<TagInputProps>;
+    export type { Tag }; // Export the Tag type
+    export default TagInput;
+}

client/src/components/MultiSelect/TagInput.jsx

@@ -22,7 +22,7 @@ const TAGS = [
   { value: "fintech", label: "Fintech" },
 ];
 
-export function TagInput({ selectedTags, onTagsChange }) {
+export default function TagInput({ selectedTags, onTagsChange }) {
   const inputRef = React.useRef(null);
   const [open, setOpen] = React.useState(false);
   const [inputValue, setInputValue] = React.useState("");

client/src/lib/userSlice.ts

@@ -16,6 +16,9 @@ const userSlice = createSlice({
   name: 'user',
   initialState,
   reducers: {
+    setUser: (state, action: PayloadAction<UserState>) => {
+            return { ...state, ...action.payload };
+    },
     setUsername(state, action: PayloadAction<string | null>) {
       state.username = action.payload;
     },
@@ -28,5 +31,6 @@ const userSlice = createSlice({
   },
 });
 
-export const { setUsername, setFriends, setFriendStatus } = userSlice.actions;
+export const { setUser, setUsername, setFriends, setFriendStatus } = userSlice.actions;
 export default userSlice.reducer;
+export type { UserState };

client/src/pages/EditProfileForm.tsx

@@ -9,12 +9,17 @@ import { toast } from "sonner";
 
 const backendUrl = import.meta.env.VITE_BACKEND_URL || 'http://localhost:5000';
 
+interface Tag {
+    value: string;
+    label: string;
+}
+
 interface Project {
     id?: number;
     title: string;
     description: string;
     repoLink: string;
-    tags: string[];
+    tags: Tag[];
 }
 
 
@@ -76,10 +81,15 @@ const EditProfileForm: React.FC<EditProfileFormProps> = ({ onProjectAdded }) =>
     const handleProjectChange = (e: React.ChangeEvent<HTMLInputElement>) => {
         const { name, value } = e.target;
         if (selectedProject) {
-            setSelectedProject((prevProject: Project) => ({
-                ...prevProject,
-                [name]: value,
-            }));
+            setSelectedProject((prevProject: Project | null) => {
+                if (prevProject) {
+                    return {
+                        ...prevProject,
+                        [name]: value,
+                    };
+                }
+                return null; // or return a default Project object if you prefer
+            });
         } else {
             setNewProject((prevProject: Project) => ({
                 ...prevProject,
@@ -110,15 +120,14 @@ const EditProfileForm: React.FC<EditProfileFormProps> = ({ onProjectAdded }) =>
     const handleAddProject = async () => {
         try {
             console.log("Tags:", newProject.tags);
-            const tagsString = newProject.tags.map(tag => tag.value).join(",");
-
+            const tagsArray = newProject.tags.map(tag => ({ value: tag, label: tag }));  // Convert Tag objects to strings
 
-            console.log("Adding project:", tagsString);
+            console.log("Adding project:", tagsArray);
             const response = await axios.post(`${backendUrl}/profile/${username}/projects`, {
                 title: newProject.title,
                 description: newProject.description,
                 repo_link: newProject.repoLink,
-                tags: tagsString,
+                tags: tagsArray, // Use the formatted tagsArray
             }, { withCredentials: true });
             if(response.status === 200)
                 // console.log("Project added successfully:", );
@@ -356,8 +365,8 @@ const EditProfileForm: React.FC<EditProfileFormProps> = ({ onProjectAdded }) =>
                     <div>
                         <Label>Project Tags</Label>
                         <TagInput
-                            selectedTags={newProject.tags}
-                            onTagsChange={(tags: string[]) => setNewProject({ ...newProject, tags })}
+                            selectedTags={newProject.tags} // This should be an array of Tag objects
+                            onTagsChange={(tags: Tag[]) => setNewProject({ ...newProject, tags })} // Ensure tags are of type Tag[]
                         />
 
                     </div>

client/src/pages/Profile.tsx

@@ -18,10 +18,15 @@ interface ProfileProps {
   username: string;
 }
 
+export interface Tag {
+  value: string;
+  label: string;
+}
+
 interface Project {
   description: string;
   repoLink: string;
-  tags: string[];
+  tags: Tag[];
   title: string;
   repo?: string; 
   link?: string;