اسکیما ولدیشن در ریداکس

صورت مساله:

فرض کنید یه json از یه rest api گرفتید و حالا میخواید بر اساس مقادیری که فرض میکنید توی این json هست دیتا هاتونو نمایش بدید. یه جاهاییش احتمالا array هست، یه جاهایی string یه جاهایی object و غیره. ولی فرض کنید دیتاها خراب باشن، یعنی اونجایی که توقع دارید array باشه یهو string بگیرید یا کلا اون key توی ریسپانس سرور وجود نداشه باشه و اینجاست که قطعا اررور پارسر جاوااسکریپت رو میگیرید. راه حل چیه؟

احتمالا میدونید که وقتی یه برنامه نویس جاوا یه json از یک سرویس میگیره اولین کاری که میکنه اینه که این json رو بر اساس مدلی که تعریف کرده پارس میکنه، بنابر این اگر مقادیری که انتظار داشته دریافت کنه، وجود نداشته باشن یا تایپ هاشون متفاوت باشه کل پروسه میره توو دیوار و همینجا اکسپشن میگیره و ادامه کد ها اجرا نمیشه و میتونه خطای مناسب نمایش بده ولی ما وقتی یه json میگیریم میریزیمش توی استور ریداکسمون و بعد مستقیم ازش استفاده میکنیم.

پس PropTypes ها چی؟!

به نظر میاد propTypes ها بیشتر کارکرد مستند سازی props هارو بر عهده دارن و اگر مقداری متفاوت با تعریفشون وارد بشه فقط اخطار توی کنسول میگیرید که همونم توی محیط پروداکشن نمیگیرید!

خب if ... else statement ها چی؟!

اولا یه کم نامرتب و کثیف هستن، دوما اولا.

هووم، optional chaining چی؟

مشخصه که سینتکسش تمیز تره ولی بازم best practice نیست. بعلاوه اینکه باید هر جای دیگه ای که میخواید کاری با این دیتا انجام بدید باز باید یه if دیگه بنویسید. و البته این مزیت وجود نداره که در یک سطح بالاتر کل خطاهای مربوط به خراب بودن دیتای api یکجا هدل بشه و خطای مناسب نمایش داده بشه.

راه حل چیه؟

این وقت ها بهتره که از schema validation برای اعتبارسنجی ریسپانسی که از سرور دریافت میکنید داشته باشید.

Yup: Dead simple Object schema validation

احتمالا قبلا از Yup توی Formik استفاده کردید. اونجاکارکردش اینه که دیتایی که کاربر توی فرم وارد میکنه ارو چک میکنه و این امکان رو میده که دکمه submit فرم رو غیر فعال کنید یا خطای مناسب برای هر فیلد نمایش بدید.

پیاده سازی

فرض کنید ما یه اکشن داریم که میره یه ریکوئست میزنه، اگر response سالم باشه اکشن success رو dispatch میکنه و اگر نه failure رو dispatch میکنه. خیلی ساده.

حالا میتونیم یه اسکیما برای مقدار response بنویسیم و معتبر بودنش روچک کنیم و اگر معتبر نبود مثلا مقدار NOT_VALID رو dispatch کنیم.

تمام!