feat(native-app): add vaccinations to app (#16659)

* feat: update finance card UI

* feat: final touches to finance screen

* feat: first version of vaccinations unfiltered

* feat: animate arrow when expanding card

* feat: adding loading states and proper link handling

* feat: add tab buttons except animation is left

* feat: add animation for tab buttons

* feat: remove bottom tab bar from vaccinations page

* feat: add feature flag for vaccinations

* fix: key warning

* feat: add english translations

* feat: rename vaccinations card container to vaccinations card

* feat: rename finance status card container to be just finance status card

* fix: don't show badge if status or statusName is undefined

* fix: warning about shadow for expandable card

* fix: accessibility role for tab buttons should be tablist instead of tabbar

* fix: remove eas file

* fix: rename isOpen

* fix: better accessibility for tab buttons

* set selected state to accessibilityState for tab-buttons

* fix: use ButtonProps from Button in select-button

* feat: add error handling to vaccinations screen

* fix: minor fixes

* fix: reusable buttonStyle for health buttons

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

apps/native/app/package.json

@@ -78,6 +78,7 @@
     "react-native-interactable": "2.0.1",
     "react-native-keyboard-manager": "6.5.4-3",
     "react-native-keychain": "8.1.1",
+    "react-native-markdown-display": "7.0.2",
     "react-native-mmkv-storage": "0.9.1",
     "react-native-navigation": "7.40.0",
     "react-native-navigation-hooks": "6.3.0",

apps/native/app/src/graphql/queries/health.graphql

@@ -49,3 +49,31 @@ query GetPaymentStatus {
     maximumMonthlyPayment
   }
 }
+
+query GetVaccinations {
+  healthDirectorateVaccinations {
+    vaccinations {
+      id
+      name
+      description
+      isFeatured
+      status
+      statusName
+      statusColor
+      lastVaccinationDate
+      vaccinationsInfo {
+        id
+        name
+        date
+        age {
+          years
+          months
+        }
+        url
+        comment
+        rejected
+      }
+      comments
+    }
+  }
+}

apps/native/app/src/messages/en.ts

@@ -609,7 +609,7 @@ export const en: TranslatedMessages = {
   'updateApp.button': 'Update',
   'updateApp.buttonSkip': 'Skip',
 
-  // health
+  // health - overview
   'health.overview.screenTitle': 'Health',
   'health.overview.title': 'My health',
   'health.overview.description':
@@ -628,11 +628,28 @@ export const en: TranslatedMessages = {
   'health.overview.paymentCredit': 'Credit',
   'health.overview.paymentDebt': 'Debt',
   'health.overview.therapy': 'Therapy',
+  'health.overview.vaccinations': 'Vaccinations',
   'health.overview.aidsAndNutrition': 'Aids and nutrition',
   'health.overview.medicinePurchase': 'Medicine purchase',
   'health.overview.period': 'Period',
   'health.overview.levelStatus': 'Medicine step',
   'health.overview.levelStatusValue': 'Level {level}, you pay {percentage}%',
   'health.overview.medicinePurchaseNoActivePeriodWarning':
     'A new payment period begins with the next medicine purchase',
+
+  // health - vaccinations
+  'health.vaccinations.screenTitle': 'Vaccinations',
+  'health.vaccinations.title': 'Vaccinations',
+  'health.vaccinations.description':
+    'Here you can see a list of vaccines you have received, vaccination status and other information.',
+  'health.vaccinations.generalVaccinations': 'General vaccinations',
+  'health.vaccinations.otherVaccinations': 'Other vaccinations',
+  'health.vaccinations.number': 'No.',
+  'health.vaccinations.date': 'Date',
+  'health.vaccinations.age': 'Age',
+  'health.vaccinations.vaccine': 'Vaccine',
+  'health.vaccinations.noVaccinations': 'No vaccinations recorded',
+  'health.vaccinations.noVaccinationsDescription':
+    'If you believe you have data that should appear here, please contact service provider.',
+  'health.vaccinations.directorateOfHealth': 'The directorate of Health',
 }

apps/native/app/src/messages/is.ts

@@ -609,7 +609,7 @@ export const is = {
   'updateApp.button': 'Uppfæra',
   'updateApp.buttonSkip': 'Sleppa',
 
-  // health
+  // health - overview
   'health.overview.screenTitle': 'Heilsa',
   'health.overview.title': 'Heilsan mín',
   'health.overview.description':
@@ -628,6 +628,7 @@ export const is = {
   'health.overview.paymentCredit': 'Inneign',
   'health.overview.paymentDebt': 'Skuld',
   'health.overview.therapy': 'Þjálfun',
+  'health.overview.vaccinations': 'Bólusetningar',
   'health.overview.aidsAndNutrition': 'Hjálpartæki og næring',
   'health.overview.medicinePurchase': 'Lyfjakaup',
   'health.overview.period': 'Tímabil',
@@ -636,4 +637,20 @@ export const is = {
     'Greiðsluþrep {level}, þú greiðir {percentage}%',
   'health.overview.medicinePurchaseNoActivePeriodWarning':
     'Nýtt greiðslutímabil hefst við næstu lyfjakaup',
+
+  // health - vaccinations
+  'health.vaccinations.screenTitle': 'Bólusetningar',
+  'health.vaccinations.title': 'Bólusetningar',
+  'health.vaccinations.description':
+    'Hér getur þú séð lista yfir bóluefni sem þú hefur fengið, stöðu bólusetningar og aðrar upplýsingar.',
+  'health.vaccinations.generalVaccinations': 'Almennar bólusetningar',
+  'health.vaccinations.otherVaccinations': 'Aðrar bólusetningar',
+  'health.vaccinations.number': 'Nr.',
+  'health.vaccinations.date': 'Dags.',
+  'health.vaccinations.age': 'Aldur',
+  'health.vaccinations.vaccine': 'Bóluefni',
+  'health.vaccinations.noVaccinations': 'Engar bólusetningar skráðar',
+  'health.vaccinations.noVaccinationsDescription':
+    'Ef þú telur þig eiga gögn sem ættu að birtast hér, vinsamlegast hafðu samband við þjónustuaðila.',
+  'health.vaccinations.directorateOfHealth': 'Embætti landlæknis',
 }