You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.3 KiB
48 lines
1.3 KiB
import React from 'react';
|
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
|
|
import { AppProvider } from '../context/AppContext';
|
|
import FetchAPI from '../components/budget';
|
|
import ExpenseTotal from '../components/ExpenseTotal';
|
|
import ExpenseList from '../components/ExpenseList';
|
|
import AddExpenseForm from '../components/AddExpenseForm';
|
|
import RemainingBudget from '../components/Remaining';
|
|
import AddIncome from '../components/AddIncome'
|
|
|
|
export default function Dashboard() {
|
|
return (
|
|
<AppProvider>
|
|
<div className='container-fluid'>
|
|
<h1 className='mt-3'>My Budget Planner</h1>
|
|
<div className='row mt-3'>
|
|
<div className='col-sm'>
|
|
<FetchAPI />
|
|
</div>
|
|
<div className='col-sm'>
|
|
<RemainingBudget />
|
|
</div>
|
|
<div className='col-sm'>
|
|
<ExpenseTotal />
|
|
</div>
|
|
</div>
|
|
|
|
<div className='row mt-3'>
|
|
<div className='col-sm alert alert-secondary'>
|
|
<h3 className='mt-3'>Expenses</h3><ExpenseList />
|
|
</div>
|
|
</div>
|
|
<div className='row mt-3'>
|
|
<div className='col-sm'>
|
|
<AddExpenseForm />
|
|
</div>
|
|
</div>
|
|
|
|
<div className='row mt-3'>
|
|
<div className='col-sm'>
|
|
{/*<h3 className='mt-3'>Add Income</h3><AddIncome /> */}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</AppProvider>
|
|
);
|
|
} |