npm - create-dubhe - Versions diffs - 0.1.2 → 0.1.3 - Mend

create-dubhe 0.1.2 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (123) hide show

package/template/nextjs/sui-template/postcss.config.mjs ADDED Viewed

@@ -0,0 +1,8 @@
+/** @type {import('postcss-load-config').Config} */
+const config = {
+  plugins: {
+    tailwindcss: {},
+  },
+};
+export default config;

package/template/nextjs/sui-template/src/app/favicon.ico ADDED Viewed

Binary file

package/template/nextjs/sui-template/src/app/globals.css ADDED Viewed

@@ -0,0 +1,21 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+}
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+body {
+  color: var(--foreground);
+  background: var(--background);
+  font-family: Arial, Helvetica, sans-serif;
+}

package/template/nextjs/sui-template/src/app/layout.tsx ADDED Viewed

@@ -0,0 +1,17 @@
+import './globals.css';
+import '@mysten/dapp-kit/dist/index.css';
+import { Providers } from './providers';
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className="antialiased" suppressHydrationWarning>
+        <Providers>{children}</Providers>
+      </body>
+    </html>
+  );
+}

package/template/nextjs/sui-template/src/app/page.tsx ADDED Viewed

@@ -0,0 +1,151 @@
+'use client';
+import { loadMetadata, Dubhe, Transaction, TransactionResult } from '@0xobelisk/sui-client';
+import { ConnectButton, useCurrentWallet, useSignAndExecuteTransaction, useCurrentAccount } from '@mysten/dapp-kit';
+import { useEffect, useState } from 'react';
+import { useAtom } from 'jotai';
+import { toast } from 'sonner';
+// import { useRouter } from 'next/router';
+import { Value } from '@/app/state';
+import { SCHEMA_ID, NETWORK, PACKAGE_ID } from '@/chain/config';
+import { PRIVATEKEY } from '@/chain/key';
+export default function Home() {
+  //   const router = useRouter();
+  const { mutateAsync: signAndExecuteTransaction } = useSignAndExecuteTransaction();
+  const { connectionStatus } = useCurrentWallet();
+  const address = useCurrentAccount()?.address;
+  const [value, setValue] = useAtom(Value);
+  const [loading, setLoading] = useState(false);
+  const [balance, setBalance] = useState<string>('0');
+  /**
+   * Fetches the current value of the counter contract
+   */
+  const queryCounterValue = async () => {
+    const metadata = await loadMetadata(NETWORK, PACKAGE_ID);
+    const dubhe = new Dubhe({
+      networkType: NETWORK,
+      packageId: PACKAGE_ID,
+      metadata: metadata,
+    });
+    const tx = new Transaction();
+    const counterValue = await dubhe.state({
+      tx,
+      schema: 'value', // schema name in dubhe.config.ts
+      params: [tx.object(SCHEMA_ID)],
+    });
+    console.log('Counter value:', counterValue);
+    setValue(counterValue[0]);
+  };
+  /**
+   * Fetches the current balance of the connected wallet
+   */
+  const getBalance = async (): Promise<void> => {
+    if (!address) return;
+    try {
+      const dubhe = new Dubhe({ networkType: NETWORK });
+      const balance = await dubhe.balanceOf(address);
+      setBalance((Number(balance.totalBalance) / 1_000_000_000).toFixed(4));
+    } catch (error) {
+      console.error('Failed to fetch balance:', error);
+    }
+  };
+  /**
+   * Increments the counter value
+   */
+  const incrementCounter = async () => {
+    setLoading(true);
+    const metadata = await loadMetadata(NETWORK, PACKAGE_ID);
+    const dubhe = new Dubhe({
+      networkType: NETWORK,
+      packageId: PACKAGE_ID,
+      metadata: metadata,
+      secretKey: PRIVATEKEY,
+    });
+    const tx = new Transaction();
+    (await dubhe.tx.counter_system.inc({
+      tx,
+      params: [tx.object(SCHEMA_ID), tx.pure.u32(1)],
+      isRaw: true,
+    })) as TransactionResult;
+    await signAndExecuteTransaction(
+      {
+        transaction: tx.serialize(),
+        chain: `sui:${NETWORK}`,
+      },
+      {
+        onSuccess: async result => {
+          setTimeout(async () => {
+            await queryCounterValue();
+            toast('Transaction Successful', {
+              description: new Date().toUTCString(),
+              action: {
+                label: 'Check in Explorer',
+                onClick: () => window.open(dubhe.getTxExplorerUrl(result.digest), '_blank'),
+              },
+            });
+          }, 200);
+        },
+        onError: error => {
+          console.error('Transaction failed:', error);
+          toast.error('Transaction failed. Please try again.');
+        },
+      },
+    );
+    setLoading(false);
+  };
+  // Initialize counter and balance when the component mounts and wallet is connected
+  useEffect(() => {
+    if (address) {
+      queryCounterValue();
+      getBalance();
+    }
+  }, [address]);
+  return (
+    <div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
+      <main className="flex flex-col gap-8 row-start-2 items-center sm:items-start">
+        <div className="max-w-7xl mx-auto text-center py-12 px-4 sm:px-6 lg:py-16 lg:px-8 flex-6">
+          {connectionStatus !== 'connected' ? (
+            <ConnectButton />
+          ) : (
+            <>
+              <div>
+                <ConnectButton />
+                <div className="mt-4 text-lg">
+                  {Number(balance) === 0 ? (
+                    <span className="text-red-500">Balance is 0. Please acquire some {NETWORK} tokens first.</span>
+                  ) : (
+                    <span>Balance: {balance} SUI</span>
+                  )}
+                </div>
+              </div>
+              <div className="flex flex-col gap-6 mt-12">
+                <div className="flex flex-col gap-4">
+                  <div className="flex flex-col gap-6 text-2xl text-green-600 mt-6">Counter: {value}</div>
+                  <div className="flex flex-col gap-6">
+                    <button
+                      type="button"
+                      className="mx-auto px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 disabled:bg-gray-400"
+                      onClick={incrementCounter}
+                      disabled={loading || Number(balance) === 0}
+                    >
+                      {loading ? 'Processing...' : 'Increment'}
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </>
+          )}
+        </div>
+      </main>
+    </div>
+  );
+}

