Syndote: add sails

frontend/apps/syndote/README.md

@@ -24,8 +24,6 @@ yarn install
 
 Create `.env` file, `.env.example` will let you know what variables are expected.
 
-Put the latest version of the `syndote.meta.wasm` file locally in `gear-js\apps\syndote\src\assets\wasm\`, replace if necessary.
-
 In order for all features to work as expected, the node and it's runtime version should be chosen based on the current `@gear-js/api` version.
 
 In case of issues with the application, try to switch to another network or run your own local node and specify its address in the `.env` file. When applicable, make sure the smart contract(s) wasm files are uploaded and running in this network accordingly.

frontend/apps/syndote/src/app/hooks/index.ts

@@ -0,0 +1,3 @@
+export { usePending } from './use-pending';
+export * from './use-execute-with-pendig';
+export * from './use-sign-and-send';

frontend/apps/syndote/src/app/hooks/use-execute-with-pendig.ts

@@ -0,0 +1,35 @@
+import { useAlert } from '@gear-js/react-hooks';
+import { usePending } from './use-pending';
+import { getPanicType } from 'utils';
+
+export type Options = {
+  onSuccess?: () => void;
+  onError?: (error?: unknown) => void;
+};
+
+export function useExecuteWithPending() {
+  const { setPending } = usePending();
+  const alert = useAlert();
+
+  const executeWithPending = async (action: () => Promise<void>, options?: Options) => {
+    try {
+      setPending(true);
+      await action();
+      options?.onSuccess?.();
+    } catch (error) {
+      console.error(error);
+      options?.onError?.(error);
+
+      const panicType = getPanicType(error);
+      const alertError = typeof error === 'string' ? error : panicType;
+
+      if (alertError) {
+        alert.error(alertError);
+      }
+    } finally {
+      setPending(false);
+    }
+  };
+
+  return { executeWithPending };
+}

frontend/apps/syndote/src/app/hooks/use-pending.ts

@@ -0,0 +1,8 @@
+import { IS_LOADING } from 'atoms';
+import { useAtom } from 'jotai';
+
+export function usePending() {
+  const [pending, setPending] = useAtom(IS_LOADING);
+
+  return { pending, setPending };
+}

frontend/apps/syndote/src/app/hooks/use-sign-and-send.ts

@@ -0,0 +1,28 @@
+import { useCheckBalance } from '@dapps-frontend/hooks';
+import { GenericTransactionReturn, TransactionReturn } from '@gear-js/react-hooks/dist/esm/hooks/sails/types';
+
+export const useSignAndSend = () => {
+  const { checkBalance } = useCheckBalance();
+
+  const signAndSend = async (transaction: TransactionReturn<() => GenericTransactionReturn<null>>) => {
+    const calculatedGas = Number(transaction.extrinsic.args[2].toString());
+
+    return new Promise<void>((resolve, reject) => {
+      checkBalance(
+        calculatedGas,
+        async () => {
+          try {
+            const { response } = await transaction.signAndSend();
+            await response();
+            resolve();
+          } catch (e) {
+            reject(e);
+          }
+        },
+        () => reject(),
+      );
+    });
+  };
+
+  return { signAndSend };
+};

frontend/apps/syndote/src/app/utils/index.ts

@@ -0,0 +1 @@
+export * from './sails';

frontend/apps/syndote/src/app/utils/sails/events/index.ts

@@ -0,0 +1,2 @@
+export { useEventStepSubscription } from './use-event-step-subscription';
+export { useEventGameCanceledSubscription } from './use-event-game-canceled-subscription';

frontend/apps/syndote/src/app/utils/sails/events/use-event-game-canceled-subscription.ts

@@ -0,0 +1,20 @@
+import { useProgramEvent } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+
+export function useEventGameCanceledSubscription(onData: () => void) {
+  const program = useProgram();
+
+  useProgramEvent({
+    program,
+    serviceName: 'syndote',
+    functionName: 'subscribeToGameWasCancelledEvent',
+    onData,
+  });
+
+  useProgramEvent({
+    program,
+    serviceName: 'syndote',
+    functionName: 'subscribeToGameDeletedEvent',
+    onData,
+  });
+}

frontend/apps/syndote/src/app/utils/sails/events/use-event-step-subscription.ts

@@ -0,0 +1,14 @@
+import { useProgramEvent } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Step } from 'types';
+
+export function useEventStepSubscription(onData: (data: Step) => void) {
+  const program = useProgram();
+
+  useProgramEvent({
+    program,
+    serviceName: 'syndote',
+    functionName: 'subscribeToStepEvent',
+    onData,
+  });
+}

frontend/apps/syndote/src/app/utils/sails/index.ts

@@ -0,0 +1,5 @@
+export * from './sails';
+export * from './syndote';
+export * from './events';
+export * from './queries';
+export * from './messages';

frontend/apps/syndote/src/app/utils/sails/messages/index.ts

@@ -0,0 +1,8 @@
+export { useAddGasToPlayerStrategyMessage } from './use-add-gas-to-player-strategy-message';
+export { useCancelGameSessionMessage } from './use-cancel-game-session-message';
+export { useCreateGameSessionMessage } from './use-create-game-session-message';
+export { useDeleteGameMessage } from './use-delete-game-message';
+export { useDeletePlayerMessage } from './use-delete-player-message';
+export { useExitGameMessage } from './use-exit-game-message';
+export { usePlayMessage } from './use-play-message';
+export { useRegisterMessage } from './use-register-message';

frontend/apps/syndote/src/app/utils/sails/messages/use-add-gas-to-player-strategy-message.ts

@@ -0,0 +1,30 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  adminId: HexString;
+};
+
+export const useAddGasToPlayerStrategyMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'addGasToPlayerStrategy',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const addGasToPlayerStrategyMessage = async ({ adminId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [adminId],
+        gasLimit: { increaseGas: 10 },
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { addGasToPlayerStrategyMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-cancel-game-session-message.ts

@@ -0,0 +1,30 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  adminId: HexString;
+};
+
+export const useCancelGameSessionMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'cancelGameSession',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const cancelGameSessionMessage = async ({ adminId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [adminId],
+        gasLimit: { increaseGas: 10 },
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { cancelGameSessionMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-create-game-session-message.ts

@@ -0,0 +1,34 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  value?: bigint;
+  entryFee: number | string | bigint | null;
+  name: string;
+  strategyId: HexString;
+};
+
+export const useCreateGameSessionMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'createGameSession',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const createGameSessionMessage = async ({ value, entryFee, name, strategyId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [entryFee, name, strategyId],
+        gasLimit: { increaseGas: 10 },
+        value,
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { createGameSessionMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-delete-game-message.ts

@@ -0,0 +1,30 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  adminId: HexString;
+};
+
+export const useDeleteGameMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'deleteGame',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const deleteGameMessage = ({ adminId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [adminId],
+        gasLimit: { increaseGas: 10 },
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { deleteGameMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-delete-player-message.ts

@@ -0,0 +1,30 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  playerId: HexString;
+};
+
+export const useDeletePlayerMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'deletePlayer',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const deletePlayerMessage = ({ playerId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [playerId],
+        gasLimit: { increaseGas: 10 },
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { deletePlayerMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-exit-game-message.ts

@@ -0,0 +1,30 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  adminId: HexString;
+};
+
+export const useExitGameMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'exitGame',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const exitGameMessage = ({ adminId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [adminId],
+        gasLimit: { increaseGas: 10 },
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { exitGameMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-play-message.ts

@@ -0,0 +1,30 @@
+import { HexString } from '@gear-js/api';
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+
+type Params = {
+  adminId: HexString;
+};
+
+export const usePlayMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'play',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const playMessage = async ({ adminId }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [adminId],
+        gasLimit: BigInt(730000000000),
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { playMessage };
+};

frontend/apps/syndote/src/app/utils/sails/messages/use-register-message.ts

@@ -0,0 +1,34 @@
+import { usePrepareProgramTransaction } from '@gear-js/react-hooks';
+import { useProgram } from 'app/utils';
+import { Options, useExecuteWithPending, useSignAndSend } from 'app/hooks';
+import { HexString } from '@gear-js/api';
+
+type Params = {
+  value?: bigint;
+  adminId: HexString;
+  strategyId: HexString;
+  name: string;
+};
+
+export const useRegisterMessage = () => {
+  const program = useProgram();
+  const { prepareTransactionAsync } = usePrepareProgramTransaction({
+    program,
+    serviceName: 'syndote',
+    functionName: 'register',
+  });
+  const { signAndSend } = useSignAndSend();
+  const { executeWithPending } = useExecuteWithPending();
+
+  const registerMessage = async ({ value, adminId, strategyId, name }: Params, options?: Options) =>
+    executeWithPending(async () => {
+      const { transaction } = await prepareTransactionAsync({
+        args: [adminId, strategyId, name],
+        gasLimit: { increaseGas: 10 },
+        value,
+      });
+      await signAndSend(transaction);
+    }, options);
+
+  return { registerMessage };
+};