{['candidate', 'company'].map((type) => (
@@ -262,4 +238,4 @@ const SignupForm = () => {
);
};
-export default SignupForm;
+export default SignupForm;
\ No newline at end of file
diff --git a/frontend/src/pages/candidate/CandidateProfile.jsx b/frontend/src/pages/candidate/CandidateProfile.jsx
index abcc83b..6bdbf17 100644
--- a/frontend/src/pages/candidate/CandidateProfile.jsx
+++ b/frontend/src/pages/candidate/CandidateProfile.jsx
@@ -1,140 +1,190 @@
-import { useState } from 'react';
-import { User, Mail, Camera } from 'lucide-react';
-import { useAuth } from '../../hooks/useAuth';
-import { useAuthStore } from '../../store/authStore';
-import { useFileUpload } from '../../hooks/useFileUpload';
-import { validateImageFile } from '../../utils/validators';
-import toast from 'react-hot-toast';
-
-const CandidateProfile = () => {
- const { user, profile } = useAuth();
- const { updateProfile } = useAuthStore();
- const { uploadFile, isUploading } = useFileUpload();
- const [selectedImage, setSelectedImage] = useState(null);
-
- const handleImageSelect = async (e) => {
- const file = e.target.files[0];
- if (!file) return;
-
- const errors = validateImageFile(file);
- if (errors.length > 0) {
- toast.error(errors.join(', '));
- return;
- }
-
- setSelectedImage(file);
- };
-
- const handleUploadProfilePic = async () => {
- if (!selectedImage) return;
-
- try {
- await uploadFile(selectedImage, async (base64) => {
- await updateProfile(base64);
- });
- setSelectedImage(null);
- } catch (error) {
- console.error('Upload failed:', error);
- }
- };
-
- return (
-
-
-
My Profile
-
Manage your profile information
-
-
-
-
-
-
-
- {profile?.profile_pic ? (
-
- ) : (
-
-
-
- )}
-
-
-
-
-
- {selectedImage && (
-
- )}
-
-
-
-
-
-
-
-
-
- );
-};
-
+import { useState } from 'react';
+import { User, Mail, Camera, Trash2 } from 'lucide-react';
+import { useAuth } from '../../hooks/useAuth';
+import { useAuthStore } from '../../store/authStore';
+import { useFileUpload } from '../../hooks/useFileUpload';
+import { validateImageFile } from '../../utils/validators';
+import toast from 'react-hot-toast';
+
+const CandidateProfile = () => {
+ const { user, profile } = useAuth();
+ const { updateProfile, removeProfilePic } = useAuthStore();
+ const { uploadFile, isUploading } = useFileUpload();
+ const [selectedImage, setSelectedImage] = useState(null);
+ const [isRemoving, setIsRemoving] = useState(false);
+
+ const handleImageSelect = async (e) => {
+ const file = e.target.files[0];
+ if (!file) return;
+
+ const errors = validateImageFile(file);
+ if (errors.length > 0) {
+ toast.error(errors.join(', '));
+ return;
+ }
+
+ setSelectedImage(file);
+ };
+
+ const handleUploadProfilePic = async () => {
+ if (!selectedImage) return;
+
+ try {
+ await uploadFile(selectedImage, async (base64) => {
+ await updateProfile(base64);
+ });
+ setSelectedImage(null);
+ // Reset file input
+ const input = document.getElementById('profile-pic-input');
+ if (input) input.value = '';
+ } catch (error) {
+ console.error('Upload failed:', error);
+ }
+ };
+
+ const handleRemoveProfilePic = async () => {
+ if (!window.confirm('Are you sure you want to remove your profile picture?')) return;
+
+ setIsRemoving(true);
+ try {
+ await removeProfilePic();
+ // Clear any pending file selection too
+ setSelectedImage(null);
+ const input = document.getElementById('profile-pic-input');
+ if (input) input.value = '';
+ } catch (error) {
+ console.error('Remove failed:', error);
+ } finally {
+ setIsRemoving(false);
+ }
+ };
+
+ return (
+
+
+
My Profile
+
Manage your profile information
+
+
+
+
+
+ {/* Avatar */}
+
+
+ {profile?.profile_pic ? (
+
+ ) : (
+
+
+
+ )}
+
+
+
+ {/* Upload controls */}
+
+
+
+
+ {/* Upload button — only shown when a file is selected */}
+ {selectedImage && (
+
+ )}
+
+ {/* Remove button — only shown when a profile pic exists */}
+ {profile?.profile_pic && !selectedImage && (
+
+ )}
+
+
+
+ JPG, PNG or WebP · Max 2MB
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
export default CandidateProfile;
\ No newline at end of file
diff --git a/frontend/src/pages/company/CompanyProfile.jsx b/frontend/src/pages/company/CompanyProfile.jsx
index 0108c94..0da90e6 100644
--- a/frontend/src/pages/company/CompanyProfile.jsx
+++ b/frontend/src/pages/company/CompanyProfile.jsx
@@ -1,140 +1,188 @@
-import { useState } from 'react';
-import { Building, Mail, Camera } from 'lucide-react';
-import { useAuth } from '../../hooks/useAuth';
-import { useAuthStore } from '../../store/authStore';
-import { useFileUpload } from '../../hooks/useFileUpload';
-import { validateImageFile } from '../../utils/validators';
-import toast from 'react-hot-toast';
-
-const CompanyProfile = () => {
- const { user, profile } = useAuth();
- const { updateProfile } = useAuthStore();
- const { uploadFile, isUploading } = useFileUpload();
- const [selectedImage, setSelectedImage] = useState(null);
-
- const handleImageSelect = async (e) => {
- const file = e.target.files[0];
- if (!file) return;
-
- const errors = validateImageFile(file);
- if (errors.length > 0) {
- toast.error(errors.join(', '));
- return;
- }
-
- setSelectedImage(file);
- };
-
- const handleUploadLogo = async () => {
- if (!selectedImage) return;
-
- try {
- await uploadFile(selectedImage, async (base64) => {
- await updateProfile(base64);
- });
- setSelectedImage(null);
- } catch (error) {
- console.error('Upload failed:', error);
- }
- };
-
- return (
-
-
-
Company Profile
-
Manage your company information
-
-
-
-
-
-
-
- {profile?.profile_pic ? (
-
- ) : (
-
-
-
- )}
-
-
-
-
-
- {selectedImage && (
-
- )}
-
-
-
-
-
-
-
-
-
- );
-};
-
+import { useState } from 'react';
+import { Building, Mail, Camera, Trash2 } from 'lucide-react';
+import { useAuth } from '../../hooks/useAuth';
+import { useAuthStore } from '../../store/authStore';
+import { useFileUpload } from '../../hooks/useFileUpload';
+import { validateImageFile } from '../../utils/validators';
+import toast from 'react-hot-toast';
+
+const CompanyProfile = () => {
+ const { user, profile } = useAuth();
+ const { updateProfile, removeProfilePic } = useAuthStore();
+ const { uploadFile, isUploading } = useFileUpload();
+ const [selectedImage, setSelectedImage] = useState(null);
+ const [isRemoving, setIsRemoving] = useState(false);
+
+ const handleImageSelect = async (e) => {
+ const file = e.target.files[0];
+ if (!file) return;
+
+ const errors = validateImageFile(file);
+ if (errors.length > 0) {
+ toast.error(errors.join(', '));
+ return;
+ }
+
+ setSelectedImage(file);
+ };
+
+ const handleUploadLogo = async () => {
+ if (!selectedImage) return;
+
+ try {
+ await uploadFile(selectedImage, async (base64) => {
+ await updateProfile(base64);
+ });
+ setSelectedImage(null);
+ const input = document.getElementById('company-logo-input');
+ if (input) input.value = '';
+ } catch (error) {
+ console.error('Upload failed:', error);
+ }
+ };
+
+ const handleRemoveLogo = async () => {
+ if (!window.confirm('Are you sure you want to remove your company logo?')) return;
+
+ setIsRemoving(true);
+ try {
+ await removeProfilePic();
+ setSelectedImage(null);
+ const input = document.getElementById('company-logo-input');
+ if (input) input.value = '';
+ } catch (error) {
+ console.error('Remove failed:', error);
+ } finally {
+ setIsRemoving(false);
+ }
+ };
+
+ return (
+
+
+
Company Profile
+
Manage your company information
+
+
+
+
+
+ {/* Avatar / Logo */}
+
+
+ {profile?.profile_pic ? (
+
+ ) : (
+
+
+
+ )}
+
+
+
+ {/* Upload controls */}
+
+
+
+
+ {/* Upload button — only shown when a file is selected */}
+ {selectedImage && (
+
+ )}
+
+ {/* Remove button — only shown when a logo exists */}
+ {profile?.profile_pic && !selectedImage && (
+
+ )}
+
+
+
+ JPG, PNG or WebP · Max 2MB
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
export default CompanyProfile;
\ No newline at end of file
diff --git a/frontend/src/store/authStore.js b/frontend/src/store/authStore.js
index fd1b02c..437bb7e 100644
--- a/frontend/src/store/authStore.js
+++ b/frontend/src/store/authStore.js
@@ -71,11 +71,25 @@ export const useAuthStore = create((set, get) => ({
const updatedProfile = await authAPI.updateProfile(profilePic);
set({ profile: updatedProfile });
localStorage.setItem('profile', JSON.stringify(updatedProfile));
- toast.success('Profile updated successfully');
+ toast.success('Profile picture updated successfully');
return updatedProfile;
} catch (error) {
- toast.error('Failed to update profile');
+ toast.error('Failed to update profile picture');
throw error;
}
},
-}));
+
+ // NEW: remove profile picture
+ removeProfilePic: async () => {
+ try {
+ const updatedProfile = await authAPI.removeProfilePic();
+ set({ profile: updatedProfile });
+ localStorage.setItem('profile', JSON.stringify(updatedProfile));
+ toast.success('Profile picture removed');
+ return updatedProfile;
+ } catch (error) {
+ toast.error('Failed to remove profile picture');
+ throw error;
+ }
+ },
+}));
\ No newline at end of file