package/template/nextjs/sui-template/src/{pages/_app.tsx → app/providers.tsx} RENAMED Viewed

@@ -1,15 +1,11 @@
-import 'tailwindcss/tailwind.css';
-import type { AppProps } from 'next/app';
-import '../css/font-awesome.css';
-import '@mysten/dapp-kit/dist/index.css';
-import { Toaster } from 'sonner';
+'use client';
 import { createNetworkConfig, SuiClientProvider, WalletProvider } from '@mysten/dapp-kit';
+import { getFullnodeUrl } from '@0xobelisk/sui-client';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { getFullnodeUrl } from '@mysten/sui/client';
-import { NETWORK } from '../chain/config';
+import { Toaster } from 'sonner';
+import { NETWORK } from '@/chain/config';
-// Config options for the networks you want to connect to
 const { networkConfig } = createNetworkConfig({
   localnet: { url: getFullnodeUrl('localnet') },
   devnet: { url: getFullnodeUrl('devnet') },
@@ -19,17 +15,15 @@ const { networkConfig } = createNetworkConfig({
 const queryClient = new QueryClient();
-function MyApp({ Component, pageProps }: AppProps) {
+export function Providers({ children }: { children: React.ReactNode }) {
   return (
     <QueryClientProvider client={queryClient}>
       <SuiClientProvider networks={networkConfig} defaultNetwork={NETWORK}>
         <WalletProvider>
+          {children}
           <Toaster />
-          <Component {...pageProps} />
         </WalletProvider>
       </SuiClientProvider>
     </QueryClientProvider>
   );
 }
-export default MyApp;

package/template/nextjs/sui-template/src/app/state/index.tsx ADDED Viewed

@@ -0,0 +1,5 @@
+import { atom } from 'jotai';
+const Value = atom<number>(0);
+export { Value };

package/template/nextjs/sui-template/src/chain/config.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 type NetworkType = 'testnet' | 'mainnet' | 'devnet' | 'localnet';
-export const NETWORK: NetworkType = 'testnet';
-export const PACKAGE_ID = '0xecf70ffbdc1af4d2b781aec4f5cbb5558c7c559c5f9e52ef4da770d3c2f3ad0d'
-export const SCHEMA_ID = '0x1117240e366ca68db5b0841564313bfba957c6eca365772786d63f4d734ec77f'
+export const NETWORK: NetworkType = 'localnet';
+export const PACKAGE_ID = '0x6c0d1a23aefeb10bb53837dd23463420dd7c4edce6f762882ae75ea16cbd702c'
+export const SCHEMA_ID = '0xe60a62fb4c195d3867b33ca55d536c84373c66caa603c9ace0013a5a1a86de64'

package/template/nextjs/sui-template/tailwind.config.ts ADDED Viewed

@@ -0,0 +1,18 @@
+import type { Config } from 'tailwindcss';
+export default {
+  content: [
+    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
+    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
+    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
+  ],
+  theme: {
+    extend: {
+      colors: {
+        background: 'var(--background)',
+        foreground: 'var(--foreground)',
+      },
+    },
+  },
+  plugins: [],
+} satisfies Config;

package/template/nextjs/sui-template/tsconfig.json CHANGED Viewed

@@ -5,12 +5,8 @@
     }
   },
   "compilerOptions": {
-    "target": "es6",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": false,
@@ -22,14 +18,16 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
-    "incremental": true
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
 }

package/template/101/sui-template/.dockerignore DELETED Viewed

@@ -1,7 +0,0 @@
-Dockerfile
-.dockerignore
-node_modules
-npm-debug.log
-README.md
-.next
-.git

package/template/101/sui-template/.eslintrc.json DELETED Viewed

@@ -1,3 +0,0 @@
-{
-  "extends": "next/core-web-vitals"
-}

package/template/101/sui-template/Dockerfile DELETED Viewed

@@ -1,52 +0,0 @@
-# Install dependencies only when needed
-FROM node:18-alpine AS deps
-# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
-RUN apk add --no-cache libc6-compat
-WORKDIR /app
-# If using npm with a `package-lock.json` comment out above and use below instead
-COPY package.json package-lock.json ./
-RUN npm ci
-# Rebuild the source code only when needed
-FROM node:18-alpine AS builder
-WORKDIR /app
-COPY --from=deps /app/node_modules ./node_modules
-COPY . .
-# Next.js collects completely anonymous telemetry data about general usage.
-# Learn more here: https://nextjs.org/telemetry
-# Uncomment the following line in case you want to disable telemetry during the build.
-# ENV NEXT_TELEMETRY_DISABLED 1
-# If using npm comment out above and use below instead
-RUN npm run build
-# Production image, copy all the files and run next
-FROM node:18-alpine AS runner
-WORKDIR /app
-ENV NODE_ENV production
-# Uncomment the following line in case you want to disable telemetry during runtime.
-# ENV NEXT_TELEMETRY_DISABLED 1
-RUN addgroup --system --gid 1001 nodejs
-RUN adduser --system --uid 1001 nextjs
-# You only need to copy next.config.js if you are NOT using the default configuration
-# COPY --from=builder /app/next.config.js ./
-COPY --from=builder /app/public ./public
-COPY --from=builder /app/package.json ./package.json
-# Automatically leverage output traces to reduce image size
-# https://nextjs.org/docs/advanced-features/output-file-tracing
-COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
-COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
-USER nextjs
-EXPOSE 3000
-ENV PORT 3000
-CMD ["node", "server.js"]