added "Financial" Advice
This commit is contained in:
parent
d9db03af61
commit
7e29e4f016
2 changed files with 63 additions and 0 deletions
|
|
@ -7,6 +7,7 @@ import CategoryProgressBarList from '../../../components/stats/CategoryProgressB
|
||||||
import BudgetRemaining from '../../../components/stats/BudgetRemaining';
|
import BudgetRemaining from '../../../components/stats/BudgetRemaining';
|
||||||
import DebugMenu from '../../../services/DebugMenu';
|
import DebugMenu from '../../../services/DebugMenu';
|
||||||
import SavingsOverview from '../../../components/stats/SavingsOverview';
|
import SavingsOverview from '../../../components/stats/SavingsOverview';
|
||||||
|
import FinancialAdvice from '../../../components/stats/FinancialAdvice';
|
||||||
|
|
||||||
export default function Page() {
|
export default function Page() {
|
||||||
const { colors } = useTheme();
|
const { colors } = useTheme();
|
||||||
|
|
@ -58,6 +59,9 @@ export default function Page() {
|
||||||
<Widget>
|
<Widget>
|
||||||
<BudgetOverview/>
|
<BudgetOverview/>
|
||||||
</Widget>
|
</Widget>
|
||||||
|
<Widget>
|
||||||
|
<FinancialAdvice/>
|
||||||
|
</Widget>
|
||||||
<Widget>
|
<Widget>
|
||||||
<SavingsOverview/>
|
<SavingsOverview/>
|
||||||
</Widget>
|
</Widget>
|
||||||
|
|
|
||||||
59
components/stats/FinancialAdvice.tsx
Normal file
59
components/stats/FinancialAdvice.tsx
Normal file
|
|
@ -0,0 +1,59 @@
|
||||||
|
import React, { useState, useEffect } from 'react';
|
||||||
|
import { StyleSheet, View, Text } from 'react-native';
|
||||||
|
import { useTheme } from '../../app/contexts/ThemeContext';
|
||||||
|
|
||||||
|
const FinancialAdvice = () => {
|
||||||
|
const tips = [
|
||||||
|
"Maybe you shouldn't have bought that full-price video game. But who needs savings when you have high scores, right?",
|
||||||
|
"That daily gourmet coffee is essential, isn't it? Who needs a retirement fund when you've got caffeine!",
|
||||||
|
"Oh, another pair of designer shoes? Because the other twenty pairs just aren't enough.",
|
||||||
|
"A luxury car to drive two blocks? Obviously, walking is for peasants.",
|
||||||
|
"Sure, subscribe to all streaming services. Who needs to socialize outside when you can binge-watch shows alone forever?",
|
||||||
|
"A gym membership you never use? At least your wallet's getting a workout.",
|
||||||
|
"Booking another expensive vacation? It's not like you need to save for a rainy day or anything.",
|
||||||
|
"Another impulse purchase online? Because 'limited time offer' is definitely not a marketing tactic.",
|
||||||
|
"Eating out for every meal? Clearly, cooking at home is way too mainstream.",
|
||||||
|
"Upgrading to the latest phone model again? It must be tough having a phone that's 6 months old."
|
||||||
|
];
|
||||||
|
|
||||||
|
const { colors } = useTheme();
|
||||||
|
|
||||||
|
const [tip, setTip] = useState('');
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// Change the tip every 10 seconds
|
||||||
|
const intervalId = setInterval(() => {
|
||||||
|
const randomTip = tips[Math.floor(Math.random() * tips.length)];
|
||||||
|
setTip(randomTip);
|
||||||
|
}, 10000);
|
||||||
|
|
||||||
|
// Clear the interval on component unmount
|
||||||
|
return () => clearInterval(intervalId);
|
||||||
|
}, [tips]);
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
container: {
|
||||||
|
margin: 10,
|
||||||
|
borderRadius: 5,
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
},
|
||||||
|
text: {
|
||||||
|
fontSize: 26,
|
||||||
|
color: colors.primaryText
|
||||||
|
},
|
||||||
|
boldText: {
|
||||||
|
fontWeight: 'bold'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<Text style={styles.text}>
|
||||||
|
{tip}
|
||||||
|
</Text>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FinancialAdvice;
|
||||||
Reference in a new issue