varnitgoyal95/address-verification-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

stepper fixes

Browse Source
This commit is contained in:
kunalsharma
2023-01-02 19:09:45 +05:30
parent 46cc951f5c
commit b2f1382eba
8 changed files with 111 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/data/RealTemplateData.json
View File

@@ -20,7 +20,7 @@
"nextJourney": null
},
"false":{
"status": "OPEN",
"status": "VERIFICATION_FAILED",
"nextJourney": "PERMANENT_ADDRESS_VERIFICATION_TASK"
}
}
@@ -154,7 +154,7 @@
"false": "w3"
}
},
"isLeaf": false
"isLeaf": false
},
"w2": {
"sections": [
@@ -251,7 +251,7 @@
"section": "s12"
},
"actions": {
"true": "w7",
"true": "w7",
"false": "w8"
}
},
@@ -271,7 +271,7 @@
},
"actions": {
"true": "w1",
"false": "w8"
"false": "w8"
}
},
"isLeaf": false
@@ -797,7 +797,7 @@
"text": "Government Job",
"associateQuestions": [],
"metadata": {}
},
},
"o40": {
"text": "Private Sector",
"associateQuestions": [],
@@ -971,4 +971,4 @@
]
}
}
}
}

3
src/reducer/allCasesSlice.ts
View File

