Merge pull request #458 from kodadot/subsocial

subsocial

Author: yangwao

.gitignore

@@ -78,4 +78,5 @@ typings/
 .yarn-integrity
 
 # dotenv environment variables file
-.env
+.env
+.vscode/

package.json

@@ -27,6 +27,9 @@
     "@polkadot/util": "^6.9.1",
     "@polkadot/util-crypto": "^6.9.1",
     "@polkadot/vue-identicon": "^0.81.1",
+    "@subsocial/api": "^0.5.8",
+    "@subsocial/types": "^0.5.8",
+    "@subsocial/utils": "^0.4.39",
     "@textile/hub": "^6.1.2",
     "@types/file-saver": "^2.0.2",
     "@vue-polkadot/vue-api": "^0.0.34",

src-functions/pinPost.js

@@ -0,0 +1,41 @@
+import axios from "axios"
+
+exports.handler = async (event, context) => {
+
+
+  // const location = event.queryStringParameters.location || "home";
+  const BASE_URL = 'https://staging.subsocial.network/offchain/v1/ipfs/add';
+  const object = event.body;
+
+  try {
+    const { status, data } = await axios.post(BASE_URL, object, {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+    console.log('[SUBSOCIAL] Pin JSON', status, data);
+
+    if (status < 400) {
+      return {
+        statusCode: status,
+        body: data,
+      };
+    }
+
+
+  } catch (e) {
+    console.log('Error', e.message)
+    return {
+      statusCode: 500,
+      body: e.message,
+    };
+  }
+
+  return {
+    statusCode: status,
+    body: "",
+  };
+
+
+};
+

src-functions/requestFaucet.js

@@ -0,0 +1,46 @@
+import axios from "axios"
+
+exports.handler = async (event, context) => {
+
+
+  const address = event.queryStringParameters.address;
+  const email = event.queryStringParameters.email;
+
+  if (!email || !address) {
+    return {
+      statusCode: 403,
+      body: `Cannot search without query`,
+    };
+  }
+
+  const BASE_URL = `https://app.subsocial.network/offchain/v1/offchain/faucet/confirm`;
+
+  const object = {
+    account: address,
+    email
+  };
+
+  try {
+    const { status, data } = await axios.post(BASE_URL, object, {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+    console.log('[SUBSOCIAL] Faucet', status);
+
+    return {
+      statusCode: status,
+      body: JSON.stringify(data),
+    };
+
+
+  } catch (e) {
+    console.log('Error', e.message)
+    return {
+      statusCode: 500,
+      body: e.message,
+    };
+  }
+
+};
+

src-functions/searchPost.js

@@ -0,0 +1,40 @@
+import axios from "axios"
+
+exports.handler = async (event, context) => {
+
+
+  const query = event.queryStringParameters.query;
+
+  if (!query) {
+    return {
+      statusCode: 403,
+      body: `Cannot search without query`,
+    };
+  }
+
+  const BASE_URL = `https://app.subsocial.network/offchain/v1/offchain/search?indexes=posts&q=${query}&offset=0&limit=20`;
+
+  try {
+    const { status, data } = await axios.get(BASE_URL, {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+    console.log('[SUBSOCIAL] Search', status);
+
+    return {
+      statusCode: status,
+      body: JSON.stringify(data),
+    };
+
+
+  } catch (e) {
+    console.log('Error', e.message)
+    return {
+      statusCode: 500,
+      body: e.message,
+    };
+  }
+
+};
+

src/App.vue

@@ -22,6 +22,7 @@ import Navbar from './components/Navbar.vue';
 import Footer from './components/Footer.vue';
 import isShareMode from '@/utils/isShareMode'
 import coingecko from '@/coingecko'
+import correctFormat from '@/utils/ss58Format'
 
 @Component<Dashboard>({
   metaInfo() {
@@ -54,7 +55,7 @@ export default class Dashboard extends Vue {
   public async loadKeyring(): Promise<void> {
     const isDevelopment = process.env.VUE_APP_KEYRING === 'true'
     keyring.loadAll({
-      ss58Format: isDevelopment ? 0 : this.ss58Format || 42,
+      ss58Format: correctFormat(this.ss58Format),
       type: 'sr25519',
       isDevelopment,
     });

src/assets/subsocial.svg

@@ -40,9 +40,10 @@ export default class extends Vue {
   @Prop() public value!: Attribute[];
   @Prop({ default: 3 }) public max!: string | number;
   @Prop({ default: 'Select tags or create your own' }) public placeholder!: string;
+  @Prop(Boolean) public simple!: boolean
 
   get tags() {
-    return this.value ? this.value.map(valueOf) : []
+    return this.simple ? (this.value || []) as any[] as string[] : (this.value || []).map(valueOf)
   }
 
   set tags(value: string[]) {
@@ -51,7 +52,7 @@ export default class extends Vue {
 
   @Emit('input')
   handleInput(value: string[]) {
-    return value.map(v => ({ value: v }))
+    return this.simple ? value : value.map(v => ({ value: v }))
   }
 }
 </script>

src/components/rmrk/Create/AttributeTagInput.vue

@@ -60,6 +60,6 @@ export default class extends Vue {
 }
 
 #emoji-box {
-  border: 2px solid $primary; 
+  border: 2px solid $primary;
 }
 </style>

src/components/rmrk/Gallery/EmotionList.vue

@@ -104,7 +104,10 @@
           </template>
         </div>
       </div>
+      <hr class="comment-divider" />
+      <BaseCommentSection :nft="nft" :meta="meta" />
     </div>
+
   </div>
 </template>
 
@@ -117,12 +120,12 @@ import { NFT, NFTMetadata, Emotion, Emote } from '../service/scheme';
 import { sanitizeIpfsUrl, resolveMedia } from '../utils';
 import { emptyObject } from '@/utils/empty';
 
-import AvailableActions from './AvailableActions.vue';
+// import AvailableActions from './AvailableActions.vue';
 import { notificationTypes, showNotification } from '@/utils/notification';
-import Money from '@/components/shared/format/Money.vue';
-import Sharing from '@/components/rmrk/Gallery/Item/Sharing.vue';
-import Facts from '@/components/rmrk/Gallery/Item/Facts.vue';
-import Name from '@/components/rmrk/Gallery/Item/Name.vue';
+// import Money from '@/components/shared/format/Money.vue';
+// import/ Sharing from '@/components/rmrk/Gallery/Item/Sharing.vue';
+// import Facts from '@/components/rmrk/Gallery/Item/Facts.vue';
+// import Name from '@/components/rmrk/Gallery/Item/Name.vue';
 
 import isShareMode from '@/utils/isShareMode';
 import nftById from '@/queries/nftById.graphql'
@@ -152,15 +155,16 @@ import axios from 'axios';
   },
   components: {
     Auth: () => import('@/components/shared/Auth.vue'),
-    AvailableActions,
-    Facts,
+    AvailableActions: () => import('./AvailableActions.vue'),
+    Facts: () => import('@/components/rmrk/Gallery/Item/Facts.vue'),
     // MarkdownItVueLight: MarkdownItVueLight as VueConstructor<Vue>,
-    Money,
-    Name,
-    Sharing,
+    Money: () => import('@/components/shared/format/Money.vue'),
+    Name: () => import('@/components/rmrk/Gallery/Item/Name.vue'),
+    Sharing: () => import('@/components/rmrk/Gallery/Item/Sharing.vue'),
     Appreciation: () => import('./Appreciation.vue'),
     MediaResolver: () => import('../Media/MediaResolver.vue'),
-    PackSaver: () => import('../Pack/PackSaver.vue')
+    PackSaver: () => import('../Pack/PackSaver.vue'),
+    BaseCommentSection: () => import('@/components/subsocial/BaseCommentSection.vue')
   }
 })
 export default class GalleryItem extends Vue {
@@ -290,6 +294,11 @@ export default class GalleryItem extends Vue {
 <style lang="scss">
 @import "@/styles/variables";
 
+hr.comment-divider {
+  border-top: 1px solid lightpink;
+  border-bottom: 1px solid lightpink;
+}
+
 .gallery-item {
   .nft-title {
     margin-bottom: 24px;