Im new to react native and Im working on a react native program, Im trying to run my code synchronously using useEffect, I tried to use await and promises but didn’t work, this is how the code looks like
useEffect(() => {
dashBoard();
ret3();
}, []);
const [flag, setFlag] = useState(false);
const [within, setWitin] = useState(0);
const [above, setAbove] = useState(0);
const [under, setUnder] = useState(0);
const [bgArr, setBgArr] = useState([]);
const [lastBG, setLastBG] = useState(0);
const [lastBGtime, setLastBGtime] = useState('');
const [addBGlevel, setAddBGlevel] = useState(0);
const [startBG, setSBGP] = useState(0);
const [reason, setReason] = useState('');
//===========================Functions===============
const addBG = () => {
var time = new Date(); // Mon Jan 31 2022 23:07:59 GMT+0300 (+03)
var timeString = time.toString();
try {
db.transaction(tx => {
tx.executeSql(
'INSERT INTO BGLevel (UserID, BGlevel, DateTime) VALUES (?,?,?)',
[222, addBGlevel, timeString],
);
console.log('inserted!!');
});
} catch (error) {
console.log(error);
}
if (addBGlevel <= 70) {
navigation.navigate('hypo');
} else if (addBGlevel > startBG) {
//startbgcorr =150
navigation.navigate('Calc');
}else if (reason == '1'){
navigation.navigate('Calc');
}
};
const dashBoard = async () => {
await retrieveDash2();
var w = 0;
var a = 0;
var u = 0;
for (let i = 0; i < bgArr.length; i++) {
if (bgArr[i] >= fromBGHome && bgArr[i] <= toBGHome) {
w++;
} else if (bgArr[i] > toBGHome) {
a++;
} else if (bgArr[i] < fromBGHome) {
u++;
}
}
var total = w + a + u;
var m = (a / total) * 100;
if (m >= 50) {
setFlag(true);
} else {
setFlag(false);
}
setWitin(w);
setAbove(a);
setUnder(u);
};
//==================================================
//===========================RETRIVE================
const retrieveDash = () => {
// insulinPen table
try {
db.transaction(tx => {
tx.executeSql(
'SELECT UserID, fromBG, toBG FROM patientprofile',
[],
(tx, results) => {
var rows = results.rows;
for (let i = 0; i < rows.length; i++) {
var userid = rows.item(i).UserID;
if (userid == 222) {
fromBGHome = rows.item(i).fromBG;
toBGHome = rows.item(i).toBG;
return;
}
}
},
);
});
} catch (error) {
console.log(error);
}
};
//==================================================
const retrieveDash2 = async () => {
await retrieveDash();
var time = new Date(); // Mon Jan 31 2022 23:07:59 GMT+0300 (+03)
var bgArr1 = [];
// insulinPen table
try {
db.transaction(tx => {
tx.executeSql(
'SELECT UserID, BGlevel, DateTime FROM BGLevel',
[],
(tx, results) => {
var rows = results.rows;
var lastString = rows.item(rows.length - 1).DateTime;
var d = new Date(lastString);
var momFormat = moment(d).format('yyyy/MM/DD hh:mm a');
setLastBGtime(momFormat);
setLastBG(rows.item(rows.length - 1).BGlevel);
for (let i = 0; i < rows.length; i++) {
var timeString = rows.item(i).DateTime;
var toObj = new Date(timeString);
var bgHome = rows.item(i).BGlevel;
var userid = rows.item(i).UserID;
console.log((time - toObj) / (1000 * 60 * 60));
if ((time - toObj) / (1000 * 60 * 60) <= 168) {
//168 is the last 7 days in hours
bgArr1.push(bgHome);
}
}
setBgArr(bgArr1);
console.log(bgArr1 + ' This is bg array');
console.log(
fromBGHome + ' ' + toBGHome + ' This is from and to',
);
},
);
});
} catch (error) {
console.log(error);
}
};
//==================================================
const ret3 = () => {
try {
db.transaction(tx => {
tx.executeSql(
'SELECT UserID startBG_correct FROM patientprofile',
[],
(tx, results) => {
var rows = results.rows;
for (let i = 0; i < rows.length; i++) {
var UID = rows.item(i).UserID;
if (UID == 222) {
var start = rows.item(i).startBG_correct;
setSBGP(start);
}
}
},
);
});
} catch (error) {
console.log(error);
}
};
and I want the functions to run before the interface is completely loaded so I used the following way
{bgArr.length > 0 && (within > 0 || above > 0 || under > 0) ? (
<PieChart
data={data}
width={widthScreen}
height={150}
chartConfig={chartConfig}
accessor={'population'}
backgroundColor={'#ECECEC'}
//absolute
/>
) : (
<ActivityIndicator size="large" />
)}
but it keeps loading and never show the interface until I run the program again
I need the code to work directly when loading the page in the following order
1-retrieveDash
2-retrieveDash2
3-dashBoard
