Skip to content

Commit

Permalink
fix(spaceward): fix for actions layout and chain id issue
Browse files Browse the repository at this point in the history
  • Loading branch information
@jjheywood
jjheywood committed Apr 17, 2024
1 parent 551e99e commit 409aee5
Show file tree
Hide file tree
Showing 14 changed files with 1,795 additions and 174 deletions.
1,618 changes: 1,618 additions & 0 deletions docs/static/openapi.yml
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion spaceward/src/assets/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@
}

.no-space {
/* @apply bg-background text-foreground font-sans bg-cover bg-no-repeat bg-center dark:bg-[url("/no-space-bg.svg")]; */
@apply bg-background text-foreground font-sans bg-cover bg-no-repeat bg-center dark:bg-[url("/no-space-bg.svg")];
}

.svg-animation {
Expand Down
32 changes: 15 additions & 17 deletions spaceward/src/components/ConnectWallet.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import FaucetButton from "./FaucetButton";
import { Button } from "@/components/ui/button";
import { AlertCircle, ChevronsUpDown, Copy } from "lucide-react";
import { AlertCircle, ChevronsUpDown, LogOutIcon } from "lucide-react";
import {
Popover,
PopoverContent,
Expand All @@ -14,6 +14,8 @@ import { Wallet } from "../features/wallet";
import { useChain } from "@cosmos-kit/react";
import { env } from "@/env";

import { Copy } from "@/components/ui/copy";

export function ConnectWallet() {
const { wallet } = useChain(env.cosmoskitChainName);
const { getActiveWallet } = useDispatchWalletContext();
Expand Down Expand Up @@ -85,40 +87,36 @@ export function ConnectWallet() {
<PopoverContent className="w-80 bg-card border-0 p-6">
<div className="grid gap-4">
<div className="flex flex-row text-left text-xs gap-2 justify-between items-center">
<span className="block text-base">
{address.slice(0, 12) +
<span className="block text-sm">
{/* {address.slice(0, 12) +
"..." +
address.slice(-12)}
</span>
<span>
<Copy
className="h-4 w-4 cursor-pointer"
onClick={() =>
navigator.clipboard.writeText(address)
}
/>
address.slice(-12)} */}
<Copy value={address} split />
</span>
<div className="flex flex-row gap-2">
<LogOutIcon className="h-4 w-4" />
</div>
</div>
<div className="bg-background rounded-lg">
<div className="px-6 py-3 text-sm border-b flex justify-between">
<div className="bg-background rounded-xl">
<div className="px-6 py-4 text-sm border-b border-card flex justify-between">
<span>Wallet</span>
<span>{activeWallet?.name || ""}</span>
</div>
<div className="px-6 py-3 text-sm flex justify-between">
<div className="px-6 py-4 text-sm flex justify-between">
<span>Balance</span>
<span>{ward.toFixed(2)} WARD</span>
</div>
</div>
<div className="flex flex-col gap-4 flex-grow">
<FaucetButton />
<Wallet />
{/* <Wallet /> */}
</div>
</div>
</PopoverContent>
) : (
<PopoverContent className="w-80 rounded-t-none border-t-0 -translate-y-1 bg-card">
<div className="flex flex-col gap-4">
<Wallet />
{/* <Wallet /> */}
</div>
</PopoverContent>
)}
Expand Down
60 changes: 30 additions & 30 deletions spaceward/src/components/FaucetButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,42 +5,42 @@ import { Button } from "@/components/ui/button";
import Plausible from "plausible-tracker";

async function getFaucetTokens(addr: string) {
await fetch(env.faucetURL, {
method: "POST",
body: JSON.stringify({ address: addr }),
});
await fetch(env.faucetURL, {
method: "POST",
body: JSON.stringify({ address: addr }),
});
}

function FaucetButton() {
const [loading, setLoading] = useState(false);
const { address } = useAddressContext();
const [loading, setLoading] = useState(false);
const { address } = useAddressContext();

const { trackEvent } = Plausible();
const { trackEvent } = Plausible();

const getTokens = async () => {
setLoading(true);
await getFaucetTokens(address);
setLoading(false);
};
const getTokens = async () => {
setLoading(true);
await getFaucetTokens(address);
setLoading(false);
};

return (
<Button
disabled={loading}
onClick={() => {
getTokens(),
trackEvent("Get WARD", {
callback: () => console.log("Plausible event"),
props: {
variation: "button A",
},
});
}}
className="w-full"
size={"sm"}
>
Get WARD
</Button>
);
return (
<Button
disabled={loading}
onClick={() => {
getTokens(),
trackEvent("Get WARD", {
callback: () => console.log("Plausible event"),
props: {
variation: "button A",
},
});
}}
className="w-full h-12"
size={"sm"}
>
Get WARD
</Button>
);
}

export default FaucetButton;
18 changes: 9 additions & 9 deletions spaceward/src/components/TxMsgDetails.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export function TxMsgDetails({ msg }: { msg: DecodeObject }) {

function MsgSendDetails({ msg }: { msg: MsgSend }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>Bank send</CardTitle>
<CardDescription>Transfer of coins.</CardDescription>
Expand All @@ -77,7 +77,7 @@ function MsgSendDetails({ msg }: { msg: MsgSend }) {

function MsgNewSpaceDetails({ msg }: { msg: MsgNewSpace }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>New space</CardTitle>
<CardDescription>Creation of a new space</CardDescription>
Expand Down Expand Up @@ -153,7 +153,7 @@ function MsgAddSpaceOwnerDetails({ msg }: { msg: MsgAddSpaceOwner }) {

function MsgRemoveSpaceOwnerDetails({ msg }: { msg: MsgRemoveSpaceOwner }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>Remove owner</CardTitle>
<CardDescription>Remove a new owner to a space</CardDescription>
Expand All @@ -169,7 +169,7 @@ function MsgRemoveSpaceOwnerDetails({ msg }: { msg: MsgRemoveSpaceOwner }) {

function MsgNewKeychainDetails({ msg }: { msg: MsgNewKeychain }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>New keychain</CardTitle>
<CardDescription>Creation of a new keychain</CardDescription>
Expand All @@ -184,7 +184,7 @@ function MsgNewKeychainDetails({ msg }: { msg: MsgNewKeychain }) {

function MsgUpdateSpaceDetails({ msg }: { msg: MsgUpdateSpace }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>Update space</CardTitle>
<CardDescription>Update a space</CardDescription>
Expand All @@ -199,7 +199,7 @@ function MsgUpdateSpaceDetails({ msg }: { msg: MsgUpdateSpace }) {

function MsgApproveActionDetails({ msg }: { msg: MsgApproveAction }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>Approve action</CardTitle>
<CardDescription>Approve an action</CardDescription>
Expand All @@ -214,7 +214,7 @@ function MsgApproveActionDetails({ msg }: { msg: MsgApproveAction }) {

function MsgNewKeyRequestDetails({ msg }: { msg: MsgNewKeyRequest }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>New key request</CardTitle>
<CardDescription>Request a new key</CardDescription>
Expand All @@ -230,7 +230,7 @@ function MsgNewKeyRequestDetails({ msg }: { msg: MsgNewKeyRequest }) {

function MsgNewIntentDetails({ msg }: { msg: Any }) {
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>New intent</CardTitle>
<CardDescription>Creation of a new intent</CardDescription>
Expand All @@ -251,7 +251,7 @@ function MsgNewIntentDetails({ msg }: { msg: Any }) {
function MsgFallback({ msg }: { msg: DecodeObject }) {
const type = msg.typeUrl;
return (
<Card>
<Card className="bg-background">
<CardHeader>
<CardTitle>{type}</CardTitle>
<CardDescription>
Expand Down
82 changes: 41 additions & 41 deletions spaceward/src/components/ui/button.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,53 +5,53 @@ import { cva, type VariantProps } from "class-variance-authority";
import { cn } from "@/lib/utils";

const buttonVariants = cva(
"inline-flex items-center justify-center rounded-md ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
{
variants: {
variant: {
default:
"bg-primary text-primary-foreground hover:bg-primary/90",
destructive:
"bg-destructive text-destructive-foreground hover:bg-destructive/90",
outline:
"border border-input bg-background hover:bg-accent hover:text-background",
secondary:
"bg-secondary text-secondary-foreground hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground",
link: "text-primary underline-offset-4 hover:underline",
},
size: {
default: "h-12 px-6 pt-3 pb-2.5",
sm: "h-9 rounded-md px-3",
lg: "h-11 rounded-md px-8",
icon: "h-10 w-10",
iconxs: "h-6 w-6",
},
},
defaultVariants: {
variant: "default",
size: "default",
},
}
"inline-flex items-center justify-center rounded-none ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
{
variants: {
variant: {
default:
"bg-primary text-primary-foreground hover:bg-primary/90",
destructive:
"bg-destructive text-destructive-foreground hover:bg-destructive/90",
outline:
"border border-input bg-background hover:bg-accent hover:text-background",
secondary:
"bg-secondary text-secondary-foreground hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground",
link: "text-primary underline-offset-4 hover:underline",
},
size: {
default: "h-12 px-6 pt-3 pb-2.5",
sm: "h-9 rounded-none px-3",
lg: "h-11 rounded-none px-8",
icon: "h-10 w-10",
iconxs: "h-6 w-6",
},
},
defaultVariants: {
variant: "default",
size: "default",
},
},
);

export interface ButtonProps
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
VariantProps<typeof buttonVariants> {
asChild?: boolean;
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
VariantProps<typeof buttonVariants> {
asChild?: boolean;
}

const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ className, variant, size, asChild = false, ...props }, ref) => {
const Comp = asChild ? Slot : "button";
return (
<Comp
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
{...props}
/>
);
}
({ className, variant, size, asChild = false, ...props }, ref) => {
const Comp = asChild ? Slot : "button";
return (
<Comp
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
{...props}
/>
);
},
);
Button.displayName = "Button";

Expand Down
Loading

0 comments on commit 409aee5

Please sign in to comment.