Skip to content

Commit 084b83a

Browse files
melMassmelMass
authored
Merge branch 'develop' into dev/mel-gql-experiment
2 parents e697abe + dd461fc commit 084b83a

File tree

18 files changed

+375
-114
lines changed

18 files changed

+375
-114
lines changed

‎.storybook/main.ts

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,19 @@ const config: StorybookConfig = {
1111
name: '@storybook/react-vite',
1212
options: {},
1313
},
14+
1415
core: {
1516
disableTelemetry: true,
1617
enableCrashReports: true,
1718
},
18-
19+
typescript: {
20+
reactDocgen: 'react-docgen-typescript',
21+
reactDocgenTypescriptOptions: {
22+
shouldExtractLiteralValuesFromEnum: true,
23+
propFilter: (prop) =>
24+
prop.parent ? !/node_modules/.test(prop.parent.fileName) : true,
25+
},
26+
},
1927
docs: {
2028
defaultName: 'Documentation',
2129
autodocs: true,

‎.storybook/preview.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import '@styles/index.scss'
22
import { themes } from '@storybook/theming'
33
import { THEME_OPTIONS } from '@constants'
44
import { decorators as shared } from '../src/stories/shared'
5+
56
export const globalTypes = {
67
theme: {
78
toolbar: {

‎src/atoms/select/ThemeSelection.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export const ThemeSelection = (props) => {
1010
<Select
1111
alt="theme selection"
1212
value={{ label: THEMES[theme], value: theme }}
13-
onChange={(e) => setTheme(e.value)}
13+
onChange={(e) => setTheme(e.value, props.apply)}
1414
options={THEME_OPTIONS}
1515
{...props}
1616
/>

‎src/components/header/Header.jsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -27,11 +27,6 @@ import { useUserStore } from '@context/userStore'
2727
import { useModalStore } from '@context/modalStore'
2828
import { shallow } from 'zustand/shallow'
2929

30-
const setDataTheme = (theme) => {
31-
const root = document.documentElement
32-
root.setAttribute('data-theme', theme)
33-
}
34-
3530
export const Header = () => {
3631
const [
3732
address,
@@ -62,7 +57,8 @@ export const Header = () => {
6257

6358
// Subscribe to theme changes using zustand
6459
useEffect(() => {
65-
const unsub = useLocalSettings.subscribe((st) => st.theme, setDataTheme, {
60+
const applyTheme = useLocalSettings.getState().applyTheme
61+
const unsub = useLocalSettings.subscribe((st) => st.theme, applyTheme, {
6662
fireImmediately: true,
6763
})
6864
return unsub

‎src/components/media-types/index.tsx

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -15,24 +15,29 @@ import { MD } from './md'
1515
import { useMemo } from 'react'
1616
import { NFT } from '@types'
1717

18+
interface RenderMediaTypeProps {
19+
/**The nft with the core fragments*/
20+
nft: NFT
21+
/**When minting this is a base64 (or ObjectURL) representation of the image/video */
22+
previewUri?: string
23+
/**When minting this is a base64 (or ObjectURL) representation of the cover image/video */
24+
previewDisplayUri?: string
25+
/**false on feeds, true on objkt detail view. */
26+
displayView?: boolean
27+
/**hacky way to pass the details hover for now... */
28+
details?: JSX.Element | JSX.Element[]
29+
}
30+
1831
/**
19-
* Method that handles the rendering of any of the supported
20-
* media types.
32+
* Method that handles the rendering of any of the supported media types.
2133
*/
22-
2334
export const RenderMediaType = ({
2435
nft,
2536
previewUri,
2637
previewDisplayUri,
2738
displayView,
2839
details,
29-
}: {
30-
nft: NFT
31-
previewUri?: string
32-
previewDisplayUri?: string
33-
displayView?: boolean
34-
details?: JSX.Element | JSX.Element[]
35-
}) => {
40+
}: RenderMediaTypeProps) => {
3641
const [forceArtifact, setForceArtifact] = useState(false)
3742
const parsedArtifactUri = useMemo(
3843
() =>

‎src/components/media-types/video/index.jsx

Lines changed: 27 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { useEffect, useRef } from 'react'
22
import { iOS } from '@utils/os'
33
import styles from '@style'
44
import ImageComponent from '../image/index'
5+
import { VideoIcon } from '@icons/refs'
56

67
/**
78
* @param {import("@types").MediaTypeProps} renderOptions - Th options for the media renderer
@@ -70,28 +71,32 @@ export const VideoComponent = ({
7071
)
7172

7273
return (
73-
<ImageComponent
74-
artifactUri={artifactUri}
75-
displayUri={displayUri}
76-
previewUri={previewUri}
77-
inView={inView}
78-
displayView={displayView}
79-
nft={nft}
80-
/>
81-
// <div className={styles.container}>
82-
// <video
83-
// ref={domElement}
84-
// className={styles.video}
85-
// autoPlay={inView}
86-
// playsInline
87-
// muted
88-
// loop
89-
// src={previewUri ? previewUri : displayUri}
90-
// poster={displayUri}
91-
// title={`video object ${nft.token_id}`}
92-
// />
93-
// </div>
74+
<>
75+
<div className={styles.icon}>
76+
<VideoIcon size={32} />
77+
</div>
78+
<ImageComponent
79+
artifactUri={artifactUri}
80+
displayUri={displayUri}
81+
previewUri={previewUri}
82+
inView={inView}
83+
displayView={displayView}
84+
nft={nft}
85+
/>
86+
</>
9487
)
9588
}
96-
89+
// <div className={styles.container}>
90+
// <video
91+
// ref={domElement}
92+
// className={styles.video}
93+
// autoPlay={inView}
94+
// playsInline
95+
// muted
96+
// loop
97+
// src={previewUri ? previewUri : displayUri}
98+
// poster={displayUri}
99+
// title={`video object ${nft.token_id}`}
100+
// />
101+
// </div>
97102
export default VideoComponent

‎src/components/media-types/video/index.module.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,3 +16,9 @@
1616
max-height: 60vh;
1717
max-width: 100%;
1818
}
19+
20+
.icon {
21+
position: absolute;
22+
top: 6px;
23+
right: 6px;
24+
}

‎src/context/localSettingsStore.ts

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { useUserStore } from './userStore'
88

99
type ViewMode = 'single' | 'masonry'
1010

11-
type Theme = 'dark' | 'light' | 'kawai' | 'aqua' | 'coffee' | 'midnight'
11+
export type Theme = 'dark' | 'light' | 'kawai' | 'aqua' | 'coffee' | 'midnight'
1212

1313
export const rpc_nodes = [
1414
'https://mainnet.api.tez.ie',
@@ -37,7 +37,8 @@ interface LocalSettingsState {
3737
setZen: (zen: boolean) => void
3838
toggleTheme: () => void
3939
setViewMode: (mode: ViewMode) => void
40-
setTheme: (theme: Theme) => void
40+
setTheme: (theme: Theme, apply?: boolean) => void
41+
applyTheme: (theme: Theme) => void
4142
setNsfwFriendly: (v: boolean) => void
4243
setPhotosensitiveFriendly: (v: boolean) => void
4344
setRpcNode: (rpcNode?: RPC_NODES) => Promise<void>
@@ -73,7 +74,16 @@ export const useLocalSettings = create<LocalSettingsState>()(
7374
: state.themeDark,
7475
})),
7576
setViewMode: (viewMode: ViewMode) => set({ viewMode }),
76-
setTheme: (theme: Theme) => set({ theme }),
77+
setTheme: (theme, apply) => {
78+
set({ theme })
79+
if (apply) {
80+
get().applyTheme(theme)
81+
}
82+
},
83+
applyTheme: (theme) => {
84+
const root = document.documentElement
85+
root.setAttribute('data-theme', theme)
86+
},
7787
setRpcNode: async (rpcNode) => {
7888
set({ rpcNode })
7989
await useUserStore.getState().sync({ rpcNode })

‎src/context/userStore.ts

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ interface UserState {
116116
) => OperationReturn
117117
}
118118
// const rpcClient = new CancellableRpcClient(useLocalSettings.getState().rpcNode)
119-
export const Tezos = new TezosToolkit(useLocalSettings.getState().rpcNode)
119+
export const Tezos = new TezosToolkit(import.meta.env.VITE_TEZOS_RPC)
120120

121121
const Packer = new MichelCodecPacker()
122122

@@ -158,7 +158,8 @@ export const useUserStore = create<UserState>()(
158158
try {
159159
step(
160160
title,
161-
`Awaiting for confirmation of the [operation](https://tzkt.io/${op.opHash})`
161+
`Awaiting for confirmation of the [operation](https://tzkt.io/${op.opHash})
162+
__closing this dialog has no effect on the transaction__`
162163
)
163164
const confirm = await op.confirmation()
164165
show(
@@ -403,7 +404,6 @@ export const useUserStore = create<UserState>()(
403404
collect: async (listing) => {
404405
const handleOp = get().handleOp
405406
const show = useModalStore.getState().show
406-
const close = useModalStore.getState().close
407407
const showError = useModalStore.getState().showError
408408

409409
let batch = undefined
@@ -430,8 +430,6 @@ export const useUserStore = create<UserState>()(
430430
}
431431
} catch (error) {
432432
showError('Collect', error)
433-
} finally {
434-
close()
435433
}
436434
},
437435
cancelV1: async (swap_id) => {

‎src/icons/refs.js

Lines changed: 35 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,53 @@
11
import withIcon from '@utils/with-icon'
22

3-
export const BurnIcon = withIcon(`<svg>
3+
export const BurnIcon = withIcon(
4+
`<svg>
45
<path d="M9.66 2.67c-.13.6-.26 1.2-.15 1.76.08.39.29.78.84 1.1l.16-.38.24-.64.63.34.25.16a7.07 7.07 0 0 1 2.14 2.12c1 1.55 1.53 3.83-.12 6.79a.62.62 0 0 1-.8.24.54.54 0 0 1-.26-.75c1.45-2.6.95-4.48.15-5.7-.4-.64-.9-1.12-1.3-1.44l-.1-.08a3.2 3.2 0 0 1-.07.13c-.06.1-.17.26-.33.38l-.27.2-.32-.13C9.08 6.28 8.5 5.5 8.33 4.63a3.83 3.83 0 0 1-.02-1.26 3.79 3.79 0 0 0-2.3 2.15 5.48 5.48 0 0 0 .14 3.8l.45 1.27-1.3-.6a4.84 4.84 0 0 1-1.6-1.43 8.76 8.76 0 0 1-.4-.54 3.2 3.2 0 0 0-.73 2.77c.2 1.09.86 2.04 1.32 2.5.22.22.2.57-.04.78-.24.2-.62.2-.85-.03a6.26 6.26 0 0 1-1.61-3.06 4.37 4.37 0 0 1 1.65-4.32l.67-.57.3.8c.03.09.24.46.56.89-.1-.9-.01-1.8.32-2.64.57-1.46 1.86-2.62 4.04-3.12l.93-.22-.2.87Z"/>
5-
</svg>`)
6+
</svg>`,
7+
16
8+
)
69

710
export const GenerativeIcon = withIcon(`
8-
<circle cx="15" cy="15" r="14.25" fill="#0D0D0D" stroke="#fff"/>
9-
<path fill="#fff" d="m10.6 13.34-3.3 1.7v.06l3.3 1.7v.92h-.15l-4.24-2.3v-.7l4.24-2.3h.14v.92Zm6.18-3.98h1l-4.15 11.51h-1l4.15-11.5Zm2.85 3.06 4.24 2.3v.7l-4.24 2.3h-.14v-.92l3.3-1.7v-.06l-3.3-1.7v-.92h.14Z"/>
10-
<path fill="#fff" d="m10.6 13.34.18.35.21-.11v-.24h-.4Zm-3.3 1.7-.2-.36-.2.12v.24h.4Zm0 .06h-.4v.24l.2.12.2-.36Zm3.3 1.7h.4v-.24l-.22-.11-.19.35Zm0 .92v.4h.4v-.4h-.4Zm-.15 0-.2.35.1.05h.1v-.4Zm-4.24-2.3h-.4v.24l.21.12.2-.36Zm0-.7-.19-.36-.2.12v.24h.4Zm4.24-2.3v-.4h-.1l-.1.05.2.35Zm.14 0h.4v-.4h-.4v.4Zm-.18.56-3.3 1.7.37.72 3.3-1.7-.37-.72Zm-3.52 2.06v.06h.8v-.06h-.8Zm.22.42 3.3 1.7.37-.71-3.3-1.7-.37.7Zm3.08 1.34v.92h.8v-.92h-.8Zm.4.52h-.14v.8h.14v-.8Zm.05.04L6.4 15.07l-.38.7 4.24 2.3.38-.7ZM6.6 15.42v-.7h-.8v.7h.8Zm-.2-.35 4.23-2.3-.38-.7-4.24 2.3.38.7Zm4.04-2.25h.14v-.8h-.14v.8Zm-.26-.4v.92h.8v-.92h-.8Zm6.59-3.06v-.4h-.28l-.1.27.38.13Zm1 0 .38.14.2-.54h-.58v.4Zm-4.15 11.51v.4h.28l.1-.26-.38-.14Zm-1 0-.38-.13-.2.53h.57v-.4Zm4.15-11.1h1v-.8h-1v.8Zm.63-.54-4.15 11.5.75.28L18.16 9.5l-.75-.27Zm-3.78 11.24h-1v.8h1v-.8Zm-.63.54L17.15 9.5l-.75-.27-4.15 11.5.75.28Zm6.63-8.59.19-.35-.09-.05h-.1v.4Zm4.24 2.3h.4v-.24l-.21-.12-.2.36Zm0 .7.19.36.2-.12v-.24h-.4Zm-4.24 2.3v.4h.1l.09-.05-.19-.35Zm-.14 0h-.4v.4h.4v-.4Zm0-.92-.19-.35-.21.11v.24h.4Zm3.3-1.7.2.36.2-.12v-.24h-.4Zm0-.06h.4v-.24l-.2-.12-.2.36Zm-3.3-1.7h-.4v.24l.21.11.19-.35Zm0-.92v-.4h-.4v.4h.4Zm-.05.36 4.24 2.29.38-.7-4.24-2.3-.38.7Zm4.03 1.94v.7h.8v-.7h-.8Zm.2.35-4.23 2.3.38.7 4.24-2.3-.38-.7Zm-4.04 2.25h-.14v.8h.14v-.8Zm.26.4v-.92h-.8v.92h.8Zm-.22-.56 3.31-1.7-.36-.72-3.32 1.7.37.72Zm3.53-2.06v-.06h-.8v.06h.8Zm-.22-.42-3.31-1.7-.37.71 3.32 1.7.36-.7Zm-3.1-1.34v-.92h-.8v.92h.8Zm-.4-.52h.15v-.8h-.14v.8Z"/>
11+
<circle cx="15" cy="15" r="14.25" fill="var(--text-color)" stroke="var(--background-color)"/>
12+
<path fill="var(--background-color)" d="m10.6 13.34-3.3 1.7v.06l3.3 1.7v.92h-.15l-4.24-2.3v-.7l4.24-2.3h.14v.92Zm6.18-3.98h1l-4.15 11.51h-1l4.15-11.5Zm2.85 3.06 4.24 2.3v.7l-4.24 2.3h-.14v-.92l3.3-1.7v-.06l-3.3-1.7v-.92h.14Z"/>
13+
<path fill="var(--background-color)" d="m10.6 13.34.18.35.21-.11v-.24h-.4Zm-3.3 1.7-.2-.36-.2.12v.24h.4Zm0 .06h-.4v.24l.2.12.2-.36Zm3.3 1.7h.4v-.24l-.22-.11-.19.35Zm0 .92v.4h.4v-.4h-.4Zm-.15 0-.2.35.1.05h.1v-.4Zm-4.24-2.3h-.4v.24l.21.12.2-.36Zm0-.7-.19-.36-.2.12v.24h.4Zm4.24-2.3v-.4h-.1l-.1.05.2.35Zm.14 0h.4v-.4h-.4v.4Zm-.18.56-3.3 1.7.37.72 3.3-1.7-.37-.72Zm-3.52 2.06v.06h.8v-.06h-.8Zm.22.42 3.3 1.7.37-.71-3.3-1.7-.37.7Zm3.08 1.34v.92h.8v-.92h-.8Zm.4.52h-.14v.8h.14v-.8Zm.05.04L6.4 15.07l-.38.7 4.24 2.3.38-.7ZM6.6 15.42v-.7h-.8v.7h.8Zm-.2-.35 4.23-2.3-.38-.7-4.24 2.3.38.7Zm4.04-2.25h.14v-.8h-.14v.8Zm-.26-.4v.92h.8v-.92h-.8Zm6.59-3.06v-.4h-.28l-.1.27.38.13Zm1 0 .38.14.2-.54h-.58v.4Zm-4.15 11.51v.4h.28l.1-.26-.38-.14Zm-1 0-.38-.13-.2.53h.57v-.4Zm4.15-11.1h1v-.8h-1v.8Zm.63-.54-4.15 11.5.75.28L18.16 9.5l-.75-.27Zm-3.78 11.24h-1v.8h1v-.8Zm-.63.54L17.15 9.5l-.75-.27-4.15 11.5.75.28Zm6.63-8.59.19-.35-.09-.05h-.1v.4Zm4.24 2.3h.4v-.24l-.21-.12-.2.36Zm0 .7.19.36.2-.12v-.24h-.4Zm-4.24 2.3v.4h.1l.09-.05-.19-.35Zm-.14 0h-.4v.4h.4v-.4Zm0-.92-.19-.35-.21.11v.24h.4Zm3.3-1.7.2.36.2-.12v-.24h-.4Zm0-.06h.4v-.24l-.2-.12-.2.36Zm-3.3-1.7h-.4v.24l.21.11.19-.35Zm0-.92v-.4h-.4v.4h.4Zm-.05.36 4.24 2.29.38-.7-4.24-2.3-.38.7Zm4.03 1.94v.7h.8v-.7h-.8Zm.2.35-4.23 2.3.38.7 4.24-2.3-.38-.7Zm-4.04 2.25h-.14v.8h.14v-.8Zm.26.4v-.92h-.8v.92h.8Zm-.22-.56 3.31-1.7-.36-.72-3.32 1.7.37.72Zm3.53-2.06v-.06h-.8v.06h.8Zm-.22-.42-3.31-1.7-.37.71 3.32 1.7.36-.7Zm-3.1-1.34v-.92h-.8v.92h.8Zm-.4-.52h.15v-.8h-.14v.8Z"/>
1114
`)
1215

13-
export const SwapIcon = withIcon(`
16+
export const SwapIcon = withIcon(
17+
`
1418
<path d="M1.97 1.97a.56.56 0 0 1 .44-.16l5.5.36c.14 0 .27.06.37.16l5.63 5.63c.4.4.4 1.06 0 1.46l-4.49 4.5c-.4.4-1.05.4-1.46 0L2.33 8.27a.56.56 0 0 1-.16-.36L1.8 2.4a.56.56 0 0 1 .16-.44Zm1.3 5.66 5.42 5.42 4.36-4.36-5.41-5.42-4.67-.3.3 4.66Z"/>
15-
`)
19+
`,
20+
16
21+
)
1622

1723
export const TezosIcon = withIcon(
1824
`<path
1925
fill="var(--text-color)"
2026
d="M9.23 11.96a4.18 4.18 0 0 0 1.12-.16v.9a3.75 3.75 0 0 1-1.36.23c-.63 0-1.12-.16-1.47-.49-.34-.34-.51-.91-.51-1.72V6.57H6v-.56l1.06-.44L7.48 4h.69v1.64h7.57v.8l-3.15 3.35c1.21.06 2.09.36 2.62.89.53.52.79 1.23.79 2.12a3.3 3.3 0 0 1-.41 1.67c-.27.49-.67.86-1.2 1.13-.51.28-1.14.4-1.87.4-.95 0-1.78-.16-2.5-.47v-1.08a5.53 5.53 0 0 0 2.43.56c.8 0 1.39-.21 1.78-.64.39-.42.58-.96.58-1.61 0-.65-.22-1.15-.65-1.5-.43-.37-1.15-.55-2.14-.55h-.8v-.88l3.05-3.26h-6.1v4.1c0 .86.35 1.29 1.06 1.29Z"
21-
/>`
27+
/>`,
28+
16
2229
)
2330

24-
export const MintedIcon = withIcon(`
31+
export const MintedIcon = withIcon(
32+
`
2533
<path d="M7 2.63a1.07 1.07 0 0 1 2.03 0l1.01 3.12h3.28c1.03 0 1.46 1.32.63 1.93l-2.66 1.93 1.02 3.11c.32.99-.81 1.8-1.65 1.2l-2.65-1.93-2.65 1.93c-.84.6-1.96-.21-1.65-1.2l1.02-3.11-2.65-1.93c-.84-.6-.41-1.93.62-1.93h3.28L7 2.63Zm1.01.4-1 3.07c-.14.44-.55.74-1.01.74H2.77l2.61 1.9c.38.27.53.75.39 1.19l-1 3.07 2.61-1.9c.38-.27.88-.27 1.26 0l2.6 1.9-.99-3.07a1.1 1.1 0 0 1 .39-1.2l2.6-1.89h-3.22c-.46 0-.87-.3-1.01-.74L8 3.03Z"/>
26-
`)
34+
`,
35+
16
36+
)
2737

28-
export const TradeIcon = withIcon(`
38+
export const TradeIcon = withIcon(
39+
`
2940
<path d="M2.95 8.39v2.5c0 .34-.25.61-.56.61-.3 0-.56-.27-.56-.6V6.94c0-.34.25-.6.56-.6h3.67c.3 0 .56.26.56.6 0 .33-.25.6-.56.6H3.75l5.33 5.75c.22.24.22.62 0 .86a.53.53 0 0 1-.8 0L2.96 8.39Zm9.55 1.26-.02-.03-6.02-6.5a.64.64 0 0 1 0-.85.53.53 0 0 1 .79 0l6 6.48V6.29c0-.33.25-.6.56-.6.31 0 .56.27.56.6v3.96c0 .33-.25.6-.56.6h-3.67c-.3 0-.56-.27-.56-.6 0-.33.25-.6.56-.6h2.36Z"/>
30-
`)
41+
`,
42+
16
43+
)
44+
45+
// export const VideoIcon =
46+
// withIcon(`<path fill="currentColor" d="M18 9h-2V7h2m0 6h-2v-2h2m0 6h-2v-2h2M8 9H6V7h2m0 6H6v-2h2m0 6H6v-2h2M18 3v2h-2V3H8v2H6V3H4v18h2v-2h2v2h8v-2h2v2h2V3h-2Z"/>
47+
// `)
48+
49+
export const VideoIcon = withIcon(
50+
`<g transform="translate(-240.658 -193.721)"><circle cx="252.673" cy="205.713" r="8.119" fill="var(--text-color)"/><path fill="var(--background-color)" d="M252.658 195.721c-5.52 0-10 4.48-10 10s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10Zm0 18c-4.41 0-8-3.59-8-8a8 8 0 0 1 3.558-6.65 7.954 7.954 0 0 1 4.442-1.35c4.41 0 8 3.59 8 8s-3.59 8-8 8Zm-2-3.5 6-4.5-6-4.5v9Z" paint-order="fill"/></g>
51+
`,
52+
24
53+
)

0 commit comments

Comments
 (0)