Skip to content

Commit b7777ee

Browse files
BLuEScioNBLuEScioN
committed
feat: got modal working
1 parent 9e4a9c3 commit b7777ee

File tree

154 files changed

+1932
-1301
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

154 files changed

+1932
-1301
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
"author": "Hiro Systems PBC (formerly Blockstack PBC)",
2727
"dependencies": {
2828
"@chakra-ui/anatomy": "2.2.2",
29-
"@chakra-ui/react": "3.1.2",
29+
"@chakra-ui/react": "3.2.2",
3030
"@chakra-ui/theme-tools": "2.1.2",
3131
"@contentful/rich-text-react-renderer": "15.21.2",
3232
"@contentful/rich-text-types": "16.5.2",

‎pnpm-lock.yaml‎

Lines changed: 12 additions & 12 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app/_components/BlockList/BlockAndMicroblocksItem.tsx‎

Lines changed: 0 additions & 52 deletions
This file was deleted.

‎src/app/_components/BlockList/BlocksPage/BlocksPageBlockList.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export function BlocksPageControlsLayout({
2727
marginX={-6}
2828
px={6}
2929
py={5}
30-
borderBottom={liveUpdates ? '1px solid var(--stacks-colors-borderPrimary)' : 'none'}
30+
borderBottom={liveUpdates ? '1px solid var(--stacks-colors-border-primary)' : 'none'}
3131
>
3232
{children}
3333
</Stack>

‎src/app/_components/BlockList/BlocksPage/BlocksPageBlockListGrouped.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ export function BlocksPageBlockListGrouped() {
4242
<ExplorerErrorBoundary
4343
Wrapper={Section}
4444
wrapperProps={{
45+
title: 'Recent Blocks',
4546
gridColumnStart: ['1', '1', '2'],
4647
gridColumnEnd: ['2', '2', '3'],
4748
minWidth: 0,

‎src/app/_components/BlockList/Controls.tsx‎

Lines changed: 35 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import { Field, Fieldset } from '@chakra-ui/react';
22
import { ReactNode } from 'react';
33

4+
import { Switch, SwitchProps } from '../../../components/ui/switch';
45
import { Flex, FlexProps } from '../../../ui/Flex';
56
import { StackProps } from '../../../ui/Stack';
6-
import { Switch, SwitchProps } from '../../../ui/Switch';
77

88
interface ControlsProps extends StackProps {
99
groupByBtc: SwitchProps;
@@ -29,40 +29,42 @@ export function ControlsLayout({
2929
export function Controls({ groupByBtc, liveUpdates, horizontal, ...rest }: ControlsProps) {
3030
return (
3131
<ControlsLayout horizontal={horizontal} {...rest}>
32-
<Fieldset.Root display="flex" alignItems="center" gap={3} width="fit-content">
33-
<Field.Root>
34-
<Field.Label
35-
htmlFor="group-by-btc"
36-
mb="0"
37-
mr={0}
38-
fontSize={'14px'}
39-
lineHeight={'1.5em'}
40-
fontWeight={400}
41-
textOverflow={'ellipsis'}
42-
overflow={'hidden'}
43-
whiteSpace={'nowrap'}
44-
>
45-
Group by Bitcoin block
46-
</Field.Label>
47-
<Switch id="group-by-btc" {...groupByBtc} />
32+
<Fieldset.Root w="fit-content">
33+
<Field.Root display="flex" gap={3} w="fit-content">
34+
<Switch {...groupByBtc}>
35+
<Field.Label
36+
htmlFor="group-by-btc"
37+
mb="0"
38+
mr={0}
39+
fontSize={'14px'}
40+
lineHeight={'1.5em'}
41+
fontWeight={400}
42+
textOverflow={'ellipsis'}
43+
overflow={'hidden'}
44+
whiteSpace={'nowrap'}
45+
>
46+
Group by Bitcoin block
47+
</Field.Label>
48+
</Switch>
4849
</Field.Root>
4950
</Fieldset.Root>
50-
<Fieldset.Root display="flex" alignItems="center" gap={3}>
51-
<Field.Root>
52-
<Field.Label
53-
htmlFor="live-updates"
54-
mb="0"
55-
mr={0}
56-
fontSize={'14px'}
57-
lineHeight={'1.5em'}
58-
fontWeight={400}
59-
textOverflow={'ellipsis'}
60-
overflow={'hidden'}
61-
whiteSpace={'nowrap'}
62-
>
63-
Live updates
64-
</Field.Label>
65-
<Switch id="live-updates" {...liveUpdates} />
51+
<Fieldset.Root w="fit-content">
52+
<Field.Root display="flex" gap={3} w="fit-content">
53+
<Switch {...liveUpdates}>
54+
<Field.Label
55+
htmlFor="live-updates"
56+
mb="0"
57+
mr={0}
58+
fontSize={'14px'}
59+
lineHeight={'1.5em'}
60+
fontWeight={400}
61+
textOverflow={'ellipsis'}
62+
overflow={'hidden'}
63+
whiteSpace={'nowrap'}
64+
>
65+
Live updates
66+
</Field.Label>
67+
</Switch>
6668
</Field.Root>
6769
</Fieldset.Root>
6870
</ControlsLayout>

‎src/app/_components/BlockList/Grouped/BlockListGrouped.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ const StxBlockRow = ({
9494
</Flex>
9595

9696
<HStack
97-
separator={<Caption>∙</Caption>}
97+
separator={<Caption border="none">∙</Caption>}
9898
gap={1}
9999
whiteSpace="nowrap"
100100
gridColumn="3 / 4"
@@ -258,7 +258,7 @@ function BitcoinHeader({
258258
pb={3}
259259
marginX={-PADDING}
260260
px={PADDING}
261-
borderBottom={minimized ? '1px solid var(--stacks-colors-borderPrimary)' : 'none'}
261+
borderBottom={minimized ? '1px solid var(--stacks-colors-border-primary)' : 'none'}
262262
flexWrap={'wrap'}
263263
>
264264
<Flex alignItems={'center'} gap={1.5} flexWrap={'nowrap'}>
@@ -280,7 +280,7 @@ function BitcoinHeader({
280280
</Flex>
281281
</Flex>
282282
<Box>
283-
<HStack separator={<Caption>∙</Caption>} gap={1} flexWrap={'wrap'}>
283+
<HStack separator={<Caption border="none">∙</Caption>} gap={1} flexWrap={'wrap'}>
284284
<ExplorerLink
285285
fontSize="xs"
286286
color="textSubdued"
@@ -304,8 +304,8 @@ export function Footer({
304304
blocksCount: number | undefined;
305305
}) {
306306
return (
307-
<Box borderTop="1px solid var(--stacks-colors-borderSecondary)">
308-
<HStack separator={<Caption>∙</Caption>} gap={1} pt={4} flexWrap="wrap">
307+
<Box borderTop="1px solid var(--stacks-colors-border-secondary)">
308+
<HStack separator={<Caption border="none">∙</Caption>} gap={1} pt={4} flexWrap="wrap">
309309
<Text color="textSubdued" fontSize="xs" whiteSpace="nowrap">
310310
{blocksCount ? blocksCount : '-'} blocks
311311
</Text>
@@ -398,7 +398,7 @@ export function BurnBlockGroup({
398398
);
399399

400400
return (
401-
<Box border={'1px'} rounded={'lg'} p={PADDING}>
401+
<Box border="1px solid var(--stacks-colors-border-primary)" rounded={'lg'} p={PADDING}>
402402
<BitcoinHeader btcBlock={btcBlock} minimized={minimized} isFirst={isFirst} />
403403
<ScrollableBox>
404404
<BurnBlockGroupGrid

‎src/app/_components/BlockList/Grouped/skeleton.tsx‎

Lines changed: 8 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import { Stack } from '@chakra-ui/react';
2+
13
import { SkeletonText } from '../../../..//components/ui/skeleton';
24
import { Circle } from '../../../../common/components/Circle';
35
import { useColorModeValue } from '../../../../components/ui/color-mode';
@@ -26,7 +28,7 @@ function BitcoinHeaderSkeleton() {
2628
export function BlockListLoadMoreButtonSkeleton({ ...rest }) {
2729
return (
2830
<Box width="full" {...rest}>
29-
<Button borderTop="1px solid var(--stacks-colors-borderPrimary)" width="full">
31+
<Button borderTop="1px solid var(--stacks-colors-border-primary)" width="full">
3032
<SkeletonText noOfLines={1} width={60} />
3133
</Button>
3234
</Box>
@@ -35,35 +37,12 @@ export function BlockListLoadMoreButtonSkeleton({ ...rest }) {
3537

3638
export function BurnBlockGroupFooterSkeleton() {
3739
return (
38-
<Box borderTop="1px solid var(--stacks-colors-borderSecondary)" pt={4}>
40+
<Box borderTop="1px solid var(--stacks-colors-border-secondary)" pt={4}>
3941
<SkeletonText noOfLines={1} width={60} />
4042
</Box>
4143
);
4244
}
4345

44-
function BlockCountSkeleton() {
45-
// TODO: remove. use theme
46-
const bgColor = useColorModeValue('purple.100', 'slate.900');
47-
48-
return (
49-
<Flex
50-
display={'flex'}
51-
fontSize={'xs'}
52-
bg={bgColor}
53-
rounded={'full'}
54-
px={2}
55-
alignItems={'center'}
56-
gap={1}
57-
height={8}
58-
width="fit-content"
59-
mb={3}
60-
>
61-
<SkeletonText noOfLines={1} width={20} />
62-
<Circle height={4.5} width={4.5} bg="surface" />
63-
</Flex>
64-
);
65-
}
66-
6746
export function BlockListGridHeaderRowSkeleton() {
6847
return (
6948
<>
@@ -76,7 +55,7 @@ export function BlockListGridHeaderRowSkeleton() {
7655
justifyContent="center"
7756
alignItems="center"
7857
key={`burn-block-group-tx-header-skeleton-${colIndex}`}
79-
width={20}
58+
w="fit-content"
8059
>
8160
<SkeletonText noOfLines={1} width={20} />
8261
</Flex>
@@ -93,7 +72,7 @@ export function BurnBlockGroupSkeleton({
9372
minimized?: boolean;
9473
}) {
9574
return (
96-
<Box border={'1px'} rounded={'lg'} p={4}>
75+
<Box border="normal" rounded={'lg'} p={4}>
9776
<BitcoinHeaderSkeleton />
9877
<BurnBlockGroupGridLayout minimized={minimized}>
9978
{minimized || numTxs === 0 ? null : <BlockListGridHeaderRowSkeleton />}
@@ -106,7 +85,6 @@ export function BurnBlockGroupSkeleton({
10685
/>
10786
))}
10887
</BurnBlockGroupGridLayout>
109-
<BlockCountSkeleton />
11088
<BurnBlockGroupFooterSkeleton />
11189
</Box>
11290
);
@@ -124,7 +102,7 @@ export function BurnBlockGroupListSkeleton({
124102
minimized?: boolean;
125103
}) {
126104
return (
127-
<Flex flexDirection="column" gap={4} py={6} key="burn-block-group-list-skeleton">
105+
<Stack gap={4} py={6} key="burn-block-group-list-skeleton">
128106
{numBurnBlockGroupsWithTxs
129107
? Array.from({ length: numBurnBlockGroupsWithTxs }).map((_, i) => (
130108
<BurnBlockGroupSkeleton
@@ -143,7 +121,7 @@ export function BurnBlockGroupListSkeleton({
143121
/>
144122
))
145123
: null}
146-
</Flex>
124+
</Stack>
147125
);
148126
}
149127

‎src/app/_components/BlockList/HomePage/HomePageBlockList.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ export function HomePageControlsLayout({
4545
children: ReactNode;
4646
}) {
4747
return (
48-
<Stack gap={3} pb={6} marginX={-6} px={6} py={5} borderBottom={liveUpdates ? '1px' : 'none'}>
48+
<Stack gap={3} pb={6} marginX={-6} px={6} py={5} borderBottom={liveUpdates ? '1px solid var(--stacks-colors-border-secondary)' : 'none'}>
4949
{children}
5050
</Stack>
5151
);

0 commit comments

Comments
 (0)