How can I change text color of dropdown after switching to/from dark mode. The change is happening after restarting the application - react-native

Question

I want the text color of the dropdown to change just after switching to/from dark mode. My code is changing the color of the text by switching to/from dark mode but for that, I have to restart the application. I want this to happen without restarting the application.
import React, { useState, useRef, useEffect } from 'react'
import { Picker } from '#react-native-picker/picker'
import { CgView } from './CgView'
import { CgText } from './CgText'
import Colors from '../Theme/Colors'
import { Appearance } from 'react-native'
const colorScheme = Appearance.getColorScheme();
const MonthtPicker = props => {
const { selectedMonth, onMonthChange } = props
const monthRef = useRef()
const dayRef = useRef()
const [textColor, setTextColor] = useState(Colors.commonTextColor)
useEffect(()=> {
const changeMode = () =>{
if (colorScheme === 'dark') {
// Use dark color scheme
setTextColor('white')
}
else{
setTextColor(Colors.commonTextColor)
}
}
changeMode()
}, [colorScheme])
return (
<CgView>
<CgText bdayLabel>Birthday</CgText>
<CgView row>
<CgView pickerContainer>
<Picker
ref={monthRef}
selectedValue={selectedMonth}
onValueChange={onMonthChange}
dropdownIconColor={Colors.commonTextColor}
itemStyle={{ color: Colors.commonTextColor }}
style={{ color: Colors.commonTextColor }}>
<Picker.Item
label='Select month'
value=' '
color={textColor}
/>
<Picker.Item
label='January'
value='January'
color={textColor}
/>
<Picker.Item
label='February'
value='February'
color={textColor}
/>
<Picker.Item
label='March'
value='March'
color={textColor}
/>
</Picker>
</CgView>
}
export default MonthPicker
Please explain me why my code is not working as expected and try to provide solution using useEffect.
Thank you in advance.