Merge pull request #1 from VanishMax/feat/jetton

feat: partial support for jetton contracts
VanishMax · Jun 4, 2024 · dc1d496 · dc1d496
2 parents a15d656 + 1c5da1a
commit dc1d496
Show file tree

Hide file tree

Showing 56 changed files with 5,254 additions and 291 deletions.
diff --git a/apps/counter/package.json b/apps/counter/package.json
@@ -12,27 +12,27 @@
   },
   "dependencies": {
     "@ton/core": "^0.56.3",
-    "@tonconnect/ui": "^2.0.2",
-    "@tonconnect/ui-react": "^2.0.2",
+    "@tonconnect/ui": "^2.0.3",
+    "@tonconnect/ui-react": "^2.0.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "viem": "^2.9.28"
+    "viem": "^2.13.5"
   },
   "devDependencies": {
     "@fotonjs/api": "workspace:*",
-    "@fotonjs/core": "workspace:*",
     "@fotonjs/cli": "workspace:*",
-    "@tact-lang/compiler": "^1.2.0",
-    "@types/react": "^18.3.1",
+    "@fotonjs/core": "workspace:*",
+    "@tact-lang/compiler": "^1.3.0",
+    "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-    "@typescript-eslint/eslint-plugin": "^7.7.1",
-    "@typescript-eslint/parser": "^7.7.1",
-    "@vitejs/plugin-react-swc": "^3.6.0",
+    "@typescript-eslint/eslint-plugin": "^7.12.0",
+    "@typescript-eslint/parser": "^7.12.0",
+    "@vitejs/plugin-react-swc": "^3.7.0",
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.6",
+    "eslint-plugin-react-refresh": "^0.4.7",
     "typescript": "^5.4.5",
-    "vite": "^5.2.10",
+    "vite": "^5.2.12",
     "vite-plugin-node-polyfills": "^0.21.0"
   }
 }
diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -9,18 +9,18 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@vercel/analytics": "^1.2.2",
+    "@vercel/analytics": "^1.3.1",
     "next": "14.2.3",
     "nextra": "^2.13.4",
     "nextra-theme-docs": "^2.13.4",
-    "react": "^18",
-    "react-dom": "^18",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "shiki": "^0.14.7"
   },
   "devDependencies": {
-    "@types/node": "^20",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
-    "typescript": "^5"
+    "@types/node": "^20.14.1",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "typescript": "^5.4.5"
   }
 }
