[PLA-2008] api 2.0

.github/workflows/deploy.yml

@@ -12,18 +12,23 @@ jobs:
         runs-on: ubuntu-latest
         steps:
             - uses: actions/checkout@v2
+
             - name: Setup Node.js
               uses: actions/setup-node@v2
               with:
                   node-version: '18'
                   cache: 'npm'
+
             - name: Install dependencies
               run: npm install
+
             - name: Copy config.json
               run: |
                 cp ./resources/js/config.json.example ./resources/js/config.json
+
             - name: Build static project
               run: npm run prod-laravel
+
             - name: Archive build artifacts
               uses: actions/upload-artifact@v4
               with:

.github/workflows/lint.yml

@@ -0,0 +1,30 @@
+name: eslint
+on:
+    push:
+        branches:
+            - master
+    pull_request:
+
+jobs:
+    tests:
+        name: Eslint & Prettier
+        runs-on: ubuntu-latest
+
+        steps:
+            - name: Checkout code
+              uses: actions/checkout@v4
+
+            - name: Setup Node.js
+              uses: actions/setup-node@v2
+              with:
+                  node-version: '20'
+                  cache: 'npm'
+
+            - name: Install dependencies
+              run: npm install
+
+            - name: Run Pretty
+              run: npm run pretty:check
+
+            - name: Run Eslint
+              run: npm run lint

resources/js/api/collection.ts

@@ -15,11 +15,12 @@ export class CollectionApi {
         return ApiService.sendPlatformRequest(data);
     }
 
