From 1e257d1924df20e2fa4feb7f6afce4f31f2a9acc Mon Sep 17 00:00:00 2001 From: Reckless_Satoshi Date: Tue, 18 Oct 2022 04:01:53 -0700 Subject: [PATCH] Add Maker and Book page to new main.tsx --- frontend/src/components/BookPage/BookPage.tsx | 102 ++++++++--------- .../src/components/BookPage/BookTable.tsx | 22 ++-- .../components/Charts/DepthChart/index.tsx | 31 ++--- .../src/components/Charts/NivoScheme/index.ts | 8 +- frontend/src/components/Main.tsx | 102 +++++++++-------- .../src/components/MakerPage/MakerForm.tsx | 106 +++++++++--------- .../src/components/MakerPage/MakerPage.tsx | 41 ++++--- frontend/src/models/Favorites.model.ts | 6 + frontend/src/models/Info.model.ts | 75 +++++++++++++ frontend/src/models/Settings.model.ts | 5 + frontend/src/models/index.ts | 12 +- frontend/src/utils/filterOrders.ts | 9 +- 12 files changed, 296 insertions(+), 223 deletions(-) create mode 100644 frontend/src/models/Favorites.model.ts create mode 100644 frontend/src/models/Info.model.ts create mode 100644 frontend/src/models/Settings.model.ts diff --git a/frontend/src/components/BookPage/BookPage.tsx b/frontend/src/components/BookPage/BookPage.tsx index 0a51831f..bff43c3f 100644 --- a/frontend/src/components/BookPage/BookPage.tsx +++ b/frontend/src/components/BookPage/BookPage.tsx @@ -5,7 +5,7 @@ import { useHistory } from 'react-router-dom'; import currencyDict from '../../../static/assets/currencies.json'; import DepthChart from '../Charts/DepthChart'; -import { Book, Order, LimitList, Maker } from '../../models'; +import { Book, Favorites, LimitList, Maker } from '../../models'; // Icons import { BarChart, FormatListBulleted } from '@mui/icons-material'; @@ -13,40 +13,37 @@ import BookTable from './BookTable'; import { MakerForm } from '../MakerPage'; interface BookPageProps { - bookRefreshing?: boolean; - loadingLimits: boolean; - lastDayPremium: number; book: Book; - limits: LimitList; + limits: { list: LimitList; loading: boolean }; fetchLimits: () => void; - type: number; - currency: number; - windowWidth: number; - windowHeight: number; + fav: Favorites; + setFav: (state: Favorites) => void; fetchBook: () => void; - setAppState: (state: object) => void; + windowSize: { width: number; height: number }; + lastDayPremium: number; + maker: Maker; + setMaker: (state: Maker) => void; } const BookPage = ({ lastDayPremium = 0, - loadingLimits, - book = { orders: [], loading: true }, limits, - fetchLimits, - type, - currency, - windowWidth, - windowHeight, - setAppState, + book = { orders: [], loading: true }, fetchBook, + fetchLimits, + fav, + setFav, + maker, + setMaker, + windowSize, }: BookPageProps): JSX.Element => { const { t } = useTranslation(); const history = useHistory(); const [view, setView] = useState<'list' | 'depth'>('list'); const [openMaker, setOpenMaker] = useState(false); - const doubleView = windowWidth > 115; - const width = windowWidth * 0.9; + const doubleView = windowSize.width > 115; + const width = windowSize.width * 0.9; const maxBookTableWidth = 85; const chartWidthEm = width - maxBookTableWidth; @@ -69,8 +66,6 @@ const BookPage = ({ badSatoshisText: '', }; - const [maker, setMaker] = useState(defaultMaker); - useEffect(() => { if (book.orders.length < 1) { fetchBook(true, false); @@ -81,11 +76,11 @@ const BookPage = ({ const handleCurrencyChange = function (e) { const currency = e.target.value; - setAppState({ currency }); + setFav({ ...fav, currency }); }; const handleTypeChange = function (mouseEvent, val) { - setAppState({ type: val }); + setFav({ ...fav, type: val }); }; const NoOrdersFound = function () { @@ -99,12 +94,14 @@ const BookPage = ({ > - {type == 0 + {fav.type == 0 ? t('No orders found to sell BTC for {{currencyCode}}', { - currencyCode: currency == 0 ? t('ANY') : currencyDict[currency.toString()], + currencyCode: + fav.currency == 0 ? t('ANY') : currencyDict[fav.currency.toString()], }) : t('No orders found to buy BTC for {{currencyCode}}', { - currencyCode: currency == 0 ? t('ANY') : currencyDict[currency.toString()], + currencyCode: + fav.currency == 0 ? t('ANY') : currencyDict[fav.currency.toString()], })} @@ -156,14 +153,11 @@ const BookPage = ({ @@ -177,18 +171,17 @@ const BookPage = ({ justifyContent='center' spacing={1} direction='row' - style={{ width: `${windowWidth}em` }} + style={{ width: `${windowSize.width}em` }} > fetchBook()} book={book} - type={type} - currency={currency} + fav={fav} maxWidth={maxBookTableWidth} // EM units - maxHeight={windowHeight * 0.825 - 5} // EM units - fullWidth={windowWidth} // EM units - fullHeight={windowHeight} // EM units + maxHeight={windowSize.height * 0.825 - 5} // EM units + fullWidth={windowSize.width} // EM units + fullHeight={windowSize.height} // EM units defaultFullscreen={false} onCurrencyChange={handleCurrencyChange} onTypeChange={handleTypeChange} @@ -197,38 +190,33 @@ const BookPage = ({ ) : view === 'depth' ? ( ) : ( fetchBook()} - type={type} - currency={currency} - maxWidth={windowWidth * 0.97} // EM units - maxHeight={windowHeight * 0.825 - 5} // EM units - fullWidth={windowWidth} // EM units - fullHeight={windowHeight} // EM units + fav={fav} + maxWidth={windowSize.width * 0.97} // EM units + maxHeight={windowSize.height * 0.825 - 5} // EM units + fullWidth={windowSize.width} // EM units + fullHeight={windowSize.height} // EM units defaultFullscreen={false} onCurrencyChange={handleCurrencyChange} onTypeChange={handleTypeChange} diff --git a/frontend/src/components/BookPage/BookTable.tsx b/frontend/src/components/BookPage/BookTable.tsx index 3377f98c..645a2550 100644 --- a/frontend/src/components/BookPage/BookTable.tsx +++ b/frontend/src/components/BookPage/BookTable.tsx @@ -18,7 +18,7 @@ import { } from '@mui/material'; import { DataGrid, GridPagination } from '@mui/x-data-grid'; import currencyDict from '../../../static/assets/currencies.json'; -import { Book, Order } from '../../models'; +import { Book, Favorites } from '../../models'; import filterOrders from '../../utils/filterOrders'; import BookControl from './BookControl'; @@ -35,8 +35,7 @@ import { Fullscreen, FullscreenExit, Refresh } from '@mui/icons-material'; interface Props { clickRefresh?: () => void; book: Book; - type: number; - currency: number; + fav?: Favorites; maxWidth: number; maxHeight: number; fullWidth?: number; @@ -44,16 +43,15 @@ interface Props { defaultFullscreen: boolean; showControls?: boolean; showFooter?: boolean; - onCurrencyChange?: () => void; - onTypeChange?: () => void; - noResultsOverlay?: JSX.Element; + onCurrencyChange?: (e: any) => void; + onTypeChange?: (mouseEvent: any, val: number) => void; + noResultsOverlay?: () => JSX.Element; } const BookTable = ({ clickRefresh, book, - type, - currency, + fav, maxWidth, maxHeight, fullWidth, @@ -662,8 +660,8 @@ const BookTable = ({ return ( void; - limits: LimitList; + limitList: LimitList; maxWidth: number; maxHeight: number; } @@ -45,8 +43,7 @@ const DepthChart: React.FC = ({ orders, lastDayPremium, currency, - setAppState, - limits, + limitList, maxWidth, maxHeight, }) => { @@ -58,37 +55,25 @@ const DepthChart: React.FC = ({ const [rangeSteps, setRangeSteps] = useState(8); const [xRange, setXRange] = useState(8); const [xType, setXType] = useState('premium'); - const [currencyCode, setCurrencyCode] = useState(1); const [center, setCenter] = useState(); const height = maxHeight < 20 ? 20 : maxHeight; const width = maxWidth < 20 ? 20 : maxWidth > 72.8 ? 72.8 : maxWidth; useEffect(() => { - if (Object.keys(limits).length === 0) { - apiClient.get('/api/limits/').then((data) => { - setAppState({ limits: data }); - }); - } - }, []); - - useEffect(() => { - setCurrencyCode(currency === 0 ? 1 : currency); - }, [currency]); - - useEffect(() => { - if (Object.keys(limits).length > 0) { + if (Object.keys(limitList).length > 0) { const enriched = orders.map((order) => { // We need to transform all currencies to the same base (ex. USD), we don't have the exchange rate // for EUR -> USD, but we know the rate of both to BTC, so we get advantage of it and apply a // simple rule of three order.base_amount = - (order.price * limits[currencyCode].price) / limits[order.currency].price; + (order.price * limitList[currency === 0 ? 1 : currency].price) / + limitList[order.currency].price; return order; }); setEnrichedOrders(enriched); } - }, [limits, orders, currencyCode]); + }, [limitList, orders, currency]); useEffect(() => { if (enrichedOrders.length > 0) { @@ -113,7 +98,7 @@ const DepthChart: React.FC = ({ setXRange(8); setRangeSteps(0.5); } - }, [enrichedOrders, xType, lastDayPremium, currencyCode]); + }, [enrichedOrders, xType, lastDayPremium, currency]); const generateSeries: () => void = () => { const sortedOrders: Order[] = @@ -338,7 +323,7 @@ const DepthChart: React.FC = ({ {xType === 'base_amount' - ? `${center} ${currencyDict[currencyCode]}` + ? `${center} ${currencyDict[currency === 0 ? 1 : currency]}` : `${center}%`} diff --git a/frontend/src/components/Charts/NivoScheme/index.ts b/frontend/src/components/Charts/NivoScheme/index.ts index 4fb90451..b5a5f847 100644 --- a/frontend/src/components/Charts/NivoScheme/index.ts +++ b/frontend/src/components/Charts/NivoScheme/index.ts @@ -12,13 +12,13 @@ export const getNivoScheme: (theme: MuiTheme) => NivoTheme = (theme) => { axis: { ticks: { line: { - strokeWidth: '1', + strokeWidth: 1, stroke: 'rgb(0, 0, 0)', }, }, domain: { line: { - strokeWidth: '1', + strokeWidth: 1, stroke: 'rgb(0, 0, 0)', }, }, @@ -36,13 +36,13 @@ export const getNivoScheme: (theme: MuiTheme) => NivoTheme = (theme) => { fill: 'rgb(255, 255, 255)', }, line: { - strokeWidth: '1', + strokeWidth: 1, stroke: 'rgb(255, 255, 255)', }, }, domain: { line: { - strokeWidth: '1', + strokeWidth: 1, stroke: 'rgb(255, 255, 255)', }, }, diff --git a/frontend/src/components/Main.tsx b/frontend/src/components/Main.tsx index 0f0fa671..15ad8b60 100644 --- a/frontend/src/components/Main.tsx +++ b/frontend/src/components/Main.tsx @@ -10,41 +10,49 @@ import BottomBar from './BottomBar'; import { apiClient } from '../services/api'; -import { Book, LimitList } from '../models'; - -interface Limits { - list: LimitList; - loading: boolean; -} +import { + Book, + LimitList, + Maker, + Robot, + Info, + Settings, + Favorites, + defaultMaker, + defaultRobot, + defaultInfo, + defaultSettings, +} from '../models'; const Main = (): JSX.Element => { const theme = useTheme(); const history = useHistory(); const Router = window.NativeRobosats ? HashRouter : BrowserRouter; const basename = window.NativeRobosats ? window.location.pathname : ''; - const [windowSize, setWindowSize] = useState(); // EM values // All app data structured const [book, setBook] = useState({ orders: [], loading: true }); - const [limits, setLimits] = useState({ list: [], loading: true }); - const [robot, setRobot] = useState(); - const [maker, setMaker] = useState(); - const [info, setInfo] = useState(); - const [favorites, setFavorites] = useState(); - const [settings, setSettings] = useState(); + const [limits, setLimits] = useState<{ list: LimitList; loading: boolean }>({ + list: [], + loading: true, + }); + const [robot, setRobot] = useState(defaultRobot); + const [maker, setMaker] = useState(defaultMaker); + const [info, setInfo] = useState(defaultInfo); + const [fav, setFav] = useState({ type: null, currency: 0 }); + const [settings, setSettings] = useState(defaultSettings); - // constructor(props) { - // super(props); - // this.state = { - // type: null, - // currency: 0, - // lastDayPremium: 0, - // }; - // } + console.log(info); + const initialWindowSize = { + width: window.innerWidth / theme.typography.fontSize, + height: window.innerHeight / theme.typography.fontSize, + }; // EM values + const [windowSize, setWindowSize] = useState<{ width: number; height: number }>( + initialWindowSize, + ); useEffect(() => { if (typeof window !== undefined) { - onResize(); window.addEventListener('resize', onResize); } fetchBook(); @@ -57,10 +65,10 @@ const Main = (): JSX.Element => { }, []); const onResize = function () { - setWindowSize([ - window.innerWidth / theme.typography.fontSize, - window.innerHeight / theme.typography.fontSize, - ]); + setWindowSize({ + width: window.innerWidth / theme.typography.fontSize, + height: window.innerHeight / theme.typography.fontSize, + }); }; const fetchBook = function () { @@ -76,7 +84,7 @@ const Main = (): JSX.Element => { const fetchLimits = () => { setLimits({ ...limits, loading: true }); const data = apiClient.get('/api/limits/').then((data) => { - setLimits({ limits: data, loading: false }); + setLimits({ list: data, loading: false }); return data; }); return data; @@ -86,6 +94,7 @@ const Main = (): JSX.Element => {
+ {/* { setAppState={this.setAppState} /> )} - /> + /> */} ( )} /> ( + render={() => ( )} /> - ( { /> )} /> + */}
-
- history.push(location)} - {...this.state} - {...this.props} - setAppState={this.setAppState} - /> -
+ history.push(location)} info={info} /> + */} ); }; diff --git a/frontend/src/components/MakerPage/MakerForm.tsx b/frontend/src/components/MakerPage/MakerForm.tsx index 605996c6..98cd0b40 100644 --- a/frontend/src/components/MakerPage/MakerForm.tsx +++ b/frontend/src/components/MakerPage/MakerForm.tsx @@ -24,7 +24,7 @@ import { IconButton, } from '@mui/material'; -import { LimitList, Maker, defaultMaker } from '../../models'; +import { LimitList, Maker, Favorites, defaultMaker } from '../../models'; import { LocalizationProvider, TimePicker } from '@mui/x-date-pickers'; import DateFnsUtils from '@date-io/date-fns'; @@ -44,12 +44,11 @@ import { LoadingButton } from '@mui/lab'; interface MakerFormProps { limits: { list: LimitList; loading: boolean }; - fetchLimits: () => LimitList; + fetchLimits: () => void; pricingMethods: boolean; maker: Maker; - type: number; - currency: number; - setAppState: (state: object) => void; + fav: Favorites; + setFav: (state: Favorites) => void; setMaker: (state: Maker) => void; disableRequest?: boolean; collapseAll?: boolean; @@ -62,9 +61,8 @@ const MakerForm = ({ limits, fetchLimits, pricingMethods, - currency, - type, - setAppState, + fav, + setFav, maker, setMaker, disableRequest = false, @@ -91,26 +89,26 @@ const MakerForm = ({ const amountSafeThresholds = [1.03, 0.98]; useEffect(() => { - setCurrencyCode(currencyDict[currency == 0 ? 1 : currency]); + setCurrencyCode(currencyDict[fav.currency == 0 ? 1 : fav.currency]); if (Object.keys(limits.list).length === 0) { fetchLimits().then((data) => { - updateAmountLimits(data, currency, maker.premium); - updateCurrentPrice(data, currency, maker.premium); + updateAmountLimits(data, fav.currency, maker.premium); + updateCurrentPrice(data, fav.currency, maker.premium); updateSatoshisLimits(data); }); } else { - updateAmountLimits(limits.list, currency, maker.premium); - updateCurrentPrice(limits.list, currency, maker.premium); + updateAmountLimits(limits.list, fav.currency, maker.premium); + updateCurrentPrice(limits.list, fav.currency, maker.premium); updateSatoshisLimits(limits.list); fetchLimits(); } }, []); - const updateAmountLimits = function (limits: LimitList, currency: number, premium: number) { - const index = currency === 0 ? 1 : currency; - let minAmountLimit: number = limits[index].min_amount * (1 + premium / 100); - let maxAmountLimit: number = limits[index].max_amount * (1 + premium / 100); + const updateAmountLimits = function (limitList: LimitList, currency: number, premium: number) { + const index = currency == 0 ? 1 : currency; + let minAmountLimit: number = limitList[index].min_amount * (1 + premium / 100); + let maxAmountLimit: number = limitList[index].max_amount * (1 + premium / 100); // apply thresholds to ensure good request minAmountLimit = minAmountLimit * amountSafeThresholds[0]; @@ -118,19 +116,19 @@ const MakerForm = ({ setAmountLimits([minAmountLimit, maxAmountLimit]); }; - const updateSatoshisLimits = function (limits: LimitList) { - const minAmount: number = limits[1000].min_amount * 100000000; - const maxAmount: number = limits[1000].max_amount * 100000000; + const updateSatoshisLimits = function (limitList: LimitList) { + const minAmount: number = limitList[1000].min_amount * 100000000; + const maxAmount: number = limitList[1000].max_amount * 100000000; setSatoshisLimits([minAmount, maxAmount]); }; - const updateCurrentPrice = function (limits: LimitList, currency: number, premium: number) { - const index = currency === 0 ? 1 : currency; + const updateCurrentPrice = function (limitsList: LimitList, currency: number, premium: number) { + const index = currency == 0 ? 1 : currency; let price = '...'; if (maker.isExplicit && maker.amount > 0 && maker.satoshis > 0) { price = maker.amount / (maker.satoshis / 100000000); } else if (!maker.is_explicit) { - price = limits.list[index].price * (1 + premium / 100); + price = limitsList[index].price * (1 + premium / 100); } setCurrentPrice(parseFloat(Number(price).toPrecision(5))); }; @@ -138,9 +136,9 @@ const MakerForm = ({ const handleCurrencyChange = function (newCurrency: number) { const currencyCode: string = currencyDict[newCurrency]; setCurrencyCode(currencyCode); - setAppState({ + setFav({ + ...fav, currency: newCurrency, - bookCurrencyCode: currencyCode, }); updateAmountLimits(limits.list, newCurrency, maker.premium); updateCurrentPrice(limits.list, newCurrency, maker.premium); @@ -195,8 +193,8 @@ const MakerForm = ({ badPremiumText = t('Must be more than {{min}}%', { min }); premium = -99.99; } - updateCurrentPrice(limits.list, currency, premium); - updateAmountLimits(limits.list, currency, premium); + updateCurrentPrice(limits.list, fav.currency, premium); + updateAmountLimits(limits.list, fav.currency, premium); setMaker({ ...maker, premium, @@ -244,8 +242,8 @@ const MakerForm = ({ if (!disableRequest) { setSubmittingRequest(true); const body = { - type: type == 0 ? 1 : 0, - currency: currency == 0 ? 1 : currency, + type: fav.type == 0 ? 1 : 0, + currency: fav.currency == 0 ? 1 : fav.currency, amount: advancedOptions ? null : maker.amount, has_range: advancedOptions, min_amount: advancedOptions ? maker.minAmount : null, @@ -325,7 +323,7 @@ const MakerForm = ({ }; const resetRange = function () { - const index = currency === 0 ? 1 : currency; + const index = fav.currency === 0 ? 1 : fav.currency; const minAmount = maker.amount ? parseFloat((maker.amount / 2).toPrecision(2)) : parseFloat(Number(limits.list[index].max_amount * 0.25).toPrecision(2)); @@ -376,11 +374,11 @@ const MakerForm = ({ const disableSubmit = function () { return ( - type == null || + fav.type == null || (maker.amount != '' && !advancedOptions && (maker.amount < amountLimits[0] || maker.amount > amountLimits[1])) || - (maker.amount == null && (!advancedOptions || loadingLimits)) || + (maker.amount == null && (!advancedOptions || limits.loading)) || (advancedOptions && (minAmountError() || maxAmountError())) || (maker.amount <= 0 && !advancedOptions) || (maker.isExplicit && (maker.badSatoshisText != '' || maker.satoshis == '')) || @@ -389,7 +387,7 @@ const MakerForm = ({ }; const clearMaker = function () { - setAppState({ type: null }); + setFav({ ...fav, type: null }); setMaker(defaultMaker); }; @@ -401,7 +399,11 @@ const MakerForm = ({ align='center' color={disableSubmit() ? 'text.secondary' : 'text.primary'} > - {type == null ? t('Order for ') : type == 1 ? t('Buy order for ') : t('Sell order for ')} + {fav.type == null + ? t('Order for ') + : fav.type == 1 + ? t('Buy order for ') + : t('Sell order for ')} {advancedOptions && maker.minAmount != '' ? pn(maker.minAmount) + '-' + pn(maker.maxAmount) : pn(maker.amount)} @@ -434,12 +436,12 @@ const MakerForm = ({ return ( - -
+ +
- + @@ -499,14 +501,15 @@ const MakerForm = ({ size={advancedOptions ? 'small' : 'large'} variant='contained' onClick={() => - setAppState({ + setFav({ + ...fav, type: 1, }) } - disableElevation={type == 1} + disableElevation={fav.type == 1} sx={{ - backgroundColor: type == 1 ? 'primary.main' : 'background.paper', - color: type == 1 ? 'background.paper' : 'text.secondary', + backgroundColor: fav.type == 1 ? 'primary.main' : 'background.paper', + color: fav.type == 1 ? 'background.paper' : 'text.secondary', ':hover': { color: 'background.paper', }, @@ -518,15 +521,16 @@ const MakerForm = ({ size={advancedOptions ? 'small' : 'large'} variant='contained' onClick={() => - setAppState({ + setFav({ + ...fav, type: 0, }) } - disableElevation={type == 0} + disableElevation={fav.type == 0} color='secondary' sx={{ - backgroundColor: type == 0 ? 'secondary.main' : 'background.paper', - color: type == 0 ? 'background.secondary' : 'text.secondary', + backgroundColor: fav.type == 0 ? 'secondary.main' : 'background.paper', + color: fav.type == 0 ? 'background.secondary' : 'text.secondary', ':hover': { color: 'background.paper', }, @@ -544,7 +548,7 @@ const MakerForm = ({ handleCurrencyChange(e.target.value)} > {Object.entries(currencyDict).map(([key, value]) => ( @@ -632,10 +636,10 @@ const MakerForm = ({ - + void; orders: Order[]; - type: number; - windowHeight: number; - windowWidth: number; - currency: number; - setAppState: (state: object) => void; + fav: Favorites; + maker: Maker; + setFav: (state: Favorites) => void; + setMaker: (state: Maker) => void; + windowSize: { width: number; height: number }; } const MakerPage = ({ limits, fetchLimits, orders, - currency, - type, - setAppState, - windowHeight, - windowWidth, + fav, + maker, + setFav, + setMaker, + windowSize, }: MakerPageProps): JSX.Element => { const { t } = useTranslation(); const history = useHistory(); - const [maker, setMaker] = useState(defaultMaker); - const maxHeight = windowHeight ? windowHeight * 0.85 - 7 : 1000; + const maxHeight = windowSize.height * 0.85 - 7; const [showMatches, setShowMatches] = useState(false); const matches = filterOrders({ orders, - baseFilter: { currency: currency == 0 ? 1 : currency, type }, + baseFilter: { currency: fav.currency == 0 ? 1 : fav.currency, type: fav.type }, paymentMethods: maker.paymentMethods, amountFilter: { amount: maker.amount, @@ -59,10 +58,11 @@ const MakerPage = ({ 4 ? 4 : matches.length)} - type={type} - currency={currency} - maxWidth={Math.min(windowWidth, 60)} // EM units + book={{ + orders: matches.slice(0, matches.length > 4 ? 4 : matches.length), + loading: false, + }} + maxWidth={Math.min(windowSize.width, 60)} // EM units maxHeight={Math.min(matches.length * 3.25 + 3.575, 16.575)} // EM units defaultFullscreen={false} showControls={false} @@ -81,11 +81,10 @@ const MakerPage = ({ limits={limits} fetchLimits={fetchLimits} pricingMethods={false} - setAppState={setAppState} + fav={fav} + setFav={setFav} maker={maker} setMaker={setMaker} - type={type} - currency={currency} disableRequest={matches.length > 0 && !showMatches} collapseAll={showMatches} onSubmit={() => setShowMatches(matches.length > 0)} diff --git a/frontend/src/models/Favorites.model.ts b/frontend/src/models/Favorites.model.ts new file mode 100644 index 00000000..88204101 --- /dev/null +++ b/frontend/src/models/Favorites.model.ts @@ -0,0 +1,6 @@ +export interface Favorites { + type: number | null; + currency: number; +} + +export default Favorites; diff --git a/frontend/src/models/Info.model.ts b/frontend/src/models/Info.model.ts new file mode 100644 index 00000000..764ac6e4 --- /dev/null +++ b/frontend/src/models/Info.model.ts @@ -0,0 +1,75 @@ +export interface Info { + num_public_buy_orders: number; + num_public_sell_orders: number; + book_liquidity: number; + active_robots_today: number; + last_day_nonkyc_btc_premium: number; + last_day_volume: number; + lifetime_volume: number; + lnd_version: string; + robosats_running_commit_hash: string; + alternative_site: string; + alternative_name: string; + node_alias: string; + node_id: string; + version: { major: number | null; minor: number | null; patch: number | null }; + maker_fee: number; + taker_fee: number; + bond_size: number; + current_swap_fee_rate: number; + + // Other keys that do not belong here. TODO on NavBar PR. + coordinatorVersion: string; + clientVersion: string; + profileShown: boolean; + openStatsForNerds: boolean; + openCommuniy: boolean; + openExchangeSummary: boolean; + openClaimRewards: boolean; + openUpdateClient: boolean; + openProfile: boolean; + showRewards: boolean; + rewardInvoice: string | null; + badInvoice: boolean; + showRewardsSpinner: boolean; + withdrawn: boolean; +} + +export const defaultInfo: Info = { + num_public_buy_orders: 0, + num_public_sell_orders: 0, + book_liquidity: 0, + active_robots_today: 0, + last_day_nonkyc_btc_premium: 0, + last_day_volume: 0, + lifetime_volume: 0, + lnd_version: 'v0.0.0-beta', + robosats_running_commit_hash: '000000000000000', + alternative_site: 'RoboSats6tkf3eva7x2voqso3a5wcorsnw34jveyxfqi2fu7oyheasid.onion', + alternative_name: 'RoboSats Mainnet', + node_alias: 'šŸ¤–RoboSatsāš”(RoboDevs)', + node_id: '033b58d7681fe5dd2fb21fd741996cda5449616f77317dd1156b80128d6a71b807', + version: { major: null, minor: null, patch: null }, + maker_fee: 0, + taker_fee: 0, + bond_size: 0, + current_swap_fee_rate: 0, + + // Other keys that do not belong here. TODO on NavBar PR. + coordinatorVersion: 'v?.?.?', + clientVersion: 'v?.?.?', + profileShown: false, + openStatsForNerds: false, + openCommuniy: false, + openExchangeSummary: false, + openClaimRewards: false, + openUpdateClient: false, + openProfile: false, + showRewards: false, + rewardInvoice: null, + badInvoice: false, + showRewardsSpinner: false, + withdrawn: false, +}; + +export default Info; diff --git a/frontend/src/models/Settings.model.ts b/frontend/src/models/Settings.model.ts new file mode 100644 index 00000000..83cb48ae --- /dev/null +++ b/frontend/src/models/Settings.model.ts @@ -0,0 +1,5 @@ +export interface Settings {} + +export const defaultSettings: Settings = {}; + +export default Settings; diff --git a/frontend/src/models/index.ts b/frontend/src/models/index.ts index 7878305c..02155d08 100644 --- a/frontend/src/models/index.ts +++ b/frontend/src/models/index.ts @@ -1,8 +1,14 @@ export type { LimitList } from './Limit.model'; export type { Limit } from './Limit.model'; export type { Maker } from './Maker.model'; -export { defaultMaker } from './Maker.model'; -export type { Order } from './Order.model'; -export type { Book } from './Order.model'; +export type { Order } from './Book.model'; +export type { Book } from './Book.model'; export type { Robot } from './Robot.model'; +export type { Info } from './Info.model'; +export type { Settings } from './Settings.model'; +export type { Favorites } from './Favorites.model'; + +export { defaultMaker } from './Maker.model'; export { defaultRobot } from './Robot.model'; +export { defaultSettings } from './Settings.model'; +export { defaultInfo } from './Info.model'; diff --git a/frontend/src/utils/filterOrders.ts b/frontend/src/utils/filterOrders.ts index 9d00db2f..1b423dcb 100644 --- a/frontend/src/utils/filterOrders.ts +++ b/frontend/src/utils/filterOrders.ts @@ -1,9 +1,4 @@ -import Order from '../models/Order.model'; - -interface BaseFilter { - currency: number; - type: number | null; -} +import { Order, Favorites } from '../models'; interface AmountFilter { amount: string; @@ -14,7 +9,7 @@ interface AmountFilter { interface FilterOrders { orders: Order[]; - baseFilter: BaseFilter; + baseFilter: Favorites; amountFilter?: AmountFilter | null; paymentMethods?: string[]; }