diff --git a/apps/jetton/.env.production b/apps/jetton/.env.production
@@ -0,0 +1 @@
+VITE_API_KEY=""
diff --git a/apps/jetton/.eslintrc.cjs b/apps/jetton/.eslintrc.cjs
@@ -0,0 +1,19 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
+  rules: {
+    'semi': ['warn', 'always'],
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}
diff --git a/apps/jetton/.gitignore b/apps/jetton/.gitignore
@@ -0,0 +1,26 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+build
diff --git a/apps/jetton/README.md b/apps/jetton/README.md
@@ -0,0 +1,3 @@
+# Foton Jetton
+
+An application showcasing how Foton can help with Jetton manipulations
diff --git a/apps/jetton/index.html b/apps/jetton/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <link rel="icon" type="image/png" href="/foton.png" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Jetton | Foton</title>
+</head>
+<body>
+<div id="root"></div>
+<script type="module" src="/src/main.tsx"></script>
+</body>
+</html>
diff --git a/apps/jetton/package.json b/apps/jetton/package.json
@@ -0,0 +1,36 @@
+{
+  "name": "@fotonjs/jetton",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview",
+    "compile": "tact --config ./tact.config.json"
+  },
+  "dependencies": {
+    "@ton/core": "^0.56.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "zustand": "^4.5.2"
+  },
+  "devDependencies": {
+    "@fotonjs/api": "workspace:*",
+    "@fotonjs/core": "workspace:*",
+    "@tact-lang/compiler": "^1.2.0",
+    "@ton/blueprint": "^0.20.0",
+    "@types/react": "^18.2.66",
+    "@types/react-dom": "^18.2.22",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
+    "@vitejs/plugin-react-swc": "^3.5.0",
+    "eslint": "^8.57.0",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.6",
+    "typescript": "^5.2.2",
+    "vite": "^5.2.0",
+    "vite-plugin-node-polyfills": "^0.21.0"
+  }
+}
diff --git a/apps/jetton/public/foton.png b/apps/jetton/public/foton.png
diff --git a/apps/jetton/public/tonconnect-manifest.json b/apps/jetton/public/tonconnect-manifest.json
@@ -0,0 +1,5 @@
+{
+  "name": "Foton Jetton",
+  "url": "https://jetton.foton.sh",
+  "iconUrl": "https://jetton.foton.sh/foton.png"
+}
diff --git a/apps/jetton/src/.eslintignore b/apps/jetton/src/.eslintignore
@@ -0,0 +1 @@
+src/contract
diff --git a/apps/jetton/src/App.css b/apps/jetton/src/App.css
@@ -0,0 +1,23 @@
+#root {
+  width: 90%;
+  margin: 0 auto;
+  padding-top: 3rem;
+}
+
+@media (min-width: 768px) {
+  #root {
+    width: 720px;
+  }
+}
+
+.card {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  padding: 2em;
+}
+
+form {
+  margin-top: 2em;
+}
diff --git a/apps/jetton/src/App.tsx b/apps/jetton/src/App.tsx
@@ -0,0 +1,29 @@
+import { useEffect } from 'react';
+import { useUserStore } from './stores/user-store.ts';
+import { JettonMinters } from './components/jetton-minters';
+import { CreateJetton } from './components/create-jetton';
+import { ManageJetton } from './components/manage-jetton';
+import { AppHeader } from './components/header';
+import './App.css';
+
+function App() {
+  const userAddress = useUserStore((state) => state.address);
+  const activeSection = useUserStore((state) => state.activeSection);
+  const monitorAuth = useUserStore((state) => state.monitorAuth);
+
+  useEffect(() => {
+    monitorAuth();
+  }, [monitorAuth]);
+
+  return (
+    <>
+      <AppHeader />
+
+      {activeSection === 'minters' && <JettonMinters />}
+      {activeSection === 'create' && <CreateJetton userAddress={userAddress} />}
+      {activeSection === 'manage' && <ManageJetton />}
+    </>
+  );
+}
+
+export default App;
diff --git a/apps/jetton/src/components/connect-button/index.tsx b/apps/jetton/src/components/connect-button/index.tsx
@@ -0,0 +1,13 @@
+import { FC } from 'react';
+import { useUserStore } from '../../stores/user-store.ts';
+
+export const ConnectButton: FC = () => {
+  const loading = useUserStore((state) => state.loading);
+  const connect = useUserStore((state) => state.connect);
+
+  return (
+    <button disabled={loading} onClick={connect}>
+      {loading ? 'Loading...' : 'Connect'}
+    </button>
+  );
+};
diff --git a/apps/jetton/src/components/create-jetton/index.tsx b/apps/jetton/src/components/create-jetton/index.tsx
@@ -0,0 +1,109 @@
+import { FC, FormEventHandler, useState } from 'react';
+import styles from './styles.module.css';
+import { getJettonDeployArguments, parseTon } from '@fotonjs/core';
+import { contractClient, publicClient, walletClient } from '../../ton-clients.ts';
+import { AppSection } from '../section';
+import { useUserStore } from '../../stores/user-store.ts';
+
+export interface CreateJettonProps {}
+
+export const CreateJetton: FC<CreateJettonProps> = () => {
+  const changeSection = useUserStore((state) => state.changeSection);
+  const userAddress = useUserStore((state) => state.address);
+
+  const [name, setName] = useState('');
+  const [symbol, setSymbol] = useState('');
+  const [description, setDescription] = useState('');
+
+  const [error, setError] = useState<string | undefined>();
+  const [loading, setLoading] = useState(false);
+
+  const onConnect = () => {
+    walletClient.connect();
+  };
+
+  const onSubmit: FormEventHandler<HTMLFormElement> = async (event) => {
+    event.preventDefault();
+
+    setError(undefined);
+    if (!name || !symbol || !description) {
+      setError('Please, fill in all fields');
+      return;
+    }
+
+    const data = getJettonDeployArguments({
+      owner: userAddress!,
+      maxSupply: 21000000n,
+      content: {
+        name: 'Foton',
+        symbol: 'FTN',
+        description: 'Foton token',
+      },
+    });
+
+    setLoading(true);
+    const res = await contractClient.deploy({
+      value: parseTon('0.05'),
+      arguments: data,
+      payload: undefined,
+    });
+
+    if (res.data) {
+      await publicClient.waitForTransaction({ hash: res.data.txHash });
+      changeSection('minters');
+    } else {
+      setError(res.error.message);
+    }
+    setLoading(false);
+  };
+
+  return (
+    <AppSection title="Create new jetton">
+      <form onSubmit={onSubmit} className={styles.form}>
+        <fieldset className={styles.field}>
+          <label htmlFor="jetton-name">Project name</label>
+          <input
+            value={name} id="jetton-name"
+            name="jetton-name"
+            type="text"
+            placeholder="Bitcoin"
+            onInput={(event) => setName(event.currentTarget.value)}
+          />
+        </fieldset>
+
+        <fieldset className={styles.field}>
+          <label htmlFor="jetton-symbol">Jetton symbol</label>
+          <input
+            value={symbol}
+            id="jetton-symbol"
+            name="jetton-symbol"
+            type="text"
+            placeholder="BTC"
+            onInput={(event) => setSymbol(event.currentTarget.value)}
+          />
+        </fieldset>
+
+        <fieldset className={styles.field}>
+          <label htmlFor="jetton-description">Description</label>
+          <input
+            value={description}
+            id="jetton-description"
+            name="jetton-description"
+            type="text"
+            onInput={(event) => setDescription(event.currentTarget.value)}
+          />
+        </fieldset>
+
+        {error && <p className={styles.error}>{error}</p>}
+
+        {userAddress ? (
+          <button type="submit" disabled={loading}>
+            {loading ? 'Loading...' : 'Create and deploy'}
+          </button>
+        ) : (
+          <button type="button" onClick={onConnect}>Connect wallet</button>
+        )}
+      </form>
+    </AppSection>
+  );
+};
diff --git a/apps/jetton/src/components/create-jetton/styles.module.css b/apps/jetton/src/components/create-jetton/styles.module.css
@@ -0,0 +1,37 @@
+.form {
+  display: flex;
+  flex-direction: column;
+  margin: 0;
+  gap: 16px;
+  padding-bottom: 32px;
+}
+
+.field {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  border: none;
+  padding: 0;
+  margin: 0;
+}
+
+.field input {
+  width: 100%;
+  padding: 16px;
+  border: none;
+  border-radius: 8px;
+  font-size: 16px;
+}
+
+.form > button {
+  padding: 16px;
+  border-radius: 8px;
+  font-size: 16px;
+  font-weight: bold;
+  cursor: pointer;
+}
+
+.error {
+  text-align: center;
+  color: #fa3636;
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		# Foton Jetton

		An application showcasing how Foton can help with Jetton manipulations