m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-26 11:49:04 +01:00
Code

fixes

Browse Source
This commit is contained in:
Matthias Kretschmann 2023-11-04 00:36:16 +00:00
parent ae73bfc925
commit c9bdd99280
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 35 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/features/Web3/components/Input/InputGroup.tsx
View File

@ -19,6 +19,7 @@ export function InputGroup({
function handleChange(newAmount: string) { function handleChange(newAmount: string) {
$amount.set(newAmount) $amount.set(newAmount)
} }
return ( return (
<> <>
<div className={`${styles.inputGroup} ${isFocus ? styles.focus : ''}`}> <div className={`${styles.inputGroup} ${isFocus ? styles.focus : ''}`}>

19
src/features/Web3/components/TokenSelect/TokenSelect.tsx
View File

@ -6,7 +6,11 @@ import { Icon as ChevronsDown } from '@images/components/react/ChevronsDown'
import { Icon as ChevronsUp } from '@images/components/react/ChevronsUp' import { Icon as ChevronsUp } from '@images/components/react/ChevronsUp'
import { useFetchTokens } from '@features/Web3/hooks/useFetchTokens' import { useFetchTokens } from '@features/Web3/hooks/useFetchTokens'
import { useStore } from '@nanostores/react' import { useStore } from '@nanostores/react'
import { $tokens, $selectedToken } from '@features/Web3/stores' import {
$tokens,
$selectedToken,
$setSelectedToken
} from '@features/Web3/stores'
import { Loader } from '@components/Loader' import { Loader } from '@components/Loader'
import { useAccount } from 'wagmi' import { useAccount } from 'wagmi'
import { useEffect } from 'react' import { useEffect } from 'react'
@ -24,17 +28,24 @@ export function TokenSelect() {
function handleValueChange(value: `0x${string}`) { function handleValueChange(value: `0x${string}`) {
const token = tokens?.find((token) => token.address === value) const token = tokens?.find((token) => token.address === value)
if (!token) return if (!token) return
$selectedToken.set(token) $setSelectedToken(token)
} }
// TODO: reset when no account connected // reset when no account connected
useEffect(() => { useEffect(() => {
if (!address && tokens?.length && selectedToken) { if (!address && tokens?.length && selectedToken) {
$tokens.set(undefined) $tokens.set(undefined)
$selectedToken.set(undefined) $setSelectedToken(undefined)
} }
}, [address]) }, [address])
// Auto-select native token
useEffect(() => {
if (tokens && !selectedToken) {
$setSelectedToken(tokens[0])
}
}, [tokens])
return tokens ? ( return tokens ? (
<Select.Root <Select.Root
defaultValue={selectedToken?.address || tokens[0].address} defaultValue={selectedToken?.address || tokens[0].address}

38
src/features/Web3/stores/selectedToken.ts
View File

@ -1,23 +1,23 @@
import { atom } from 'nanostores' import { action } from 'nanostores'
// import { persistentAtom } from '@nanostores/persistent' import { persistentAtom } from '@nanostores/persistent'
import type { GetToken } from './tokens' import type { GetToken } from './tokens'
export const $selectedToken = atom<GetToken | undefined>() // export const $selectedToken = atom<GetToken | undefined>()
// export const $selectedToken = persistentAtom<GetToken | undefined>( export const $selectedToken = persistentAtom<GetToken | undefined>(
// '@kremalicious/selectedToken', '@kremalicious/selectedToken',
// undefined, undefined,
// { {
// encode: JSON.stringify, encode: JSON.stringify,
// decode: JSON.parse decode: JSON.parse
// } }
// ) )
// export const $selectedToken.set = action( export const $setSelectedToken = action(
// $selectedToken, $selectedToken,
// 'setSelectedToken', 'setSelectedToken',
// (store, token: GetToken) => { (store, token: GetToken | undefined) => {
// store.set(token) store.set(token)
// return store.get() return store.get()
// } }
// ) )