Animate task count number when it changes 🔢
Les mainteneurs répondent en général sous 2 jours
Évaluation
- Difficulté
- 1/5
- Temps estimé
- 1-3 heures
- Accessibilité débutants
- 95/100
- Type d'issue
- Fonctionnalité
- Clarté
- Clairement spécifiée
- Activité
- Active
- Stack technique
- javascript, react, tailwindcss
- Domaine
- frontend
Piste de recherche
Commence par client/src/pages/Dashboard.jsx et repère l’élément span du compteur de tâches dans la barre de navigation. Utilise l’approche proposée dans l’issue avec useState, useRef et useEffect pour déclencher l’animation lorsque tasks.length change, puis vérifie que le compteur s’affiche toujours correctement et que la classe d’animation est supprimée après le timeout.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Description
Animate task count number when it changes 🔢
File: client/src/pages/Dashboard.jsx
Task count in navbar just instantly
changes with no animation 💀 fr!!
Fix:
const [countAnim, setCountAnim] = useState(false)
const prevCount = useRef(tasks.length)
useEffect(() => {
if (prevCount.current !== tasks.length) {
setCountAnim(true)
setTimeout(() => setCountAnim(false), 400)
prevCount.current = tasks.length
}
}, [tasks.length])
<span className={text-xs transition-transform ${countAnim ? 'scale-125 text-purple-400' : 'text-[#666]'}}>
{tasks.length} tasks
~8 lines! No backend needed 🎯
- Langage dominant
- JavaScript
- Étoiles
- 39
- Forks
- 105
- Merge moyen
- 1 j 13 h
- PR mergées (30 j)
- 41
Préparer son environnement
- Aucun Dockerfile ni fichier Docker Compose
- Aucun modèle de pull request
- Lire le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Autres issues de anoopcodehack/DevBoard
-
good first issue
Difficulté 1/5 Moins d'une heure Accessibilité débutants 96/100
anoopcodehack/DevBoard#639 ·
Les mainteneurs répondent en général sous 2 jours
-
Improve tags input placeholder with examples 🏷️Peut-être pris @SwatiManjari l’a pris aujourd’hui. Ouvertegood first issue
Difficulté 1/5 Moins d'une heure Accessibilité débutants 96/100
anoopcodehack/DevBoard#638 ·
Les mainteneurs répondent en général sous 2 jours
-
Add "Clear" link next to done count in column header 🗑️Peut-être pris Une pull request liée à cette issue est ouverte ou déjà fusionnée. Ouvertegood first issue
Difficulté 1/5 Moins d'une heure Accessibilité débutants 96/100
anoopcodehack/DevBoard#637 ·
Les mainteneurs répondent en général sous 2 jours
-
Show current task name in browser tab during Pomodoro ⏱️Peut-être pris @SwatiManjari l’a pris aujourd’hui. Ouvertegood first issue
Difficulté 1/5 Moins d'une heure Accessibilité débutants 95/100
anoopcodehack/DevBoard#636 ·
Les mainteneurs répondent en général sous 2 jours
-
enhancement good first issue
Difficulté 2/5 1-3 heures Accessibilité débutants 70/100
anoopcodehack/DevBoard#630 ·
Les mainteneurs répondent en général sous 2 jours
Toutes les issues de anoopcodehack/DevBoard
Issues similaires
-
fix(套件): test_bundle 往仓库的 preset/skills 写哨兵，并发跑的 test_installer 拷贝时撞 ENOENT（CI 红）Peut-être pris @Miaotofu01 l’a pris aujourd’hui. Ouverteneeds-triage
Difficulté 2/5 1-3 heures Accessibilité débutants 78/100
Miaotofu01/Study-Mate#216 · 1 commentaire ·
Les mainteneurs répondent en général sous 1 jour
-
Difficulté 1/5 Moins d'une heure Accessibilité débutants 78/100
-
beginner-friendly category:fixtures community enhancement first-timers-only good first issue hacktoberfest help wanted low hanging fruit micro-contribution type: task up-for-grabs
Difficulté 1/5 Moins d'une heure Accessibilité débutants 85/100
Berserk-hub150/skillhawk#229 · 1 commentaire ·
Les mainteneurs répondent en général sous 8 jours
-
WlanConfUpdateSensor falsely reports wifi interface appearing when sysfs inode cache is reclaimedOuverte
Difficulté 2/5 1-3 heures Accessibilité débutants 82/100
firewalla/firerouter#2180 ·
Les mainteneurs répondent en général sous 1 jour
-
Difficulté 2/5 1-3 heures Accessibilité débutants 84/100
andromarces/agent-loops#976 ·
Les mainteneurs répondent en général sous 1 jour