[TAS-367] ✨ Add subscription mint settings

components/NFTMint/WriterMessage.vue

@@ -156,7 +156,35 @@
             {{ $t('NFTPortal.label.collectExpiryDate.input') }}
           </label>
           <input v-if=shouldShowCollectExpiryDateInput ref="collectExpiryDateInput" type="date" :min="tomorrow" @change="updateCollectExpiryDate($event)" />
-        </div>  
+        </div>
+      </div>
+      <div
+        class="flex flex-col justify-start gap-[32px] p-[20px] pb-[24px] border-2 border-[#E6F4F2] rounded-[16px] w-full"
+      >
+        <Label
+          class="w-min text-like-green"
+          :text="$t('NFTPortal.label.message.subscription')"
+          tag="div"
+          preset="p6"
+          valign="middle"
+          align="left"
+          content-class="whitespace-nowrap"
+        >
+        </Label>
+        <div class="flex justify-between gap-[12px] text-dark-gray text-[14px] items-center">
+          <CheckBox :value="isFreeForSubscribers" @input="(v) => $emit('update:isFreeForSubscribers', v)">
+            <Label>
+              {{ $t('NFTPortal.label.subscription.isFreeForSubscribers') }}
+            </Label>
+          </CheckBox>
+        </div>
+        <div class="flex justify-between gap-[12px] text-dark-gray text-[14px] items-center">
+          <CheckBox :value="sendToSubscribers" @input="(v) => $emit('update:sendToSubscribers', v)">
+            <Label>
+              {{ $t('NFTPortal.label.subscription.sendToSubscribers') }}
+            </Label>
+          </CheckBox>
+        </div>
       </div>
     </template>
   </div>
@@ -179,6 +207,8 @@ export default class WriterMessage extends Vue {
   @Prop(Number) readonly mintAmount!: number
   @Prop(Number) readonly maxMintAmount!: number
   @Prop(String) readonly collectExpiryDate!: string
+  @Prop(Boolean) readonly isFreeForSubscribers!: boolean
+  @Prop(Boolean) readonly sendToSubscribers!: boolean
 
   userInfo: any = undefined
   avatar: string = ''

locales/en.json

@@ -280,12 +280,15 @@
   "NFTPortal.label.message.preview": "Creator Message Preview",
   "NFTPortal.label.message.reserve": "Reserve Writing NFTs",
   "NFTPortal.label.message.dialog": "Message To Your Collector",
+  "NFTPortal.label.message.subscription": "Subscription Settings",
   "NFTPortal.label.message": "Creator Message",
   "NFTPortal.label.encountered.issue":"Encountered an issue?",
   "NFTPortal.label.report":"Let us know!",
   "NFTPortal.label.modelViewer": "NFT Model",
   "NFTPortal.label.owning": "You have owned {count} already",
   "NFTPortal.label.preview": "Writing NFT Preview",
+  "NFTPortal.label.subscription.isFreeForSubscribers": "Allow subscribers to collect for free",
+  "NFTPortal.label.subscription.sendToSubscribers": "Transfer to subscribers automatically on mint",
   "NFTPortal.label.iframe": "Embed NFT widget into your site",
   "NFTPortal.label.register":"Content URL or ISCN ID",
   "NFTPortal.label.reserve.input": "Number of NFTs reserved for giveaways",

pages/nft/iscn/_iscnId.vue

@@ -36,7 +36,8 @@
         :max-mint-amount="maxMintAmount"
         :reserve-amount.sync="reserveNft"
         :collect-expiry-date.sync="collectExpiryDate"
-        @message-change="(value) => (message = value)"
+        :is-free-for-subscribers.sync="isFreeForSubscribers"
+        :send-to-subscribers.sync="sendToSubscribers"
         @update-mint-amount.once="handleInputMintAmount"
         @update-reserve.once="handleInputReserveNft"
         @update-initial-batch="handleInputInitialBatch"
@@ -268,6 +269,8 @@
   shouldShowNoUrlWarning: boolean = false
 
   collectExpiryDate: string = ''
+  isFreeForSubscribers: boolean = true
+  sendToSubscribers: boolean = true
 
   get isUserISCNOwner(): boolean {
     if (!this.iscnOwner) return false
@@ -727,7 +730,7 @@
           this.isCustomOgimage = true;
           logTrackerEvent(this, 'IscnMintNFT', 'GetOgImageExists', arweaveID, 1);
         } catch (err) {
           console.error(err)
         }
       }
       if (!this.ogImageBlob && !this.ogImageArweaveId) {
@@ -861,6 +864,8 @@
           reservedNftCount: this.reserveNft,
           isFree: this.isFree,
           collectExpiryAt: this.collectExpiryAt,
+          isFreeForSubscribers: this.isFreeForSubscribers,
+          sendToSubscribers: this.sendToSubscribers,
         },
         {
           params: {