NexGenStudioDev/ciitm-frontend

Create Profile Page Based on Figma Design

Ouverte

#145 ouverte le 13 avr. 2025

Voir sur GitHubGuide contributeur
 (15 commentaires) (1 réaction) (2 personnes assignées)JavaScript (39 forks)auto 404
Ciitm FrontendImportantResponsiveUi Updateatomic-designbest-practicesenhancementfeature-requestgood first issuehelp wantedonlydust-wave

Métriques du dépôt

Stars
 (9 étoiles)
Métriques de merge PR
 (Métriques PR en attente)

Description

This page allows Admin to view and edit their profile information and social media links, Admins can update their profile picture, name, email, and social links using an intuitive UI.

🖼️ UI Features

Display Admin details:

  • Avatar (Profile Picture)
  • Name
  • Email
  • Social Media Links (Twitter, LinkedIn, GitHub, etc.)

Edit Mode:

  • Clicking the 🖉 (pencil) icon enables editing of the corresponding fields.
  • Profile picture can be uploaded.
  • Social links can be added or updated.

🔄 API Integration

📥 Fetch Existing Admin Info & Social Links

  • fetch profile data and links from the backend.

✏️ Update Admin Profile

PUT /api/admin/profile/edit

✏️ Update Social Link

PUT /api/admin/edit/social/link

Create Social Link

POST  /create/social/link

Figma Link https://www.figma.com/design/gcA03937R5YsmJbQHobc0Z/Untitled?node-id=1-3&t=JHtjXIfau2KAXEVq-0

Guide contributeur

Direction de recherche
Implémentez l'interface de la page de profil basée sur la conception Figma et intégrez la avec les points de terminaison API fournis pour récupérer et mettre à jour le profil de l'administrateur et les liens sociaux.
Stack technique
javascriptreact
Domaine
frontend
Type d'issue
Fonctionnalité
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
Une demi journée
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
ReactAPI Integration
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
65