Merge pull request #340 from kodadot/283-warning

283 issue warning for buy

Author: yangwao

dashboard/src/components/rmrk/Gallery/AvailableActions.vue

@@ -7,18 +7,11 @@
         {{ action }}
       </b-button>
     </div>
-    <!-- <b-field v-if="accountId" label="Action">
-      <b-select
-        placeholder="Select available action"
-        :value="selectedAction"
-        @input="handleSelect"
-      >
-        <option value="">None</option>
-        <option v-for="action in actions" :value="action" :key="action">
-          {{ action }}
-        </option>
-      </b-select>
-    </b-field> -->
+    <b-message v-if="buyAvailable" title="RMRK::ALERT" type="is-warning" has-icon aria-close-label="Close message">
+      We would like to warn buyers they are solely operating on their own will and carry any involving risks as we are experimental implementation of RMRK-spec.
+      You should double-check on "official UI" (if there are any available already) whenever the current owner showing in KodaDot UI is identical through other UI available from RMRK-team.
+      If there are any doubts, reach us to proceed. We are working to migrate the current KodaDot UI to a more secure and robust solution.
+    </b-message>
     <component class="mb-4" v-if="showMeta" :is="showMeta" @input="updateMeta" />
     <b-button
       v-if="showSubmit"
@@ -86,6 +79,10 @@ export default class AvailableActions extends Mixins(RmrkVersionMixin) {
       : [];
   }
 
+  get buyAvailable() {
+    return this.actions.some(e => e === 'BUY')
+  }
+
   get showSubmit() {
     return this.selectedAction && (!this.showMeta || this.metaValid);
   }

dashboard/src/icons.ts

@@ -25,7 +25,7 @@ import {
   faQuestion, faPrint,
   faMagic, faEye, faCommentAlt,
   faGhost, faCode, faLeaf,
-  faFlask, faCameraRetro, faTag, faShareAlt
+  faFlask, faCameraRetro, faTag, faShareAlt, faExclamationTriangle
 } from '@fortawesome/free-solid-svg-icons';
 
 // throws error, idk why
@@ -75,7 +75,7 @@ library.add(
   faCommentDots, faGhost, faCode,
   faWpexplorer,
   faRedditAlien, faCameraRetro,
-  faTag, faShareAlt
+  faTag, faShareAlt, faExclamationTriangle
   );
 
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';