-    static async getCollectionsIds(first: number = 20) {
+    static async getCollectionsIds(first: number = 20, after?: string) {
         const data = {
             query: queries.GetCollectionIds,
             variables: {
                 first,
+                after,
             },
         };
 

resources/js/api/index.ts

@@ -27,6 +27,7 @@ export class ApiService {
         credentials = 'omit',
         mode,
         nest = true,
+        auth = true,
     }: {
         url: string;
         data?: Record<string, unknown>;
@@ -35,6 +36,7 @@ export class ApiService {
         credentials?: 'omit' | 'same-origin' | 'include';
         mode?: 'cors' | 'no-cors' | 'same-origin' | 'navigate';
         nest?: boolean;
+        auth?: boolean;
     }): Promise<any> {
         let body: string | null = null;
         const fullUrl = url;
@@ -44,10 +46,10 @@ export class ApiService {
             body = JSON.stringify(data);
         }
 
-        if (mode) {
+        if (auth) {
             if (!useAppStore().isMultiTenant) {
                 headers.Authorization = useAppStore().authorization_token;
-            } else if (mode) {
+            } else {
                 headers['X-CSRF-TOKEN'] = csrf;
             }
         }
@@ -160,6 +162,7 @@ export class ApiService {
             method: HttpMethods.GET,
             credentials: undefined,
             mode: undefined,
+            auth: false,
         });
     }
 

resources/js/components/FormInput.vue

@@ -71,6 +71,7 @@ const props = withDefaults(
         type?: string;
         min?: number;
         modelValue?: number | string | null;
+        value?: number | string | null;
         disabled?: boolean;
         prefix?: string;
         name: string;
@@ -109,10 +110,10 @@ const inputChange = (e: Event) => {
 
 const localModelValue = computed({
     get() {
-        return props.modelValue;
+        return props.modelValue ?? props.value;
     },
     set(value) {
-        if (localModelValue.value !== value) {
+        if (value && localModelValue.value !== value) {
             emit('update:modelValue', value);
         }
     },

resources/js/components/WalletConnectButton.vue

@@ -112,10 +112,11 @@ const connectWallet = async (provider: string) => {
         });
         await connectionStore.getAccounts();
         const localAccounts = connectionStore.accounts.map((account) => publicKeyToAddress(account.address));
-        const walletAccounts = useAppStore().user?.walletAccounts?.map((account) => publicKeyToAddress(account));
+        const walletAccounts = useAppStore().user?.walletAccounts?.map((account) => publicKeyToAddress(account)) ?? [];
         const uniqueAccounts = [...new Set([...walletAccounts, ...localAccounts])];
-
-        AuthApi.setUserAccounts(uniqueAccounts);
+        if (useAppStore().isMultiTenant) {
+            AuthApi.setUserAccounts(uniqueAccounts);
+        }
     } catch {
         snackbar.error({ title: 'Failed to connect the wallet' });
     } finally {

resources/js/components/pages/Collections.vue

@@ -371,7 +371,7 @@ const fetchUri = async (uri) => {
         }
 
         return '-';
-    } catch (e) {
+    } catch {
         return '-';
     }
 };

resources/js/components/pages/Tokens.vue

@@ -98,7 +98,7 @@
                                 "
                             >
                                 <td
-                                    class="whitespace-nowrap px-3 py-4 text-sm text-light-content dark:text-dark-content"
+                                    class="whitespace-nowrap px-3 py-4 text-sm font-medium text-light-content-strong dark:text-dark-content-strong"
                                 >
                                     {{ tokenNames[`${token.collection.collectionId}-${token.tokenId}`] }}
                                 </td>

resources/js/components/pages/create/CreateCollection.vue

@@ -114,11 +114,10 @@
                             description="With this option selected tokens in this collection will have an infinite supply."
                         />
                         <FormCheckbox
-                            v-model="forceSingleMint"
-                            name="forceSingleMint"
-                            label="Force Single Mint"
-                            description="Set whether the tokens in this collection will be minted as SingleMint
-                                            types. This would indicate the tokens in this collection are NFTs."
+                            v-model="forceCollapsingSupply"
+                            name="forceCollapsingSupply"
+                            label="Force Collapsing Supply"
+                            description="Set whether the tokens in this collection will be minted as SingleMint types. This would indicate the tokens in this collection are NFTs."
                         />
                     </div>
                 </div>
@@ -377,7 +376,7 @@ const maxTokenCount = ref();
 const maxTokenSupply = ref();
 const isInfiniteSupply = ref(true);
 const isInfiniteCount = ref(true);
-const forceSingleMint = ref(false);
+const forceCollapsingSupply = ref(false);
 const beneficiaryAddress = ref('');
 const beneficiaryPercentage = ref(0);
 const idempotencyKey = ref('');
@@ -413,7 +412,7 @@ const validation = yup.object({
     bannerUrl: stringNotRequiredSchema,
     maxTokenCount: numberNotRequiredSchema.typeError('Max token count must be a number'),
     maxTokenSupply: numberNotRequiredSchema.typeError('Max token supply must be a number'),
-    forceSingleMint: booleanNotRequiredSchema,
+    forceCollapsingSupply: booleanNotRequiredSchema,
     beneficiaryAddress: addressNotRequiredSchema,
     beneficiaryPercentage: yup.number().when('beneficiaryAddress', {
         is: (val) => val !== '' && val !== null,
@@ -503,7 +502,7 @@ const createCollection = async () => {
                 mintPolicy: {
                     maxTokenCount: isInfiniteCount.value ? null : maxTokenCount.value,
                     maxTokenSupply: isInfiniteSupply.value ? null : maxTokenSupply.value,
-                    forceSingleMint: forceSingleMint.value,
+                    forceCollapsingSupply: forceCollapsingSupply.value,
                 },
                 marketPolicy: beneficiaryAddress.value
                     ? {

resources/js/components/pages/create/CreateToken.vue

@@ -81,6 +81,13 @@
                             label="Description"
                             description="The description of the token."
                         />
+                        <FormInput
+                            v-model="symbol"
+                            name="symbol"
+                            label="Symbol"
+                            description="The symbol of the token."
+                            required
+                        />
                         <FormInput
                             v-model="recipient"
                             name="recipient"
@@ -268,6 +275,46 @@
                         </div>
                         <div class="mt-6">
                             <div class="flex flex-col gap-6">
+                                <FormCheckbox
+                                    v-model="infuseEnj"
+                                    name="infuseEnj"
+                                    label="Infuse ENJ"
+                                    description="Use this option to infuse ENJ into the token."
+                                    readmore="https://support.nft.io/hc/en-gb/articles/20436178520594"
+                                />
+                                <div v-if="infuseEnj" class="space-y-4">
+                                    <FormInput
+                                        v-model="infuseAmount"
+                                        name="infuseAmount"
+                                        label="ENJ Infusion"
+                                        description="Enter the amount of ENJ you wish to infuse in each unit."
+                                        type="number"
+                                        required
+                                    />
+                                    <FormSelect
+                                        v-model="infuseAccess"
+                                        name="infuseAccess"
+                                        label="Infusion Access"
+                                        description=""
+                                        :options="['Only Me', 'Everyone']"
+                                    />
+                                    <template v-if="tokenType === 'ft'">
+                                        <FormInput
+                                            v-model="initialSupply"
+                                            name="itemsInfuse"
+                                            label="Number of items"
+                                            type="number"
+                                            disabled
+                                        />
+                                        <FormInput
+                                            :value="totalInfuseAmountComputed"
+                                            name="totalInfuseAmount"
+                                            label="Total Infuse Amount"
+                                            type="number"
+                                            disabled
+                                        />
+                                    </template>
+                                </div>
                                 <FormCheckbox
                                     v-model="listingForbidden"
                                     name="listingForbidden"
@@ -369,7 +416,11 @@ const tokenId = ref({
 });
 const initialSupply = ref(1);
 const capAmount = ref();
+const infuseAmount = ref();
 const isCurrency = ref(false);
+const infuseEnj = ref(false);
+const symbol = ref('');
+const infuseAccess = ref('Only Me');
 const beneficiaryAddress = ref('');
 const beneficiaryPercentage = ref(0);
 const listingForbidden = ref(false);
@@ -392,14 +443,23 @@ const capTypes =
 const collectionIds = computed(() => appStore.collections);
 const isAdvanced = computed(() => mode.value === 'advanced');
 
+const totalInfuseAmountComputed = computed(() => {
+    return initialSupply.value * infuseAmount.value;
+});
+
 const validation = yup.object({
     imageUrl: stringNotRequiredSchema,
     name: stringRequiredSchema,
     description: stringNotRequiredSchema,
+    symbol: stringRequiredSchema,
     collectionId: collectionIdRequiredSchema,
     tokenId: stringRequiredSchema,
     recipient: addressRequiredSchema,
-    initialSupply: numberRequiredSchema.typeError('Initial Supply must be a number').min(1),
+    initialSupply: yup.number().when({
+        is: () => tokenType.value === 'ft',
+        then: () => numberRequiredSchema.typeError('Initial Supply must be a number').min(1),
+        otherwise: () => numberNotRequiredSchema,
+    }),
     capAmount: numberNotRequiredSchema,
     beneficiaryAddress: addressNotRequiredSchema,
     beneficiaryPercentage: yup.number().when('beneficiaryAddress', {
@@ -487,10 +547,20 @@ const createToken = async () => {
                         isCurrency: isCurrency.value,
                     },
                     listingForbidden: listingForbidden.value,
+                    ...(infuseEnj.value
+                        ? {
+                              infusion: totalInfuseAmountComputed.value,
+                              anyoneCanInfuse: infuseAccess.value === 'Everyone',
+                          }
+                        : {}),
                     attributes: [
                         ...simpleAttributes(),
                         ...attributes.value.filter((a) => a.key !== '' && a.value !== ''),
                     ],
+                    metadata: {
+                        name: name.value,
+                        symbol: symbol.value,
+                    },
                 },
                 idempotencyKey: idempotencyKey.value,
                 skipValidation: skipValidation.value,

resources/js/components/slideovers/common/TransferBalanceSlideover.vue

@@ -46,13 +46,6 @@
                             tooltip="In mathematical and computer science terms, idempotency is a property of certain operations that can be applied repeated times without changing the initial result of the application."
                             readmore="Idempotency Key"
                         />
-                        <FormCheckbox
-                            v-if="useAppStore().advanced"
-                            v-model="keepAlive"
-                            name="keepAlive"
-                            label="Keep Alive"
-                            description="If true, the transaction will fail if the balance drops below the minimum requirement. Defaults to False."
-                        />
                         <FormCheckbox
                             v-if="useAppStore().advanced"
                             v-model="skipValidation"
@@ -97,7 +90,6 @@ const recipient = ref('');
 const amount = ref('');
 const signingAccount = ref('');
 const idempotencyKey = ref('');
-const keepAlive = ref(false);
 const skipValidation = ref(false);
 const formRef = ref();
 
@@ -132,7 +124,6 @@ const transfer = async () => {
                 recipient: recipient.value,
                 amount: formatPriceToENJ(amount.value) ?? null,
                 signingAccount: signingAccount.value,
-                keepAlive: keepAlive.value,
                 idempotencyKey: idempotencyKey.value,
                 skipValidation: skipValidation.value,
             })