update: jetton

package.json

@@ -17,6 +17,8 @@
     "@radix-ui/react-navigation-menu": "^1.2.1",
     "@radix-ui/react-select": "^2.1.2",
     "@radix-ui/react-slot": "^1.1.0",
+    "@radix-ui/react-toast": "^1.2.2",
+    "@ton/core": "^0.59.0",
     "@tonconnect/ui-react": "^2.0.9",
     "@twa-dev/sdk": "^7.10.1",
     "class-variance-authority": "^0.7.0",
@@ -31,8 +33,10 @@
     "ton": "^13.9.0",
     "ton-core": "^0.53.0",
     "ton-crypto": "^3.2.0",
+    "tonweb": "^0.0.66",
     "vite-plugin-node-polyfills": "^0.22.0",
-    "vite-plugin-svgr": "^4.3.0"
+    "vite-plugin-svgr": "^4.3.0",
+    "zustand": "^5.0.1"
   },
   "devDependencies": {
     "@eslint/js": "^9.13.0",

src/App.tsx

@@ -1,4 +1,4 @@
-import { TonConnectButton } from "@tonconnect/ui-react";
+import { TonConnectButton, useTonAddress, useTonWallet } from "@tonconnect/ui-react";
 import Logo from "@/assets/logo-orbiton.svg?react";
 import {
   NavigationMenu,
@@ -11,6 +11,9 @@ import { cn } from "./lib/utils";
 import { LoopIcon, OpacityIcon } from "@radix-ui/react-icons";
 import Pools from "./pages/Pools";
 import Swap from "./pages/Swap";
+import { useEffect } from "react";
+import { useToast } from "./hooks/use-toast";
+import { useJetton } from "./hooks/useJetton";
 // import { Button } from "@/components/ui/button";
 // import WebApp from "@twa-dev/sdk";
 // import { useCounterContract } from "./hooks/useCounterContract";
@@ -50,14 +53,19 @@ const router = createBrowserRouter(
 );
 
 function App() {
-  // const { address, value, sendIncrement, contract_balance } =
-  //   useCounterContract();
+  const userFriendlyAddress = useTonAddress();
+  const { toast } = useToast();
+  useJetton();
 
-  // const { connected } = useTonConnect();
-
-  // const showAlert = () => {
-  //   WebApp.showAlert("Hey there!");
-  // };
+  useEffect(() => {
+    if (userFriendlyAddress) {
+      toast({
+        title: "Welcome to Orbiton Swap",
+        description: `Your address: ${userFriendlyAddress}`,
+        duration: 1000,
+      });
+    }
+  }, [userFriendlyAddress, toast]);
 
   return (
     <RouterProvider

src/assets/tokens.json

@@ -0,0 +1,157 @@
+[
+  {
+    "id": 1,
+    "type": "native",
+    "address": null,
+    "name": "Toncoin",
+    "symbol": "TON",
+    "description": null,
+    "image": "https://assets.dedust.io/images/ton.webp",
+    "decimals": 9,
+    "aliased": true,
+    "price": "5.45",
+    "source": null
+  },
+  {
+    "id": 2,
+    "type": "jetton",
+    "address": "EQBlqsm144Dq6SjbPI4jjZvA1hqTIP3CvHovbIfW_t-SCALE",
+    "name": "DeDust",
+    "symbol": "DUST",
+    "description": null,
+    "image": "https://assets.dedust.io/images/dust.gif",
+    "decimals": 9,
+    "aliased": true,
+    "price": "3.7803",
+    "source": null
+  },
+  {
+    "id": 3,
+    "type": "jetton",
+    "address": "EQCxE6mUtQJKFnGfaROTKOt1lZbDiiX1kCixRv7Nw2Id_sDs",
+    "name": "Tether USD",
+    "symbol": "USDT",
+    "description": null,
+    "image": "https://assets.dedust.io/images/usdt.webp",
+    "decimals": 6,
+    "aliased": true,
+    "price": "0.9983",
+    "source": {
+      "chain": "eip155:1",
+      "address": "",
+      "bridge": "",
+      "symbol": "USDT",
+      "name": "Tether USD"
+    }
+  },
+  {
+    "id": 4,
+    "type": "jetton",
+    "address": "EQB-MPwrd1G6WKNkLz_VnV6WqBDd142KMQv-g1O-8QUA3728",
+    "name": "TON Bridge USDC",
+    "symbol": "jUSDC",
+    "description": null,
+    "image": "https://assets.dedust.io/images/usdc.webp",
+    "decimals": 6,
+    "aliased": true,
+    "price": "0.9986",
+    "source": {
+      "chain": "eip155:1",
+      "address": "0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48",
+      "bridge": "ton-bridge",
+      "symbol": "USDC",
+      "name": "USD Coin"
+    }
+  },
+  {
+    "id": 5,
+    "type": "jetton",
+    "address": "EQAvlWFDxGF2lXm67y4yzC17wYKD9A0guwPkMs1gOsM__NOT",
+    "name": "Notcoin",
+    "symbol": "NOT",
+    "description": null,
+    "image": "https://assets.dedust.io/images/not.webp",
+    "decimals": 9,
+    "aliased": true,
+    "price": "0.007374",
+    "source": null
+  },
+  {
+    "id": 6,
+    "type": "jetton",
+    "address": "EQCvxJy4eG8hyHBFsZ7eePxrRsUQSFE_jpptRAYBmcG_DOGS",
+    "name": "Dogs",
+    "symbol": "DOGS",
+    "description": null,
+    "image": "https://assets.dedust.io/images/dogs.webp",
+    "decimals": 9,
+    "aliased": true,
+    "price": "0.0006267",
+    "source": null
+  },
+  {
+    "id": 7,
+    "type": "jetton",
+    "address": "EQBphnWv7EkQvjIkGPjMNacYtXo2dEqFIybPTf8IxyBGjNSz",
+    "name": "Dogecoin TON",
+    "symbol": "DOGE",
+    "description": null,
+    "image": "https://assets.dedust.io/images/doge.webp",
+    "decimals": 9,
+    "aliased": true,
+    "price": "0.01103",
+    "source": null
+  },
+  {
+    "id": 8,
+    "type": "jetton",
+    "address": "EQBam5RuB3inYXsUlamTIEqu-tNy5NmX4FBLAcZe_360eWWE",
+    "name": "Ton Hamster",
+    "symbol": "HMSTR",
+    "description": null,
+    "image": "https://assets.dedust.io/images/hmstr.webp",
+    "decimals": 9,
+    "aliased": false,
+    "price": "0.0000127",
+    "source": null
+  },
+  {
+    "id": 9,
+    "type": "jetton",
+    "address": "EQD-cvR0Nz6XAyRBvbhz-abTrRC6sI5tvHvvpeQraV9UAAD7",
+    "name": "Catizen",
+    "symbol": "CATI",
+    "description": null,
+    "image": "https://assets.dedust.io/images/cati.webp",
+    "decimals": 9,
+    "aliased": false,
+    "price": "0.4579",
+    "source": null
+  },
+  {
+    "id": 10,
+    "type": "jetton",
+    "address": "EQA3AshPEVly8wQ6mZincrKC_CkJSKXqqjyg0VMsVjF_CATS",
+    "name": "CATS",
+    "symbol": "CATS",
+    "description": null,
+    "image": "https://assets.dedust.io/images/cats2.webp",
+    "decimals": 9,
+    "aliased": false,
+    "price": "0.00003754",
+    "source": null
+  },
+  {
+    "id": 11,
+    "type": "jetton",
+    "address": "EQA2kCVNwVsil2EM2mB0SkXytxCqQjS4mttjDpnXmwG9T6bO",
+    "name": "STON",
+    "symbol": "STON",
+    "description": null,
+    "image": "https://storage.dyor.io/jettons/EQA2kCVNwVsil2EM2mB0SkXytxCqQjS4mttjDpnXmwG9T6bO/image.png",
+    "decimals": 9,
+    "aliased": false,
+    "price": "4.00",
+    "source": null
+  }
+]

src/components/ui/toast.tsx

@@ -0,0 +1,127 @@
+import * as React from "react"
+import * as ToastPrimitives from "@radix-ui/react-toast"
+import { cva, type VariantProps } from "class-variance-authority"
+import { X } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const ToastProvider = ToastPrimitives.Provider
+
+const ToastViewport = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Viewport>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Viewport
+    ref={ref}
+    className={cn(
+      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
+      className
+    )}
+    {...props}
+  />
+))
+ToastViewport.displayName = ToastPrimitives.Viewport.displayName
+
+const toastVariants = cva(
+  "group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
+  {
+    variants: {
+      variant: {
+        default: "border bg-background text-foreground",
+        destructive:
+          "destructive group border-destructive bg-destructive text-destructive-foreground",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+const Toast = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Root>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
+    VariantProps<typeof toastVariants>
+>(({ className, variant, ...props }, ref) => {
+  return (
+    <ToastPrimitives.Root
+      ref={ref}
+      className={cn(toastVariants({ variant }), className)}
+      {...props}
+    />
+  )
+})
+Toast.displayName = ToastPrimitives.Root.displayName
+
+const ToastAction = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Action>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Action
+    ref={ref}
+    className={cn(
+      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
+      className
+    )}
+    {...props}
+  />
+))
+ToastAction.displayName = ToastPrimitives.Action.displayName
+
+const ToastClose = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Close>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Close
+    ref={ref}
+    className={cn(
+      "absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
+      className
+    )}
+    toast-close=""
+    {...props}
+  >
+    <X className="h-4 w-4" />
+  </ToastPrimitives.Close>
+))
+ToastClose.displayName = ToastPrimitives.Close.displayName
+
+const ToastTitle = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Title>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Title
+    ref={ref}
+    className={cn("text-sm font-semibold [&+div]:text-xs", className)}
+    {...props}
+  />
+))
+ToastTitle.displayName = ToastPrimitives.Title.displayName
+
+const ToastDescription = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Description>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Description
+    ref={ref}
+    className={cn("text-sm opacity-90", className)}
+    {...props}
+  />
+))
+ToastDescription.displayName = ToastPrimitives.Description.displayName
+
+type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
+
+type ToastActionElement = React.ReactElement<typeof ToastAction>
+
+export {
+  type ToastProps,
+  type ToastActionElement,
+  ToastProvider,
+  ToastViewport,
+  Toast,
+  ToastTitle,
+  ToastDescription,
+  ToastClose,
+  ToastAction,
+}

src/components/ui/toaster.tsx

@@ -0,0 +1,33 @@
+import { useToast } from "@/hooks/use-toast"
+import {
+  Toast,
+  ToastClose,
+  ToastDescription,
+  ToastProvider,
+  ToastTitle,
+  ToastViewport,
+} from "@/components/ui/toast"
+
+export function Toaster() {
+  const { toasts } = useToast()
+
+  return (
+    <ToastProvider>
+      {toasts.map(function ({ id, title, description, action, ...props }) {
+        return (
+          <Toast key={id} {...props}>
+            <div className="grid gap-1">
+              {title && <ToastTitle>{title}</ToastTitle>}
+              {description && (
+                <ToastDescription>{description}</ToastDescription>
+              )}
+            </div>
+            {action}
+            <ToastClose />
+          </Toast>
+        )
+      })}
+      <ToastViewport />
+    </ToastProvider>
+  )
+}