@@ -5,6 +5,7 @@ import {
ICaseItem, IFilter,
} from '../screens/allCases/interface';
import {CONDITIONAL_OPERATORS, FILTER_TYPES, SELECTION_TYPES} from "../common/Constants";
import {CaseDetail} from "../screens/caseDetails/interface";
export type ICasesMap = {[key: string]: ICaseItem};
@@ -22,7 +23,7 @@ interface IAllCasesSlice {
filterList: ICaseItem[];
newlyPinnedCases: number;
completedCases: number;
caseDetails: any;
caseDetails: Record<string, CaseDetail>;
filters: Record<string, IFilter>;
searchQuery: string;
selectedFilters: Record<string, any>

1
src/screens/caseDetails/CaseDetails.tsx
View File

@@ -6,7 +6,6 @@ import {
StyleSheet,
View,
} from 'react-native';
import Text from '../../../RN-UI-LIB/src/components/Text';
import {GenericStyles} from '../../../RN-UI-LIB/src/styles';
import {useAppSelector} from '../../hooks';
import CaseDetailsHeader from './CaseDetailsHeader';

17
src/screens/caseDetails/interface.ts
View File

@@ -1,3 +1,5 @@
import {TaskTitle} from "../allCases/interface";
export enum LoanType {
PERSONAL_LOAN = "PERSONAL_LOAN",
HOUSE_LOAN = "HOUSE_LOAN"
@@ -18,6 +20,12 @@ export enum LoanTypeUIMapping {
HOUSE_LOAN = 'House loan'
}
export enum CONTEXT_TASK_STATUSES {
VERIFICATION_FAILED = 'VERIFICATION_FAILED',
VERIFICATION_SUCCESS = 'VERIFICATION_SUCCESS',
OPEN = 'OPEN',
}
export interface LoanDetails {
loanAccountNumber: string;
disbursalDate: string;
@@ -64,7 +72,7 @@ export interface Metadata {
export interface Task {
taskId: number;
taskType: string;
taskType: TaskTitle;
metadata: Metadata;
}
@@ -99,7 +107,7 @@ export interface COMMUNICATIONADDRESSVERIFICATIONTASK {
}
export interface TaskContext {
COMMUNICATION_ADDRESS_VERIFICATION_TASK: COMMUNICATIONADDRESSVERIFICATIONTASK[];
[id: string] :any
}
export interface Context {
@@ -118,4 +126,7 @@ export interface CaseDetail {
customerInfo: CustomerInfo;
tasks: Task[];
context: Context;
}
isSynced: boolean;
currentTask: string;
}

31
src/screens/caseDetails/journeyStepper/StepperHeader.tsx
View File

@@ -7,6 +7,7 @@ import TickIcon from '../../../assets/icons/TickIcon';
import {COLORS} from '../../../../RN-UI-LIB/src/styles/colors';
import UnsyncedIcon from '../../../assets/icons/UnsyncedIcon';
import Tag from '../../../../RN-UI-LIB/src/components/Tag';
import {CONTEXT_TASK_STATUSES} from "../interface";
export const enum STEPPER_STATE {
DEFAULT = 'DEFAULT',
@@ -19,7 +20,7 @@ interface IStepperHeader {
stepNumber: number;
header: string;
currentState: STEPPER_STATE;
verdict: any;
verdict: CONTEXT_TASK_STATUSES;
}
const StepperHeader: React.FC<IStepperHeader> = props => {
@@ -54,19 +55,19 @@ const StepperHeader: React.FC<IStepperHeader> = props => {
</View>
</View>
);
case STEPPER_STATE.UNSYNCED:
return (
<View style={[GenericStyles.row, GenericStyles.alignCenter]}>
<View style={[GenericStyles.row, styles.stepperDefault]}>
<UnsyncedIcon />
</View>
<View>
<Heading dark type="h3">
{header}
</Heading>
</View>
</View>
);
// case STEPPER_STATE.UNSYNCED:
// return (
// <View style={[GenericStyles.row, GenericStyles.alignCenter]}>
// <View style={[GenericStyles.row, styles.stepperDefault]}>
// <UnsyncedIcon />
// </View>
// <View>
// <Heading dark type="h3">
// {header}
// </Heading>
// </View>
// </View>
// );
case STEPPER_STATE.SYNCED:
return (
<View style={[GenericStyles.row, GenericStyles.alignCenter]}>
@@ -81,7 +82,7 @@ const StepperHeader: React.FC<IStepperHeader> = props => {
</View>
{verdict && (
<View style={[GenericStyles.ml8]}>
<Tag variant="success" text={verdict} />
<Tag variant="success" text={CONTEXT_TASK_STATUSES[verdict]} />
</View>
)}
</View>

16
src/screens/caseDetails/journeyStepper/TaskContent.tsx
View File

@@ -4,13 +4,20 @@ import {GenericStyles} from '../../../../RN-UI-LIB/src/styles';
import Button from '../../../../RN-UI-LIB/src/components/Button';
import React from 'react';
import MapPinIcon from '../../../../RN-UI-LIB/src/Icons/MapPinIcon';
import {TaskTitle} from "../../allCases/interface";
import {navigateToScreen} from "../../../components/utlis/navigationUtlis";
const templateData = require('../../../data/RealTemplateData.json');
const TaskContent = ({
address,
geolocationUrl,
taskType,
caseId
}: {
address?: any;
geolocationUrl: string | null;
geolocationUrl: string | undefined;
taskType: TaskTitle;
caseId: string;
}) => {
const openGeolocation = () => {
geolocationUrl && Linking.openURL(geolocationUrl);
@@ -32,7 +39,12 @@ const TaskContent = ({
leftIcon={<MapPinIcon />}
/>
)}
<Button title="Add feedback" style={styles.feedbackBtn} />
<Button title="Add feedback" onPress={() =>
navigateToScreen(templateData.journey[taskType].startWidget, {
caseId: caseId,
journey: taskType,
})
} style={styles.feedbackBtn} />
</View>
</View>
);

96
src/screens/caseDetails/journeyStepper/TaskStepper.tsx
View File

@@ -9,9 +9,11 @@ import CallingBottomSheet from './CallingBottomSheet';
import PhoneNumberSelectionBottomSheet from './PhoneNumberSelectionBottomSheet';
import TaskContent from './TaskContent';
import StepperHeader, {STEPPER_STATE} from './StepperHeader';
import { navigateToScreen } from '../../../components/utlis/navigationUtlis';
import {navigateToScreen} from '../../../components/utlis/navigationUtlis';
import Heading from '../../../../RN-UI-LIB/src/components/Heading';
import { Text } from 'react-native-svg';
import {Text} from 'react-native-svg';
import {CaseDetail} from '../interface';
import {TaskTitle, TaskTitleUIMapping} from '../../allCases/interface';
interface IStepperContent {
content?: React.ReactNode;
@@ -28,70 +30,75 @@ const StepperContent: React.FC<IStepperContent> = props => {
};
interface ITaskStepper {
caseDetail: any;
caseDetail: CaseDetail;
}
const TaskStepper: React.FC<ITaskStepper> = props => {
const {caseDetail} = props;
console.log(caseDetail)
console.log(caseDetail);
const [showPhoneNumberBottomSheet, setShowPhoneNumberBottomSheet] =
React.useState(false);
const [showCallingBottomSheet, setShowCallingBottomSheet] =
React.useState(false);
const {tasks, context, mobileNumbers = []} = useSelector((state: RootState) => ({
mobileNumbers: state.case.customerInfo.mobileNumbers,
tasks: state.case.tasks,
context: state.case.context,
}));
// const {tasks, context, mobileNumbers = []} = useSelector((state: RootState) => ({
// mobileNumbers: state.case.customerInfo.mobileNumbers,
// tasks: state.case.tasks,
// context: state.case.context,
// }));
const [selectedPhoneNumber, setSelectedPhoneNumber] = React.useState('');
const handleCustomerCall = () => {
if(mobileNumbers?.length > 0) {
setShowPhoneNumberBottomSheet(true)
return;
}
setSelectedPhoneNumber(mobileNumbers[0]);
setShowCallingBottomSheet(true)
}
// if(mobileNumbers?.length > 0) {
// setShowPhoneNumberBottomSheet(true)
// return;
// }
// setSelectedPhoneNumber(mobileNumbers[0]);
setShowCallingBottomSheet(true);
};
return (
<>
<View style={[GenericStyles.p16]}>
<Heading type='h3' style={styles.header} dark bold>Addresses</Heading>
{tasks.map((task, index) => {
<Heading type="h3" style={styles.header} dark bold>
Addresses
</Heading>
{caseDetail?.tasks.map((task, index) => {
const verdict =
// @ts-ignore
context.tasks[task.taskTypeId] &&
caseDetail?.context?.taskContext[task.taskType] &&
// @ts-ignore
context.tasks[task.taskTypeId].length > 0
? context.tasks[task.taskTypeId][
context.tasks[task.taskTypeId].length - 1
].verdict
caseDetail?.context?.taskContext[task.taskType].length >
0
? caseDetail?.context?.taskContext[task.taskType][
caseDetail?.context?.taskContext[
task.taskType
].length - 1
].taskStatus
: null;
const currentState =
context.currentTask === task.taskTypeId
caseDetail?.currentTask === task.taskType
? STEPPER_STATE.CURRENT
: task.isSynced && verdict
: verdict
? STEPPER_STATE.SYNCED
: task.isSynced
? STEPPER_STATE.DEFAULT
: STEPPER_STATE.UNSYNCED;
if (context.currentTask === task.taskTypeId) {
: STEPPER_STATE.DEFAULT;
if (currentState === STEPPER_STATE.CURRENT) {
return (
<>
<StepperHeader
verdict={verdict}
currentState={currentState}
stepNumber={index + 1}
header={task.taskTypeId}
header={TaskTitleUIMapping[task.taskType]}
/>
<StepperContent
content={
<TaskContent
address={task.metadata.address}
address={task.metadata?.address}
geolocationUrl={
task.metadata.geoLocation
task.metadata?.geoLocation
}
taskType={task.taskType}
caseId={caseDetail.id}
/>
}
/>
@@ -103,7 +110,7 @@ const TaskStepper: React.FC<ITaskStepper> = props => {
<StepperHeader
verdict={verdict}
stepNumber={index + 1}
header={task.taskTypeId}
header={TaskTitleUIMapping[task.taskType]}
currentState={currentState}
/>
<StepperContent />
@@ -115,13 +122,23 @@ const TaskStepper: React.FC<ITaskStepper> = props => {
style={[styles.callCustomerButton]}
title="Trigger journey"
variant="secondary"
onPress={() => navigateToScreen('w1', {caseId: caseDetail.id, journey: 'CALLING_TASK'})}
onPress={() =>
navigateToScreen('w1', {
caseId: caseDetail.id,
journey: 'CALLING_TASK',
})
}
/>
<Button
style={[styles.callCustomerButton]}
title="Trigger Permanent"
variant="secondary"
onPress={() => navigateToScreen('w7', {caseId: caseDetail.id, journey: 'PERMANENT_ADDRESS_VERIFICATION_TASK'})}
onPress={() =>
navigateToScreen('w7', {
caseId: caseDetail.id,
journey: 'PERMANENT_ADDRESS_VERIFICATION_TASK',
})
}
/>
<View style={[GenericStyles.row, styles.journeyContainer]}>
<Button
@@ -131,14 +148,15 @@ const TaskStepper: React.FC<ITaskStepper> = props => {
onPress={handleCustomerCall}
/>
</View>
<PhoneNumberSelectionBottomSheet
{/* commenting this since we don't have mobile numbers as of right now
<PhoneNumberSelectionBottomSheet
showPhoneNumberBottomSheet={showPhoneNumberBottomSheet}
selectedPhoneNumber={selectedPhoneNumber}
mobileNumbers={mobileNumbers}
setShowPhoneNumberBottomSheet={setShowPhoneNumberBottomSheet}
setShowCallingBottomSheet={setShowCallingBottomSheet}
setSelectedPhoneNumber={setSelectedPhoneNumber}
/>
/>*/}
<CallingBottomSheet
setShowCallingBottomSheet={setShowCallingBottomSheet}
showCallingBottomSheet={showCallingBottomSheet}
@@ -150,12 +168,12 @@ const TaskStepper: React.FC<ITaskStepper> = props => {
export const styles = StyleSheet.create({
header: {
marginBottom: 18
marginBottom: 18,
},
journeyContainer: {
borderTopWidth: 1,
borderTopColor: COLORS.BORDER.PRIMARY,
borderStyle: 'dashed'
borderStyle: 'dashed',
},
stepperCurrent: {
height: PixelRatio.roundToNearestPixel(32),

4
yarn.lock
View File

@@ -2161,7 +2161,7 @@ axe-core@^4.4.3:
resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.5.2.tgz#823fdf491ff717ac3c58a52631d4206930c1d9f7"
integrity sha512-u2MVsXfew5HBvjsczCv+xlwdNnB1oQR9HlAcsejZttNjKKSkeDNVwB1vMThIUIFI9GoT57Vtk8iQLwqOfAkboA==
axios@^1.2.1:
axios@1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/axios/-/axios-1.2.1.tgz#44cf04a3c9f0c2252ebd85975361c026cb9f864a"
integrity sha512-I88cFiGu9ryt/tfVEi4kX2SITsvDddTajXTOFmt2uK1ZVA8LytjtdeyefdQWEf5PU8w+4SSJDoYnggflB5tW4A==
@@ -6319,7 +6319,7 @@ react-native-codegen@^0.70.6:
jscodeshift "^0.13.1"
nullthrows "^1.1.1"
react-native-device-info@^10.3.0:
react-native-device-info@10.3.0:
version "10.3.0"
resolved "https://registry.yarnpkg.com/react-native-device-info/-/react-native-device-info-10.3.0.tgz#6bab64d84d3415dd00cc446c73ec5e2e61fddbe7"
integrity sha512-/ziZN1sA1REbJTv5mQZ4tXggcTvSbct+u5kCaze8BmN//lbxcTvWsU6NQd4IihLt89VkbX+14IGc9sVApSxd/w==