diff --git a/.eslintrc.json b/.eslintrc.json
new file mode 100644
index 0000000..12c8c41
--- /dev/null
+++ b/.eslintrc.json
@@ -0,0 +1,38 @@
+{
+ "parser": "@typescript-eslint/parser",
+ "parserOptions": {
+ "ecmaVersion": 2021
+ },
+ "extends": [
+ "plugin:v3xlabs/recommended",
+ "plugin:react/recommended",
+ "plugin:jsx-a11y/recommended"
+ ],
+ "ignorePatterns": ["!**/*"],
+ "plugins": ["v3xlabs", "react", "node", "jsx-a11y"],
+ "env": {
+ "node": true,
+ "browser": true
+ },
+ "settings": {
+ "react": {
+ "version": "detect"
+ }
+ },
+ "globals": {
+ "JSX": "readonly"
+ },
+ "rules": {
+ "react/no-unescaped-entities": "off",
+ "react/react-in-jsx-scope": "off",
+ "node/no-process-env": "error",
+ "unicorn/no-nested-ternary": "off",
+ "unused-imports/no-unused-vars": "off",
+ "prettier/prettier": [
+ "error",
+ {
+ "singleQuote": true
+ }
+ ]
+ }
+}
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..97313f1
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,5 @@
+{
+ "tabWidth": 4,
+ "useTabs": false,
+ "singleQuote": true
+}
diff --git a/components/ConnectButton.tsx b/components/ConnectButton.tsx
new file mode 100644
index 0000000..1e277cd
--- /dev/null
+++ b/components/ConnectButton.tsx
@@ -0,0 +1,33 @@
+import { useModal } from 'connectkit';
+import { useAccount, useDisconnect } from 'wagmi';
+
+export const ConnectButton = () => {
+ const { setOpen } = useModal();
+ const { address } = useAccount();
+ const { disconnect } = useDisconnect();
+
+ if (address)
+ return (
+
+
+
+ );
+
+ return (
+
+ );
+};
diff --git a/components/MaxSupply.tsx b/components/MaxSupply.tsx
new file mode 100644
index 0000000..7a34eea
--- /dev/null
+++ b/components/MaxSupply.tsx
@@ -0,0 +1,26 @@
+import { useContractRead } from 'wagmi';
+
+import { pointsABI } from '../util/abi';
+
+export const MaxSupply = () => {
+ const { data, isLoading } = useContractRead({
+ address: '0xd7C1EB0fe4A30d3B2a846C04aa6300888f087A5F',
+ chainId: 1,
+ abi: pointsABI,
+ functionName: 'MAX_SUPPLY',
+ });
+
+ const x = data as unknown as bigint;
+
+ return (
+
+
Max Supply
+
+ {isLoading && 'Loading...'}
+ {data && (
+ {(data / BigInt(10 ** 18)).toLocaleString()}
+ )}
+
+
+ );
+};
diff --git a/components/YourBalance.tsx b/components/YourBalance.tsx
new file mode 100644
index 0000000..9000fec
--- /dev/null
+++ b/components/YourBalance.tsx
@@ -0,0 +1,45 @@
+import { useAccount, useContractReads } from 'wagmi';
+
+import { pointsABI } from '../util/abi';
+
+export const YourBalance = () => {
+ const { address } = useAccount();
+ const { data, isLoading, isSuccess } = useContractReads({
+ enabled: !!address,
+ contracts: [
+ {
+ address: '0xd7C1EB0fe4A30d3B2a846C04aa6300888f087A5F',
+ chainId: 1,
+ abi: pointsABI,
+ args: [address],
+ functionName: 'balanceOf',
+ },
+ {
+ address: '0xd7C1EB0fe4A30d3B2a846C04aa6300888f087A5F',
+ chainId: 1,
+ abi: pointsABI,
+ functionName: 'decimals',
+ },
+ ],
+ });
+
+ const balance: bigint = data?.[0]?.result as unknown as bigint;
+ const decimals: number = data?.[1]?.result as unknown as number;
+
+ console.log({ balance, decimals });
+ const nb = address && isSuccess ? balance / BigInt(10 ** decimals) : 0;
+
+ return (
+
+
Your balance
+
+ {isLoading && 'Loading...'}
+ {address ? (
+ {nb.toLocaleString()} $points
+ ) : (
+ 👇
+ )}
+
+
+ );
+};
diff --git a/index.html b/index.html
index 55b4314..e85244f 100644
--- a/index.html
+++ b/index.html
@@ -4,9 +4,11 @@
$points cool
+
points are cool
+