Skip to content

Commit

Permalink
lint
Browse files Browse the repository at this point in the history
  • Loading branch information
@indaviande
indaviande committed Dec 3, 2024
1 parent 1bc7bb4 commit 415db6f
Show file tree
Hide file tree
Showing 6 changed files with 46 additions and 135 deletions.
5 changes: 1 addition & 4 deletions src/components/element/SwitchMode.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,7 @@ import { useMemo } from "react";

export default function SwitchMode() {
const { mode, toggleMode } = useTheme();
const canSwitchModes = useMemo(
() => !(!config.modes || config.modes?.length === 1),
[]
);
const canSwitchModes = useMemo(() => !(!config.modes || config.modes?.length === 1), []);

return (
canSwitchModes && (
Expand Down
47 changes: 10 additions & 37 deletions src/components/element/Tag.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,15 +1,6 @@
import type { Opportunity, Token } from "@angleprotocol/merkl-api";
import type { Chain } from "@merkl/api";
import {
Button,
Divider,
Dropdown,
Group,
Hash,
Icon,
PrimitiveTag,
Text,
} from "dappkit";
import { Button, Divider, Dropdown, Group, Hash, Icon, PrimitiveTag, Text } from "dappkit";
import type { ButtonProps } from "dappkit";
import { type Action, actions } from "src/config/actions";
import type { Protocol } from "src/config/protocols";
Expand All @@ -33,11 +24,7 @@ export type TagProps<T extends keyof TagTypes> = ButtonProps & {
value: TagTypes[T];
};

export default function Tag<T extends keyof TagTypes>({
type,
value,
...props
}: TagProps<T>) {
export default function Tag<T extends keyof TagTypes>({ type, value, ...props }: TagProps<T>) {
switch (type) {
case "status": {
const status = statuses[value as TagTypes["status"]] ?? statuses.LIVE;
Expand All @@ -64,8 +51,7 @@ export default function Tag<T extends keyof TagTypes>({
</Button>
</Group>
</Group>
}
>
}>
<PrimitiveTag look="soft" key={value} {...props}>
<Icon size={props?.size} {...status.icon} />
{status?.label}
Expand Down Expand Up @@ -98,8 +84,7 @@ export default function Tag<T extends keyof TagTypes>({
</Button>
</Group>
</Group>
}
>
}>
<PrimitiveTag look="base" key={value} {...props}>
<Icon size={props?.size} src={chain?.icon} />
{chain?.name}
Expand Down Expand Up @@ -131,8 +116,7 @@ export default function Tag<T extends keyof TagTypes>({
Open
</Button>
</Group>
}
>
}>
<PrimitiveTag look="bold" key={value} {...props}>
<Icon size={props?.size} {...action.icon} />
{action?.label}
Expand Down Expand Up @@ -175,8 +159,7 @@ export default function Tag<T extends keyof TagTypes>({
</Button>
</Group>
</Group>
}
>
}>
<PrimitiveTag look="base" key={value} {...props}>
<Icon size={props?.size} src={token.icon} />
{token?.symbol}
Expand Down Expand Up @@ -210,11 +193,7 @@ export default function Tag<T extends keyof TagTypes>({
<Divider look="soft" horizontal />
<Group className="flex-col" size="md">
{/* <Text size="xs">{token?.description}</Text> */}
<Button
to={`/chains/${token.chain?.name}`}
size="sm"
look="bold"
>
<Button to={`/chains/${token.chain?.name}`} size="sm" look="bold">
<Icon size="sm" src={token.chain?.icon} />
{token.chain?.name}
</Button>
Expand All @@ -228,8 +207,7 @@ export default function Tag<T extends keyof TagTypes>({
</Button>
</Group>
</Group>
}
>
}>
<PrimitiveTag look="base" key={value} {...props}>
<Icon size={props?.size} src={token.chain.icon} />
{token.chain.name}
Expand All @@ -255,11 +233,7 @@ export default function Tag<T extends keyof TagTypes>({
<Divider className="border-main-6" horizontal />
{/* <Text size="xs">{token?.description}</Text> */}
<Group className="flex-col" size="md">
<Button
to={`/protocols/${protocol?.name}`}
size="xs"
look="soft"
>
<Button to={`/protocols/${protocol?.name}`} size="xs" look="soft">
<Icon remix="RiArrowRightLine" />
{protocol?.name} on Merkl
</Button>
Expand All @@ -269,8 +243,7 @@ export default function Tag<T extends keyof TagTypes>({
</Button>
</Group>
</Group>
}
>
}>
<PrimitiveTag look="tint" key={value} {...props}>
<Icon src={protocol?.icon} />
{value?.name}
Expand Down
47 changes: 9 additions & 38 deletions src/components/element/functions/SearchBar.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,24 +1,11 @@
import type { Opportunity } from "@merkl/api";
import { Form, useLocation } from "@remix-run/react";
import {
Divider,
Group,
Icon,
Icons,
Input,
Modal,
Title,
useShortcut,
} from "dappkit";
import { Divider, Group, Icon, Icons, Input, Modal, Title, useShortcut } from "dappkit";
import { Button } from "dappkit";
import Scroll from "packages/dappkit/src/components/primitives/Scroll";
import { type ReactNode, useEffect, useMemo, useState } from "react";
import useOpportunity from "src/hooks/resources/useOpportunity";
import {
type Results,
type Searchable,
useMerklSearch,
} from "src/hooks/useMerklSearch";
import { type Results, type Searchable, useMerklSearch } from "src/hooks/useMerklSearch";

const titles: { [S in Searchable]: ReactNode } = {
chain: "Chains",
Expand All @@ -33,8 +20,7 @@ function OpportunityResult({ opportunity }: { opportunity: Opportunity }) {
return (
<>
<Button to={link} look="soft">
<Icons>{icons}</Icons> {opportunity.name}{" "}
<Icon remix="RiArrowRightLine" />
<Icons>{icons}</Icons> {opportunity.name} <Icon remix="RiArrowRightLine" />
</Button>
<Divider look="bold" />
</>
Expand Down Expand Up @@ -67,10 +53,7 @@ export default function SearchBar({ icon = false }: SearchBarProps) {

return (
<Group className="flex-col flex-nowrap overflow-hidden">
<Scroll
className="min-h-[70vh] w-full [&>*]:flex [&>*]:flex-col [&>*]:gap-xl*2 z-10"
vertical
>
<Scroll className="min-h-[70vh] w-full [&>*]:flex [&>*]:flex-col [&>*]:gap-xl*2 z-10" vertical>
{entries
.filter(([_, res]) => res?.length)
.map(([category, results]) => (
Expand All @@ -82,11 +65,7 @@ export default function SearchBar({ icon = false }: SearchBarProps) {
case "chain":
return (
<>
<Button
to={`/chain/${results[i].name}`}
look="soft"
className="gap-lg"
>
<Button to={`/chain/${results[i].name}`} look="soft" className="gap-lg">
<Icon src={results[i].icon} /> {results[i].name}
<Icon remix="RiArrowRightLine" />
</Button>
Expand All @@ -98,23 +77,16 @@ export default function SearchBar({ icon = false }: SearchBarProps) {
case "token":
return (
<>
<Button
to={`/token/${results[i].symbol}`}
look="soft"
>
<Icon src={results[i].icon} /> {results[i].symbol}{" "}
<Icon remix="RiArrowRightLine" />
<Button to={`/token/${results[i].symbol}`} look="soft">
<Icon src={results[i].icon} /> {results[i].symbol} <Icon remix="RiArrowRightLine" />
</Button>
<Divider look="bold" />
</>
);
case "protocol":
return (
<>
<Button
to={`/protocol/${results[i].name}`}
look="soft"
>
<Button to={`/protocol/${results[i].name}`} look="soft">
<Icon src={results[i].icon} /> {results[i].name}
<Icon remix="RiArrowRightLine" />
</Button>
Expand Down Expand Up @@ -148,8 +120,7 @@ export default function SearchBar({ icon = false }: SearchBarProps) {
/>
{Results}
</>
}
>
}>
<Form>
{icon ? (
<Button look="base">
Expand Down
36 changes: 16 additions & 20 deletions src/components/element/opportunity/OpportunityFilters.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,7 @@ export type OpportunityFilterProps = {
exclude?: OpportunityFilter[];
};

export default function OpportunityFilters({
only,
exclude,
chains,
}: OpportunityFilterProps) {
export default function OpportunityFilters({ only, exclude, chains }: OpportunityFilterProps) {
//TODO: componentify theses
const actionOptions = Object.entries(actions).reduce(
(obj, [action, { icon, label }]) =>
Expand All @@ -30,7 +26,7 @@ export default function OpportunityFilters({
</>
),
}),
{}
{},
);
const statusOptions = {
LIVE: (
Expand Down Expand Up @@ -60,35 +56,35 @@ export default function OpportunityFilters({
</>
),
}),
{}
{},
) ?? [];

const [actionsFilter, setActions] = useSearchParamState<string[]>(
"action",
(v) => v?.join(","),
(v) => v?.split(",")
v => v?.join(","),
v => v?.split(","),
);
const [statusFilter, setStatus] = useSearchParamState<string[]>(
"status",
(v) => v?.join(","),
(v) => v?.split(",")
v => v?.join(","),
v => v?.split(","),
);
const [chainIdsFilter, setChainIds] = useSearchParamState<string[]>(
"chain",
(v) => v?.join(","),
(v) => v?.split(",")
v => v?.join(","),
v => v?.split(","),
);

const [search, setSearch] = useSearchParamState<string>(
"search",
(v) => v,
(v) => v
v => v,
v => v,
);
const [innerSearch, setInnerSearch] = useState<string>(search ?? "");

const fields = useMemo(() => {
if (only) return filters.filter((f) => only.includes(f));
if (exclude) return filters.filter((f) => !exclude.includes(f));
if (only) return filters.filter(f => only.includes(f));
if (exclude) return filters.filter(f => !exclude.includes(f));
return filters;
}, [only, exclude]);

Expand All @@ -114,7 +110,7 @@ export default function OpportunityFilters({
)}
{fields.includes("action") && (
<Select
state={[actionsFilter, (a) => setActions(a as string[])]}
state={[actionsFilter, a => setActions(a as string[])]}
allOption={"All actions"}
multiple
options={actionOptions}
Expand All @@ -124,7 +120,7 @@ export default function OpportunityFilters({
)}
{fields.includes("status") && (
<Select
state={[statusFilter, (s) => setStatus(s as string[])]}
state={[statusFilter, s => setStatus(s as string[])]}
allOption={"All status"}
multiple
options={statusOptions}
Expand All @@ -134,7 +130,7 @@ export default function OpportunityFilters({
)}
{fields.includes("chain") && (
<Select
state={[chainIdsFilter, (c) => setChainIds(c as string[])]}
state={[chainIdsFilter, c => setChainIds(c as string[])]}
allOption={"All chains"}
multiple
search
Expand Down
Loading

0 comments on commit 415db6f

Please sign in to comment.