Skip to content

[176] Feature customize user profile#127

Merged
BhuvanArn merged 61 commits into
stagingfrom
176-feature-customize-user-profile
Apr 15, 2026
Merged

[176] Feature customize user profile#127
BhuvanArn merged 61 commits into
stagingfrom
176-feature-customize-user-profile

Conversation

@badarouzia
Copy link
Copy Markdown
Collaborator

@badarouzia badarouzia commented Mar 31, 2026

What type of PR is this? (check all applicable)

  • ✨ Feature
  • 🛑 Bug
  • ⚠️ Anomaly
  • 📝 Doc
  • 🎨 Style
  • 🧑‍💻 Refactor
  • 🛠️ Setup
  • 🏗️ Build
  • 🔥 Perfs
  • ✅ Test
  • 🔁 CI
  • ⏩ Revert

Description

This PR updates the Profile management system to improve user data collection and provide a more interactive settings experience. Key updates include the addition of customisation settings , the implementation of a functional avatar management menu, and the population of the notification settings tab

Key Features & Enhancements

  1. Identity & Contact Management (GeneralSettings)

    New Contact Fields: Integrated a Phone Number field synchronized with the global profile state.

    Dynamic Username: Implemented an auto-generating, read-only username field based on the user's First and Last names.

    Layout Optimization: Reorganized the "About & Contact" section into a responsive grid for better alignment of professional titles, LinkedIn links, and phone numbers.

  2. Interactive Avatar System

    Contextual Menu: Added a dropdown menu (triggered by a camera icon) allowing users to "Choose Photo", "Take Photo", or "Delete".

    Smart UI Logic: Implemented useRef and useEffect hooks to handle click-outside detection, ensuring the avatar menu closes automatically when the user clicks elsewhere.

    Visual Feedback: Real-time initials generation and background color syncing within the avatar circle.

  3. Appearance & Banner Customization

    Style Cycling: Added a "Cycle Style" feature for the profile banner, allowing users to switch between "Minimal", "Ocean", and "Night" presets instantly.

  4. Notification Engine (NotifSettings)

    Preset Integration: Replaced the empty notification state with a robust DEFAULT_NOTIFS data structure.

    Toggle Logic: Implemented a functional toggleNotif handler to manage preferences for training reminders, messages, and weekly reports.

    Type Safety: Refined TypeScript interfaces for props and state management.

Linked GitHub Ticket

Closes EpitechPromo2027/G-EIP-600-NAN-6-1-eip-tugdual.de-reviers#176

Workspace

  • 🖥️ Web
  • 🛠️ Server
  • 🔁 CI
  • 🤖 Ai
  • 📱 App

Screenshots

Screenshot from 2026-03-31 11-26-45 Screenshot from 2026-03-31 11-27-17 Screenshot from 2026-03-31 11-26-57

@railway-app
Copy link
Copy Markdown

railway-app Bot commented Mar 31, 2026

This PR was not deployed automatically as @badarouzia does not have access to the Railway project.

In order to get automatic PR deploys, please add @badarouzia to your workspace on Railway.

BhuvanArn added 16 commits April 9, 2026 19:00
…n GeneralSettings and NotifSettings components
@BhuvanArn BhuvanArn merged commit 151d1f5 into staging Apr 15, 2026
5 checks passed
@BhuvanArn BhuvanArn deleted the 176-feature-customize-user-profile branch April 15, 2026 09:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants