تجربه: 3

سن: 18 الی 30

محدوده حقوق و دستمزد: قابل مذاکره

جای خالی: 1

طبیعت شغلی : پیمانی

تاریخ ارسال : 2026.06.21

آخرین تاریخ : 2026.09.29

در این تسک، فرانت‌اند نسخه React متارنگ باید به‌گونه‌ای توسعه داده شود که پس از ورود شهروند به سامانه، وضعیت اتصال کیف پول را از طریق فیلد جدید دریافتی از Backend بررسی نماید. در صورتی که کیف پول شهروند به حساب کاربری متصل نباشد، سامانه باید کاربر را جهت اتصال کیف پول راهنمایی کند و امکان برقراری ارتباط مستقیم با کیف پول را در اختیار وی قرار دهد.

هدف از این توسعه، تکمیل فرآیند اتصال حساب کاربری شهروندان به کیف پول دیجیتال و ایجاد بستری جهت مدیریت دارایی‌های متاورسی در آینده است.

---

وظایف

• دریافت و پردازش فیلد جدید وضعیت اتصال کیف پول از Backend.
• بررسی وضعیت اتصال کیف پول پس از ورود شهروند به سامانه.
• نمایش پاپ‌آپ اتصال کیف پول در صورتی که وضعیت اتصال کیف پول False باشد.
• استفاده از ساختار فعلی پاپ‌آپ قفل امنیت حساب شهروندی جهت نمایش پیام اتصال کیف پول.
• تغییر محتوای پاپ‌آپ به متن مربوط به اتصال کیف پول.
• نمایش دکمه «اتصال به ولت» در پاپ‌آپ.
• اتصال دکمه «اتصال به ولت» به فرآیند اتصال کیف پول از طریق MetaMask.
• باز شدن پاپ‌آپ MetaMask پس از کلیک کاربر روی دکمه اتصال به ولت.
• دریافت اطلاعات کیف پول پس از تأیید کاربر در MetaMask.
• ارسال اطلاعات کیف پول متصل‌شده به Backend.
• مدیریت صحیح وضعیت موفق یا ناموفق بودن فرآیند اتصال کیف پول.

---

بخش‌های اجرایی

مدیریت پاپ‌آپ اتصال کیف پول

• نمایش پاپ‌آپ تنها در صورتی که فیلد وضعیت اتصال کیف پول برابر False باشد.
• در صورت بسته شدن پاپ‌آپ توسط کاربر، تا پایان همان Session مجدداً نمایش داده نشود.
• در صورت Refresh صفحه، پاپ‌آپ مجدداً نمایش داده نشود.
• در ورود بعدی کاربر به سامانه، در صورتی که کیف پول همچنان متصل نباشد، پاپ‌آپ مجدداً نمایش داده شود.

اتصال به MetaMask

• پیاده‌سازی فرآیند اتصال به کیف پول MetaMask.
• دریافت آدرس کیف پول کاربر پس از تأیید اتصال.
• ارسال اطلاعات کیف پول به Backend.
• بروزرسانی وضعیت اتصال پس از دریافت پاسخ موفق از Backend.

توسعه منوی سامانه

• افزودن گزینه جدید با عنوان «اتصال به ولت» در منوی سامانه.
• نمایش وضعیت اتصال کیف پول از طریق رنگ‌بندی این گزینه.
• در صورتی که کیف پول متصل نباشد، گزینه در حالت عادی نمایش داده شود.
• در صورتی که اتصال کیف پول برقرار باشد، گزینه به رنگ سبز نمایش داده شود.
• امکان کلیک روی گزینه و اجرای فرآیند اتصال کیف پول در هر زمان.

مدیریت وضعیت اتصال

• وضعیت سبز بودن گزینه اتصال به ولت صرفاً زمانی نمایش داده شود که اتصال کیف پول با موفقیت برقرار شده باشد.
• ورود کاربر از طریق ایمیل به تنهایی نباید باعث سبز شدن وضعیت اتصال به ولت شود.
• تنها اتصال موفق کیف پول به حساب شهروندی معیار فعال شدن وضعیت متصل بودن کیف پول خواهد بود.

رابط کاربری و تجربه کاربری

• هماهنگی کامل با سیستم دیزاین متارنگ.
• رعایت نسخه‌های موبایل و دسکتاپ.
• رعایت حالت‌های Light Mode و Dark Mode.
• حفظ یکپارچگی ظاهری با سایر بخش‌های سامانه.

---

خروجی مورد نظر

• دریافت وضعیت اتصال کیف پول از Backend و مدیریت آن در فرانت React.
• نمایش پاپ‌آپ اتصال کیف پول برای کاربران فاقد کیف پول متصل.
• امکان اتصال کیف پول از طریق MetaMask.
• ارسال اطلاعات کیف پول به Backend پس از اتصال موفق.
• افزودن گزینه «اتصال به ولت» در منوی سامانه.
• نمایش وضعیت اتصال کیف پول به‌صورت بصری در منو.
• جلوگیری از نمایش مکرر پاپ‌آپ در طول Session جاری.
• سازگاری کامل با نسخه‌های موبایل، دسکتاپ، لایت و دارک.
• هماهنگی کامل با سیستم دیزاین متارنگ.