Jared VuandTaehoon Lee
793b522487
* 🚧 New Market Form * use dev-5 as default * Additional UI work * Add mock data * 💄 More UI items * 💄 add preview step * 💄 Disable proposal button if not enough native tokens * ✏️ Add disclaimer * ✏️ fix combobox search * 🚧 clean up components * Add filters, modify, button * ✨ feat: Add details to New Market Dialog * add assetName * add helper method - spagetti code * Update NewMarketMessageDetailsDialog, attempt to hook up client call * 🚨 fix mobile safari overflow * update init deposit to 10_001 whole token * reduce delay block to 5 * Update mock data * 🚧 SO FRIGGIN CLOSE * 💄 style/ux nits * add gov to registry * PLS * IT FUCKING WORKS * Add assets * FIX TICKER * ADD NEW ASSETICON * button width * change default env to dev * Remove mention of Impersonation dialog * Market Search entry point * uncomment feature * Clean up NewMarketStep components * Restore env.json * Add space T.T * useGlobalCommands fix types * 🚧 feat: useNextClobPairId hook WIP * Add potentialMarkets hook to parse CSV and hide new market entrypoints * Use updated stringKeys * Update localization, import nits * bump v4-client * add gov vars * new useGovernanceVariables * Add validator client calls: proposal fetch/submission * Update token usage, utilize gov vars * remove console log * import nits * NewMarketMessageDetailsDialog: Fix initial_deposit_amount * NewMarketAgreement Dialog * confirm flow * Remove initialDepositAmount from mainnet env * NewMarket: Add stringParams to step3 * Update csv * update env.json add localization changes * cleanup initialDepositAmountBN and decimals * ^ * use undefined in place of 0 for DiffOutput * remove hardcoded string * Remove potentialMarket from csv * Ensure user is out of liquidity tier modification * bump localization, add additional details to receipts * feedback addressed * Add margin instead of space * margin/padding nits, shorten filter method, remove ?. chaining * additional feedback --------- Co-authored-by: Taehoon Lee <19664986+ttl33@users.noreply.github.com>
70 lines
2.1 KiB
TypeScript
70 lines
2.1 KiB
TypeScript
import { layoutMixins } from '@/styles/layoutMixins';
|
|
import styled, { type AnyStyledComponent, keyframes } from 'styled-components';
|
|
|
|
// In some strange cases, hiding a spinner on one part of the page causes the linearGradient to
|
|
// be hidden on all other instances of the page. An id can be passed in to prevent this.
|
|
export const LoadingSpinner: React.FC<{
|
|
id?: string;
|
|
className?: string;
|
|
disabled?: boolean;
|
|
}> = ({ id, className, disabled = false }) => {
|
|
return (
|
|
<Styled.Spinner className={className}>
|
|
<Styled.LoadingSpinnerSvg
|
|
id={id}
|
|
width="38"
|
|
height="38"
|
|
viewBox="0 0 38 38"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<circle
|
|
cx="19"
|
|
cy="19"
|
|
r="16"
|
|
stroke="var(--color-layer-1)"
|
|
strokeWidth="5"
|
|
strokeLinecap="round"
|
|
/>
|
|
{!disabled && (
|
|
<path
|
|
d="M35 19.248C35 22.1935 34.1611 25.08 32.5786 27.5797C30.9961 30.0794 28.7334 32.0923 26.0474 33.3897C23.3614 34.6871 20.3597 35.217 17.3831 34.9194C14.4066 34.6217 11.5744 33.5084 9.20825 31.7058C6.84207 29.9032 5.03667 27.4835 3.99704 24.7216C2.95741 21.9596 2.7252 18.966 3.32678 16.0807C3.92836 13.1953 5.33963 10.5338 7.40035 8.39841C9.46107 6.26299 12.0887 4.73918 14.9848 4"
|
|
stroke="currentColor"
|
|
strokeWidth="5"
|
|
strokeLinecap="round"
|
|
/>
|
|
)}
|
|
</Styled.LoadingSpinnerSvg>
|
|
</Styled.Spinner>
|
|
);
|
|
};
|
|
|
|
export const LoadingSpace: React.FC<{ className?: string; id: string }> = ({ className, id }) => (
|
|
<Styled.LoadingSpaceContainer className={className}>
|
|
<LoadingSpinner id={id} />
|
|
</Styled.LoadingSpaceContainer>
|
|
);
|
|
|
|
const Styled: Record<string, AnyStyledComponent> = {};
|
|
|
|
Styled.LoadingSpaceContainer = styled.div`
|
|
${layoutMixins.centered}
|
|
`;
|
|
|
|
Styled.Spinner = styled.div`
|
|
--spinner-width: auto;
|
|
|
|
line-height: 0;
|
|
color: var(--color-text-0);
|
|
`;
|
|
|
|
Styled.LoadingSpinnerSvg = styled.svg`
|
|
width: var(--spinner-width);
|
|
|
|
animation: ${keyframes`
|
|
to {
|
|
transform: rotate(1turn);
|
|
}
|
|
`} 1.5s linear infinite;
|
|
`;
|