diff --git a/android/app/build.gradle b/android/app/build.gradle
index 2ccee560..7917ca20 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -139,8 +139,8 @@ android {
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
missingDimensionStrategy 'react-native-camera', 'general'
- versionCode 55
- versionName "2.3.1"
+ versionCode 56
+ versionName "2.3.2"
buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
if (isNewArchitectureEnabled()) {
diff --git a/ios/pingpingNative.xcodeproj/project.pbxproj b/ios/pingpingNative.xcodeproj/project.pbxproj
index 27b5f794..fcc0445e 100644
--- a/ios/pingpingNative.xcodeproj/project.pbxproj
+++ b/ios/pingpingNative.xcodeproj/project.pbxproj
@@ -529,7 +529,7 @@
CODE_SIGN_ENTITLEMENTS = pingpingNative/pingpingNative.entitlements;
CODE_SIGN_IDENTITY = "Apple Development";
CODE_SIGN_STYLE = Automatic;
- CURRENT_PROJECT_VERSION = 55;
+ CURRENT_PROJECT_VERSION = 56;
DEVELOPMENT_TEAM = 39J4LQT4VN;
ENABLE_BITCODE = NO;
GCC_PREPROCESSOR_DEFINITIONS = (
@@ -561,7 +561,7 @@
CODE_SIGN_ENTITLEMENTS = pingpingNative/pingpingNative.entitlements;
CODE_SIGN_IDENTITY = "Apple Development";
CODE_SIGN_STYLE = Automatic;
- CURRENT_PROJECT_VERSION = 55;
+ CURRENT_PROJECT_VERSION = 56;
DEVELOPMENT_TEAM = 39J4LQT4VN;
INFOPLIST_FILE = pingpingNative/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
diff --git a/ios/pingpingNative/Info.plist b/ios/pingpingNative/Info.plist
index 7c26bbba..e341c69a 100644
--- a/ios/pingpingNative/Info.plist
+++ b/ios/pingpingNative/Info.plist
@@ -19,7 +19,7 @@
CFBundlePackageType
APPL
CFBundleShortVersionString
- 2.3.1
+ 2.3.2
CFBundleSignature
????
CFBundleURLTypes
@@ -34,7 +34,7 @@
CFBundleVersion
- 55
+ 56
LSRequiresIPhoneOS
NSAppTransportSecurity
diff --git a/ios/pingpingNativeTests/Info.plist b/ios/pingpingNativeTests/Info.plist
index d8c75d38..2c132c93 100644
--- a/ios/pingpingNativeTests/Info.plist
+++ b/ios/pingpingNativeTests/Info.plist
@@ -15,10 +15,10 @@
CFBundlePackageType
BNDL
CFBundleShortVersionString
- 2.3.1
+ 2.3.2
CFBundleSignature
????
CFBundleVersion
- 55
+ 56
diff --git a/package.json b/package.json
index 8444f3f4..c86fbb8b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "pingpingNative",
- "version": "2.3.1",
+ "version": "2.3.2",
"private": true,
"scripts": {
"android": "react-native run-android",
diff --git a/src/components/account/AccountBlockButton.js b/src/components/account/AccountBlockButton.js
index 2582f63c..1f40af06 100644
--- a/src/components/account/AccountBlockButton.js
+++ b/src/components/account/AccountBlockButton.js
@@ -1,25 +1,20 @@
import React from 'react';
import PropTypes from 'prop-types';
-import {
- StyleSheet,
- TouchableOpacity,
-} from 'react-native';
+import { StyleSheet, TouchableOpacity } from 'react-native';
import theme from '../../config/theme';
import Title from '../typography/Title';
-function AccountBlockButton({
- button,
- navigation,
-}) {
+function AccountBlockButton({ button, navigation }) {
return (
- navigation.navigate(button.route)
- }
+ onPress={() => navigation.navigate(button.route)}
+ accessibilityRole="button"
+ accessibilityLabel={button.title}
+ accessible
>
{button.image}
diff --git a/src/components/header/HeaderBackButton.js b/src/components/header/HeaderBackButton.js
index 4266d1da..f164a89b 100644
--- a/src/components/header/HeaderBackButton.js
+++ b/src/components/header/HeaderBackButton.js
@@ -9,7 +9,12 @@ import theme from '../../config/theme';
function HeaderBackButton({ onPressAction = () => {}, color = 'light' }) {
return (
- <TouchableOpacity onPress={onPressAction} testID={testIDs.NAVIGATION.HEADER_BACK_BUTTON}>
+ <TouchableOpacity
+ onPress={onPressAction}
+ testID={testIDs.NAVIGATION.HEADER_BACK_BUTTON}
+ accessible
+ accessibilityRole="button"
+ >
<ArrowBackIcon color={color === 'light' ? theme.colors.white : theme.colors.text} />
</TouchableOpacity>
);
diff --git a/src/components/header/ImageOverlayHeader.js b/src/components/header/ImageOverlayHeader.js
index 5744a077..d143d362 100644
--- a/src/components/header/ImageOverlayHeader.js
+++ b/src/components/header/ImageOverlayHeader.js
@@ -41,6 +41,7 @@ function ImageOverlayHeader({
backgroundColor={theme.colors.headerColor}
round
testID={testIDs.NAVIGATION.HEADER_BACK_BUTTON}
+ accessibilityLabel="Sluiten"
/>
<CitypingsChip value={cityPings} />
</View>
diff --git a/src/components/modals/ConfirmModal.js b/src/components/modals/ConfirmModal.js
index b0d4f60c..4c0489c6 100644
--- a/src/components/modals/ConfirmModal.js
+++ b/src/components/modals/ConfirmModal.js
@@ -27,6 +27,7 @@ function ConfirmModal({ open = false, setOpen = () => {}, doUpdateTask = () => {
action={closeModal}
style={styles.closeButton}
iconComponent={<CloseIcon style={styles.icon} />}
+ accessibilityLabel="Sluiten"
/>
<Title style={styles.title}>Vragen Overslaan
diff --git a/src/components/modals/DeleteDataModal.js b/src/components/modals/DeleteDataModal.js
index 2fa352a2..cfd4340c 100644
--- a/src/components/modals/DeleteDataModal.js
+++ b/src/components/modals/DeleteDataModal.js
@@ -32,6 +32,7 @@ function DeleteDataModal({
action={closeModal}
style={styles.closeButton}
iconComponent={}
+ accessibilityLabel="Sluiten"
/>
Gegevens Verwijderen
diff --git a/src/components/modals/ShowRewardCodeModal.js b/src/components/modals/ShowRewardCodeModal.js
index 8261d8a0..6155f4e7 100644
--- a/src/components/modals/ShowRewardCodeModal.js
+++ b/src/components/modals/ShowRewardCodeModal.js
@@ -25,6 +25,7 @@ function ShowRewardCodeModal({ open = false, setOpen = () => {}, expiryDate = ''
action={closeModal}
style={styles.closeButton}
iconComponent={}
+ accessibilityLabel="Sluiten"
/>
Jouw Code
diff --git a/src/components/modals/UpdateAppModal.js b/src/components/modals/UpdateAppModal.js
index e3f36dbd..6f936409 100644
--- a/src/components/modals/UpdateAppModal.js
+++ b/src/components/modals/UpdateAppModal.js
@@ -88,6 +88,7 @@ function UpdateAppModal() {
action={closeModal}
style={styles.closeButton}
iconComponent={}
+ accessibilityLabel="Sluiten"
/>
Hey! Er is een nieuwe versie
diff --git a/src/components/modals/UpdateAppModal/UpdateModal.js b/src/components/modals/UpdateAppModal/UpdateModal.js
index d0e22762..77fbbe4d 100644
--- a/src/components/modals/UpdateAppModal/UpdateModal.js
+++ b/src/components/modals/UpdateAppModal/UpdateModal.js
@@ -23,6 +23,7 @@ function UpdateAppModal({ closeModal, openAppStore, open }) {
action={closeModal}
style={styles.closeButton}
iconComponent={<CloseIcon style={styles.icon} />}
+ accessibilityLabel="Sluiten"
/>
<Title variant="h3" style={styles.title}>
Hey! Er is een nieuwe versie
diff --git a/src/components/onboarding/AnswerButtonOnboarding.js b/src/components/onboarding/AnswerButtonOnboarding.js
index eb75093e..c1a7a58f 100644
--- a/src/components/onboarding/AnswerButtonOnboarding.js
+++ b/src/components/onboarding/AnswerButtonOnboarding.js
@@ -18,6 +18,9 @@ function AnswerButtonOnboarding({
style={[styles.button, active && styles.activeButton]}
variant="outline"
onPress={onPress}
+ accessibilityRole="button"
+ accessibilityLabel={label}
+ accessible
>
<Text style={[styles.label, active && styles.activeText]}>{label}</Text>
</TouchableOpacity>
diff --git a/src/components/onboarding/NextButtonQuestionScreen.js b/src/components/onboarding/NextButtonQuestionScreen.js
index 63085925..635fb930 100644
--- a/src/components/onboarding/NextButtonQuestionScreen.js
+++ b/src/components/onboarding/NextButtonQuestionScreen.js
@@ -15,6 +15,9 @@ function NextButtonQuestionScreen({ nextButtonDisabled, submitAnswer }) {
variant="text"
disabled={nextButtonDisabled}
style={styles.nextButton}
+ accessible
+ accessibilityState={{ disabled: nextButtonDisabled }}
+ accessibilityRole="button"
>
<Text
style={[
diff --git a/src/components/onboarding/OnboardingPage.js b/src/components/onboarding/OnboardingPage.js
index f0994a2c..53a7033a 100644
--- a/src/components/onboarding/OnboardingPage.js
+++ b/src/components/onboarding/OnboardingPage.js
@@ -21,7 +21,7 @@ function OnboardingItem({ pageContent: { svg, title, text } }) {
return (
<View style={styles.viewContainer}>
- <View>
+ <View accessibilityRole="image">
<SvgIllustration />
</View>
<View>
diff --git a/src/components/onboarding/questionTypes/DateOfBirth.js b/src/components/onboarding/questionTypes/DateOfBirth.js
index 3974cb55..f1cd734f 100644
--- a/src/components/onboarding/questionTypes/DateOfBirth.js
+++ b/src/components/onboarding/questionTypes/DateOfBirth.js
@@ -37,6 +37,8 @@ function DateOfBirth({
day: itemValue,
})
}
+ accessible
+ accessibilityLabel="Kies een dag"
>
<Picker.Item label="Dag" value="" />
{getDays()}
diff --git a/src/components/onboarding/questionTypes/DropDownSelect/InputComponent.js b/src/components/onboarding/questionTypes/DropDownSelect/InputComponent.js
index 0ea26790..0d77b10e 100644
--- a/src/components/onboarding/questionTypes/DropDownSelect/InputComponent.js
+++ b/src/components/onboarding/questionTypes/DropDownSelect/InputComponent.js
@@ -112,10 +112,20 @@ function InputComponent({
onBlur={onBlur}
style={styles.input}
/>
- <TouchableOpacity style={styles.clearButton} onPress={onClearPress}>
+ <TouchableOpacity
+ style={styles.clearButton}
+ onPress={onClearPress}
+ accessible
+ accessibilityRole="button"
+ >
{!!searchText && <CloseIcon />}
</TouchableOpacity>
- <TouchableOpacity style={styles.chevronButton} onPress={toggle}>
+ <TouchableOpacity
+ style={styles.chevronButton}
+ onPress={toggle}
+ accessible
+ accessibilityRole="button"
+ >
{isOpened ? <ChevronUpIcon /> : <ChevronDownIcon />}
</TouchableOpacity>
</View>
diff --git a/src/components/onboarding/questionTypes/DropDownSelect/index.js b/src/components/onboarding/questionTypes/DropDownSelect/index.js
index 499aff31..bb7424e5 100644
--- a/src/components/onboarding/questionTypes/DropDownSelect/index.js
+++ b/src/components/onboarding/questionTypes/DropDownSelect/index.js
@@ -72,6 +72,9 @@ function DropDownSelect({
onPress={() => doUpdateTask()}
disabled={!selectedItem.value}
label="Volgende"
+ accessible
+ accessibilityRole="button"
+ accessibilityState={{ disabled: true }}
/>
</View>
</View>
diff --git a/src/components/route/RouteTaskRow.js b/src/components/route/RouteTaskRow.js
index ac5d36f7..a48019de 100644
--- a/src/components/route/RouteTaskRow.js
+++ b/src/components/route/RouteTaskRow.js
@@ -1,11 +1,7 @@
import React, { memo } from 'react';
import PropTypes from 'prop-types';
-import {
- StyleSheet,
- TouchableOpacity,
- View,
-} from 'react-native';
+import { StyleSheet, TouchableOpacity, View } from 'react-native';
import { View as AnimatableView } from 'react-native-animatable';
import routes from '../../App/stacks/routes';
@@ -15,36 +11,20 @@ import Title from '../typography/Title';
const CIRCLE_RADIUS = 30;
-function RouteTaskRow({
- task: { task, status },
- index,
- navigation,
- routeId,
- tasksToDo,
-}) {
+function RouteTaskRow({ task: { task, status }, index, navigation, routeId, tasksToDo }) {
const isCompleted = status === 'Completed';
- const isCurrentTask =
- tasksToDo.length > 0 &&
- tasksToDo[0].task.taskId === task.taskId;
+ const isCurrentTask = tasksToDo.length > 0 && tasksToDo[0].task.taskId === task.taskId;
const doNavigate = () => {
- navigation.navigate(
- routes.routeStack.screens.taskScreen,
- {
- routeId,
- task: { ...task, status },
- },
- );
+ navigation.navigate(routes.routeStack.screens.taskScreen, {
+ routeId,
+ task: { ...task, status },
+ });
};
return (
- <TouchableOpacity onPress={doNavigate}>
- <View
- style={[
- styles.container,
- index % 2 === 0 && styles.background,
- ]}
- >
+ <TouchableOpacity onPress={doNavigate} accessible accessibilityRole="button">
+ <View style={[styles.container, index % 2 === 0 && styles.background]}>
<View
style={[
styles.circleStepIndicator,
@@ -52,27 +32,15 @@ function RouteTaskRow({
isCompleted && styles.circleDisabled,
]}
>
- <Title
- variant="h6"
- style={styles.label}
- >
+ <Title variant="h6" style={styles.label}>
{index}
-
+ <Title style={[styles.title, isCompleted && styles.disabled]} variant="h5">
{task.title}
{isCompleted && (
-
+
)}
@@ -118,8 +86,7 @@ const styles = StyleSheet.create({
marginLeft: theme.spacing.xxs,
},
background: {
- backgroundColor:
- theme.colors.taskRowBackground,
+ backgroundColor: theme.colors.taskRowBackground,
},
});
diff --git a/src/components/route/TipsChip.js b/src/components/route/TipsChip.js
index 3f714da7..db651a58 100644
--- a/src/components/route/TipsChip.js
+++ b/src/components/route/TipsChip.js
@@ -1,10 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
-import {
- StyleSheet,
- TouchableOpacity,
-} from 'react-native';
+import { StyleSheet, TouchableOpacity } from 'react-native';
import routes from '../../App/stacks/routes';
import LightBulb from '../../assets/svg/icons/LightBulb';
@@ -16,13 +13,12 @@ function TipsChip({ navigation, tips }) {
- navigation.navigate(
- routes.routeStack.screens.tipScreen,
- {
- tips,
- },
- )
+ navigation.navigate(routes.routeStack.screens.tipScreen, {
+ tips,
+ })
}
+ accessible
+ accessibilityRole="button"
>
diff --git a/src/components/shared/Card.js b/src/components/shared/Card.js
index f01c218d..21c4ff8b 100644
--- a/src/components/shared/Card.js
+++ b/src/components/shared/Card.js
@@ -24,7 +24,14 @@ function Card({
}) {
return (
<View style={[styles.paper, !disabled && styles.paperShadow, style]} testID={testID}>
- <TouchableOpacity onPress={onPress}>
+ <TouchableOpacity
+ onPress={onPress}
+ accessibilityRole="button"
+ accessibilityLabel={`${
+ disabled ? 'Deze route is nog niet beschikbaar' : 'Route card'
+ }`}
+ accessibilityState={{ disabled }}
+ >
<View>
<View style={styles.imageContainer}>
<ProgressiveImage
diff --git a/src/components/shared/IconButton.js b/src/components/shared/IconButton.js
index ed316caf..680aad6b 100644
--- a/src/components/shared/IconButton.js
+++ b/src/components/shared/IconButton.js
@@ -6,16 +6,19 @@ import { TouchableOpacity, StyleSheet } from 'react-native';
import theme from '../../config/theme';
import normalizeValue from '../../helpers/normalizeValue';
-function IconButton({ style, iconComponent, action, round, backgroundColor }) {
+function IconButton({ style, iconComponent, action, round, backgroundColor, accessibilityLabel }) {
return (
<TouchableOpacity
onPress={action}
+ accessibilityLabel={accessibilityLabel}
style={[
styles.container,
round && { borderRadius: 100 },
backgroundColor && { backgroundColor },
style,
]}
+ accessible
+ accessibilityRole="button"
>
{iconComponent}
</TouchableOpacity>
@@ -35,8 +38,9 @@ const styles = StyleSheet.create({
IconButton.propTypes = {
iconComponent: PropTypes.element.isRequired,
action: PropTypes.func.isRequired,
- round: PropTypes.bool,
+ accessibilityLabel: PropTypes.string.isRequired,
backgroundColor: PropTypes.string,
+ round: PropTypes.bool,
style: PropTypes.object,
};
diff --git a/src/components/shared/PrivacyPolicyAccordion.js b/src/components/shared/PrivacyPolicyAccordion.js
index 2a4466ae..fd958f0b 100644
--- a/src/components/shared/PrivacyPolicyAccordion.js
+++ b/src/components/shared/PrivacyPolicyAccordion.js
@@ -13,7 +13,7 @@ import Title from '../typography/Title';
function PrivacyPolicyAccordion({ open, toggleOpen }) {
return (
<View style={styles.policyContainer}>
- <TouchableWithoutFeedback onPress={toggleOpen}>
+ <TouchableWithoutFeedback onPress={toggleOpen} accessible accessibilityRole="button">
<View style={styles.iconButton}>
<Title style={styles.title} variant="h7" align="center">
Privacy Policy
diff --git a/src/components/shared/ProgressBar.js b/src/components/shared/ProgressBar.js
index 17aa2517..3ef22ec9 100644
--- a/src/components/shared/ProgressBar.js
+++ b/src/components/shared/ProgressBar.js
@@ -16,6 +16,9 @@ function ProgressBar({ progress }) {
unfilledColor={theme.colors.subtleGrey}
useNativeDriver
animationType="timing"
+ accessible
+ accessibilityLabel={`Progress bar - voortgang ${(progress * 100).toFixed(0)}%`}
+ accessibliltyRole="progressbar"
/>
);
}
diff --git a/src/components/shared/RoundedButton.js b/src/components/shared/RoundedButton.js
index b37f6093..927f603e 100644
--- a/src/components/shared/RoundedButton.js
+++ b/src/components/shared/RoundedButton.js
@@ -29,6 +29,9 @@ function RoundedButton({
activeOpacity={0.1}
disabled={disabled}
onPress={onPress}
+ accessible
+ accessibilityRole="button"
+ accessibilityState={{ disabled }}
>
<View style={styles.innerContainer}>
{loading ? (
diff --git a/src/components/shared/TextButton.js b/src/components/shared/TextButton.js
index 27ab8be4..c12a788a 100644
--- a/src/components/shared/TextButton.js
+++ b/src/components/shared/TextButton.js
@@ -1,10 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
-import {
- TouchableOpacity,
- StyleSheet,
-} from 'react-native';
+import { TouchableOpacity, StyleSheet } from 'react-native';
import theme from '../../config/theme';
import Title from '../typography/Title';
@@ -14,11 +11,11 @@ function TextButton({ onPress, testID, label }) {
<TouchableOpacity
onPress={onPress}
testID={testID}
+ accessibilityLabel={label}
+ accessible
+ accessibilityRole="button"
>
- <Title
- style={styles.buttonLabel}
- variant="h7"
- >
+ <Title style={styles.buttonLabel} variant="h7">
{label}
diff --git a/src/components/typography/Title.js b/src/components/typography/Title.js
index 7955f7f3..6cc98e9a 100644
--- a/src/components/typography/Title.js
+++ b/src/components/typography/Title.js
@@ -49,6 +49,7 @@ function Title({
numberOfLines={numberOfLines}
ellipsizeMode={ellipsizeMode}
selectable={selectable}
+ accessibilityRole="header"
>
{children}
diff --git a/src/screens/CompletedRouteCelebrationModalScreen.js b/src/screens/CompletedRouteCelebrationModalScreen.js
index 12d6d1c6..8d44133a 100644
--- a/src/screens/CompletedRouteCelebrationModalScreen.js
+++ b/src/screens/CompletedRouteCelebrationModalScreen.js
@@ -68,6 +68,7 @@ function CompletedRouteCelebrationModalScreen({ navigation, route }) {
action={() => navigation.navigate(routes.citypingsStack.screens.homeScreen)}
backgroundColor={theme.colors.headerColor}
round
+ accessibilityLabel="Sluiten"
/>