diff --git a/src/components/SearchInput.tsx b/src/components/SearchInput.tsx index 14b1772..d9526b9 100644 --- a/src/components/SearchInput.tsx +++ b/src/components/SearchInput.tsx @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import styled, { type AnyStyledComponent, css } from 'styled-components'; import { layoutMixins } from '@/styles/layoutMixins'; @@ -22,6 +22,11 @@ export const SearchInput = ({ }: SearchInputProps) => { const [isOpen, setIsOpen] = useState(false); const [value, setValue] = useState(''); + const inputRef = useRef(null); + + useEffect(() => { + if (isOpen) inputRef?.current?.focus(); + }, [inputRef, isOpen]); return ( @@ -41,6 +46,7 @@ export const SearchInput = ({ /> ` Styled.Thead = styled.thead` ${layoutMixins.stickyHeader} scroll-snap-align: none; + font: var(--font-mini-book); > * { height: var(--stickyArea-topHeight); @@ -839,18 +840,17 @@ Styled.Thead = styled.thead` color: var(--tableHeader-textColor); background-color: var(--tableHeader-backgroundColor); - @media ${breakpoints.notTablet} { - ${({ withInnerBorders, withGradientCardRows }) => - withInnerBorders && - !withGradientCardRows && - css` - ${layoutMixins.withInnerHorizontalBorders} - `} - } + ${({ withInnerBorders, withGradientCardRows }) => + withInnerBorders && + !withGradientCardRows && + css` + ${layoutMixins.withInnerHorizontalBorders} + `} `; Styled.Tbody = styled.tbody` ${layoutMixins.stickyArea2} + font: var(--font-small-book); // If height is fixed with not enough rows to overflow, vertically center the rows &:before, @@ -869,6 +869,10 @@ Styled.Tbody = styled.tbody` --stickyArea2-paddingBottom: var(--border-width); --stickyArea2-paddingLeft: var(--border-width); --stickyArea2-paddingRight: var(--border-width); + + tr:first-of-type { + box-shadow: none; + } `} ${({ withGradientCardRows }) => diff --git a/src/hooks/useAccounts.tsx b/src/hooks/useAccounts.tsx index 45f739a..96cd7bb 100644 --- a/src/hooks/useAccounts.tsx +++ b/src/hooks/useAccounts.tsx @@ -136,8 +136,8 @@ const useAccountsContext = () => { getSubaccounts: async ({ dydxAddress }: { dydxAddress: DydxAddress }) => { try { const response = await compositeClient?.indexerClient.account.getSubaccounts(dydxAddress); - setDydxSubaccounts(response.subaccounts); - return response.subaccounts; + setDydxSubaccounts(response?.subaccounts); + return response?.subaccounts ?? []; } catch (error) { // 404 is expected if the user has no subaccounts if (error.status === 404) { diff --git a/src/pages/portfolio/Fees.tsx b/src/pages/portfolio/Fees.tsx index 3806fb0..bf1393f 100644 --- a/src/pages/portfolio/Fees.tsx +++ b/src/pages/portfolio/Fees.tsx @@ -304,10 +304,6 @@ Styled.FeeTable = styled(Table)` @media ${breakpoints.notTablet} { --tableHeader-backgroundColor: var(--color-layer-1); - - thead tr { - --border-width: 0; - } } `; diff --git a/src/styles/tradeViewMixins.ts b/src/styles/tradeViewMixins.ts index a847b81..fa64498 100644 --- a/src/styles/tradeViewMixins.ts +++ b/src/styles/tradeViewMixins.ts @@ -18,9 +18,5 @@ export const tradeViewMixins: Record< tbody { font: var(--font-small-book); } - - thead tr { - box-shadow: none; - } `, }; diff --git a/src/views/MarketsDropdown.tsx b/src/views/MarketsDropdown.tsx index aaf8aee..2c2ba6b 100644 --- a/src/views/MarketsDropdown.tsx +++ b/src/views/MarketsDropdown.tsx @@ -82,18 +82,18 @@ const MarketsDropdownContent = ({ onRowAction }: { onRowAction?: (market: string ), }, { - columnKey: 'priceChange24H', - getCellValue: (row) => row.priceChange24H, + columnKey: 'priceChange24HPercent', + getCellValue: (row) => row.priceChange24HPercent, label: stringGetter({ key: STRING_KEYS._24H }), - renderCell: ({ priceChange24H, priceChange24HPercent }) => ( + renderCell: ({ priceChange24HPercent }) => ( - {!priceChange24H ? ( + {!priceChange24HPercent ? ( ) : ( )}