chore(idea/frontend, hooks): bump api and sails (#1644)

idea/common/package.json

@@ -9,7 +9,7 @@
   },
   "dependencies": {
     "@gear-js/api": "0.38.1",
-    "@polkadot/api": "11.0.2",
+    "@polkadot/api": "13.2.1",
     "winston": "3.7.2"
   },
   "license": "ISC",

idea/faucet/package.json

@@ -14,7 +14,7 @@
   "dependencies": {
     "@gear-js/api": "0.38.1",
     "@gear-js/common": "workspace:^",
-    "@polkadot/api": "11.0.2",
+    "@polkadot/api": "13.2.1",
     "chalk": "4.1.2",
     "class-transformer": "0.5.1",
     "cron": "^3.1.6",

idea/frontend/package.json

@@ -9,18 +9,18 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@gear-js/api": "0.38.1",
+    "@gear-js/api": "0.38.3",
     "@gear-js/react-hooks": "workspace:^",
     "@gear-js/ui": "workspace:^",
     "@gear-js/wallet-connect": "workspace:^",
     "@hcaptcha/react-hcaptcha": "1.8.1",
     "@hookform/resolvers": "3.3.2",
-    "@polkadot/api": "11.0.2",
+    "@polkadot/api": "13.2.1",
     "@polkadot/react-identicon": "3.6.3",
-    "@polkadot/types": "11.0.2",
+    "@polkadot/types": "13.2.1",
     "@polkadot/util": "12.6.2",
     "@react-aria/utils": "3.21.0",
-    "@tanstack/react-query": "5.29.0",
+    "@tanstack/react-query": "5.56.2",
     "bignumber.js": "9.1.2",
     "clsx": "2.0.0",
     "ky": "1.0.1",
@@ -38,7 +38,8 @@
     "react-number-format": "5.3.1",
     "react-router-dom": "6.16.0",
     "react-transition-group": "4.4.5",
-    "sails-js": "0.1.8",
+    "sails-js": "0.3.0",
+    "sails-js-parser": "0.1.0",
     "simplebar-react": "3.2.4",
     "yup": "1.3.2",
     "zod": "3.22.4"
@@ -63,6 +64,7 @@
     "eslint-plugin-react": "7.33.2",
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-plugin-react-refresh": "0.4.3",
+    "sails-js-types": "0.0.1",
     "sass": "1.69.1",
     "typescript": "5.5.3",
     "vite": "4.4.11",

idea/frontend/src/features/program/hooks/use-program-status.ts

@@ -1,5 +1,5 @@
 import { useApi } from '@gear-js/react-hooks';
-import { HexString, GearCommonProgram } from '@gear-js/api';
+import { HexString, GearCoreProgram } from '@gear-js/api';
 import { Option } from '@polkadot/types';
 
 import { ProgramStatus } from '../consts';
@@ -10,7 +10,7 @@ const useProgramStatus = () => {
   const getProgramStatus = async (id: HexString) => {
     if (!isApiReady) return Promise.reject(new Error('API is not initialized'));
 
-    const option = (await api.query.gearProgram.programStorage(id)) as Option<GearCommonProgram>;
+    const option = (await api.query.gearProgram.programStorage(id)) as Option<GearCoreProgram>;
     const { isTerminated, isExited } = option.unwrap();
 
     if (isTerminated) return ProgramStatus.Terminated;

idea/frontend/src/features/sails/hooks/use-sails-init.ts

@@ -1,10 +1,17 @@
 import { useQuery } from '@tanstack/react-query';
 import { Sails } from 'sails-js';
+import { SailsIdlParser } from 'sails-js-parser';
 
 function useSailsInit() {
   const { data } = useQuery({
     queryKey: ['sails'],
-    queryFn: () => Sails.new(),
+
+    queryFn: async () => {
+      const parser = await SailsIdlParser.new();
+
+      return new Sails(parser);
+    },
+
     refetchOnMount: false,
     refetchOnReconnect: false,
     refetchOnWindowFocus: false,

idea/frontend/src/features/sails/ui/fields/enum-field.tsx

@@ -1,15 +1,16 @@
 import { Select } from '@gear-js/ui';
 import { useState } from 'react';
-import { Sails, TypeDef } from 'sails-js';
+import { Sails } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { useSetPayloadValue } from '../../hooks';
 import { getNestedName, getDefaultValue } from '../../utils';
 
 type Props = {
   sails: Sails;
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
-  renderField: (def: TypeDef, label: string, name: string) => JSX.Element | undefined;
+  renderField: (def: ISailsTypeDef, label: string, name: string) => JSX.Element | undefined;
 };
 
 function EnumField({ sails, def, name, renderField }: Props) {

idea/frontend/src/features/sails/ui/fields/fields.tsx

@@ -1,4 +1,5 @@
-import { Sails, TypeDef } from 'sails-js';
+import { Sails } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Fieldset } from '@/shared/ui';
 
@@ -20,7 +21,7 @@ type Props = {
 };
 
 function Fields({ sails, args }: Props) {
-  const getFieldComponent = (def: TypeDef) => {
+  const getFieldComponent = (def: ISailsTypeDef) => {
     if (def.isEnum) return EnumField;
     if (def.isStruct) return StructField;
     if (def.isOptional) return OptionalField;
@@ -34,7 +35,7 @@ function Fields({ sails, args }: Props) {
     throw new Error('Unknown field type: ' + JSON.stringify(def));
   };
 
-  const renderField = (def: TypeDef, label: string = '', name: string = '') => {
+  const renderField = (def: ISailsTypeDef, label: string = '', name: string = '') => {
     if (!sails) throw new Error('Sails is not defined');
     if (!def) return; // in case of empty enum variant, EnumVariant.def sails-js type is inaccurate at the moment
 

idea/frontend/src/features/sails/ui/fields/fixed-size-array-field.tsx

@@ -1,14 +1,14 @@
-import { TypeDef } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Fieldset } from '@/shared/ui';
 
 import { getLabel, getNestedName } from '../../utils';
 
 type Props = {
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
-  renderField: (def: TypeDef, name: string, label: string) => JSX.Element | undefined;
+  renderField: (def: ISailsTypeDef, name: string, label: string) => JSX.Element | undefined;
 };
 
 function FixedSizeArrayField({ def, name, label, renderField }: Props) {

idea/frontend/src/features/sails/ui/fields/map-field.tsx

@@ -1,11 +1,11 @@
-import { TypeDef } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Textarea } from '@/shared/ui';
 
 import { getLabel } from '../../utils';
 
 type Props = {
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
 };

idea/frontend/src/features/sails/ui/fields/optional-field.tsx

@@ -1,6 +1,7 @@
 import { Select } from '@gear-js/ui';
 import { useState } from 'react';
-import { Sails, TypeDef } from 'sails-js';
+import { Sails } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Fieldset } from '@/shared/ui';
 
@@ -9,10 +10,10 @@ import { getDefaultValue, getLabel } from '../../utils';
 
 type Props = {
   sails: Sails;
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
-  renderField: (def: TypeDef, label: string, name: string) => JSX.Element | undefined;
+  renderField: (def: ISailsTypeDef, label: string, name: string) => JSX.Element | undefined;
 };
 
 const OPTIONS = [

idea/frontend/src/features/sails/ui/fields/primitive-field.tsx

@@ -1,11 +1,11 @@
-import { TypeDef } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Checkbox, Input } from '@/shared/ui';
 
 import { getLabel } from '../../utils';
 
 type Props = {
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
 };

idea/frontend/src/features/sails/ui/fields/result-field.tsx

@@ -1,6 +1,7 @@
 import { Select } from '@gear-js/ui';
 import { useState } from 'react';
-import { Sails, TypeDef } from 'sails-js';
+import { Sails } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Fieldset } from '@/shared/ui';
 
@@ -11,10 +12,10 @@ import { getDefaultValue, getLabel, getNestedName } from '../../utils';
 
 type Props = {
   sails: Sails;
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
-  renderField: (def: TypeDef, label: string, name: string) => JSX.Element | undefined;
+  renderField: (def: ISailsTypeDef, label: string, name: string) => JSX.Element | undefined;
 };
 
 const OPTIONS = [

idea/frontend/src/features/sails/ui/fields/struct-field.tsx

@@ -1,14 +1,14 @@
-import { TypeDef } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Fieldset } from '@/shared/ui';
 
 import { getLabel, getNestedName } from '../../utils';
 
 type Props = {
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
-  renderField: (def: TypeDef, label: string, name: string) => JSX.Element | undefined;
+  renderField: (def: ISailsTypeDef, label: string, name: string) => JSX.Element | undefined;
 };
 
 function StructField({ def, name, label, renderField }: Props) {

idea/frontend/src/features/sails/ui/fields/user-defined-field.tsx

@@ -1,15 +1,16 @@
-import { Sails, TypeDef } from 'sails-js';
+import { Sails } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Fieldset } from '@/shared/ui';
 
 import { getLabel } from '../../utils';
 
 type Props = {
-  def: TypeDef;
+  def: ISailsTypeDef;
   sails: Sails;
   name: string;
   label: string;
-  renderField: (def: TypeDef, label: string, name: string) => JSX.Element | undefined;
+  renderField: (def: ISailsTypeDef, label: string, name: string) => JSX.Element | undefined;
 };
 
 function UserDefinedField({ def, sails, name, label, renderField }: Props) {

idea/frontend/src/features/sails/ui/fields/vec-field.tsx

@@ -1,11 +1,11 @@
-import { TypeDef } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { Textarea } from '@/shared/ui';
 
 import { getLabel } from '../../utils';
 
 type Props = {
-  def: TypeDef;
+  def: ISailsTypeDef;
   name: string;
   label: string;
 };

idea/frontend/src/features/sails/utils/field.ts

@@ -1,8 +1,8 @@
-import { TypeDef } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 
 import { getType } from './type';
 
-const getLabel = (name: string, def: TypeDef) => {
+const getLabel = (name: string, def: ISailsTypeDef) => {
   const type = getType(def);
 
   return name ? `${name} (${type})` : type;

idea/frontend/src/features/sails/utils/payload/get-default-payload-value.ts

@@ -1,39 +1,40 @@
+import { Sails } from 'sails-js';
 import {
-  EnumDef,
-  FixedSizeArrayDef,
-  MapDef,
-  PrimitiveDef,
-  ResultDef,
-  Sails,
-  StructDef,
-  TypeDef,
-  UserDefinedDef,
-  VecDef,
-} from 'sails-js';
+  ISailsEnumDef,
+  ISailsFixedSizeArrayDef,
+  ISailsMapDef,
+  ISailsPrimitiveDef,
+  ISailsResultDef,
+  ISailsStructDef,
+  ISailsTypeDef,
+  ISailsUserDefinedDef,
+  ISailsVecDef,
+} from 'sails-js-types';
 
 import { getPreformattedText } from '@/shared/helpers';
 
 import { RESULT } from '../../consts';
 import { PayloadValue, ISailsFuncArg } from '../../types';
 
 const getDefaultValue = (sails: Sails) => {
-  const getPrimitiveValue = (def: PrimitiveDef) => (def.isBool ? false : '');
-  const getResultValue = ({ [RESULT.OK]: { def } }: ResultDef) => ({ [RESULT.OK]: getValue(def) });
-  const getVecValue = ({ def }: VecDef) => getPreformattedText([getValue(def)]);
-  const getFixedSizeArrayValue = ({ len, def }: FixedSizeArrayDef) => new Array<PayloadValue>(len).fill(getValue(def));
-  const getMapValue = ({ key, value }: MapDef) => getPreformattedText([[getValue(key.def), getValue(value.def)]]);
-  const getUserDefinedValue = ({ name }: UserDefinedDef) => getValue(sails.getTypeDef(name));
-  const getEnumValue = ({ variants: [{ def, name }] }: EnumDef) => ({ [name]: def ? getValue(def) : null });
-
-  const getStructValue = ({ isTuple, fields }: StructDef) => {
+  const getPrimitiveValue = (def: ISailsPrimitiveDef) => (def.isBool ? false : '');
+  const getResultValue = ({ [RESULT.OK]: { def } }: ISailsResultDef) => ({ [RESULT.OK]: getValue(def) });
+  const getVecValue = ({ def }: ISailsVecDef) => getPreformattedText([getValue(def)]);
+  const getFixedSizeArrayValue = ({ len, def }: ISailsFixedSizeArrayDef) =>
+    new Array<PayloadValue>(len).fill(getValue(def));
+  const getMapValue = ({ key, value }: ISailsMapDef) => getPreformattedText([[getValue(key.def), getValue(value.def)]]);
+  const getUserDefinedValue = ({ name }: ISailsUserDefinedDef) => getValue(sails.getTypeDef(name));
+  const getEnumValue = ({ variants: [{ def, name }] }: ISailsEnumDef) => ({ [name]: def ? getValue(def) : null });
+
+  const getStructValue = ({ isTuple, fields }: ISailsStructDef) => {
     if (isTuple) return fields.map(({ def }) => getValue(def));
 
     const result = fields.map(({ name, def }, index) => [name || index, getValue(def)] as const);
 
     return Object.fromEntries(result);
   };
 
-  const getValue = (def: TypeDef): PayloadValue => {
+  const getValue = (def: ISailsTypeDef): PayloadValue => {
     if (def.isPrimitive) return getPrimitiveValue(def.asPrimitive);
     if (def.isOptional) return null;
     if (def.isResult) return getResultValue(def.asResult);

idea/frontend/src/features/sails/utils/payload/get-payload-schema.ts

@@ -1,6 +1,7 @@
 import { HexString } from '@gear-js/api';
 import { AnyJson } from '@polkadot/types/types';
-import { Sails, TypeDef } from 'sails-js';
+import { Sails } from 'sails-js';
+import { ISailsTypeDef } from 'sails-js-types';
 import { z } from 'zod';
 
 import { RESULT } from '../../consts';
@@ -22,7 +23,7 @@ const asTuple = <T extends z.ZodTypeAny>(schema: T[]) => z.tuple(schema as [T, .
 const isUnion = <T>(arr: T[]): arr is [T, T, ...T[]] => arr.length >= 2;
 
 const getPayloadSchema = (sails: Sails, args: ISailsFuncArg[], encode: (..._args: unknown[]) => HexString) => {
-  const getSchema = (def: TypeDef): z.ZodType<unknown> => {
+  const getSchema = (def: ISailsTypeDef): z.ZodType<unknown> => {
     if (def.isPrimitive) return def.asPrimitive.isBool ? z.boolean() : z.string().trim();
 
     if (def.isOptional) return z.union([z.null(), getSchema(def.asOptional.def)]);

idea/frontend/src/features/sails/utils/type.ts

@@ -1,6 +1,6 @@
-import { PrimitiveDef, TypeDef } from 'sails-js';
+import { ISailsPrimitiveDef, ISailsTypeDef } from 'sails-js-types';
 
-const getPrimitiveType = (def: PrimitiveDef) => {
+const getPrimitiveType = (def: ISailsPrimitiveDef) => {
   if (def.isNull) return 'Null';
   if (def.isBool) return 'Bool';
   if (def.isChar) return 'Char';
@@ -31,7 +31,7 @@ const getPrimitiveType = (def: PrimitiveDef) => {
   throw new Error('Unknown primitive type');
 };
 
-const getType = (def: TypeDef): string => {
+const getType = (def: ISailsTypeDef): string => {
   if (def.isPrimitive) return getPrimitiveType(def.asPrimitive);
   if (def.isOptional) return `Option<${getType(def.asOptional.def)}>`;
   if (def.isResult) return `Result<${getType(def.asResult.ok.def)}, ${getType(def.asResult.err.def)}>`;