0.2.30A1

config/app.settings.js

@@ -21,7 +21,7 @@ export var AppSettings = {
   DisableLogin: false,
   DisableRegister: true,
   DisablePasswordRecover: true,
-  // Activating this, the logs must be trowed
+  disable_pro_tool: fromStorage? SettingStoragedValue('disable_pro_tool') : false,
   force_showDevLogs: fromStorage? SettingStoragedValue('force_showDevLogs') : false,
   SignForNotExpire: fromStorage? SettingStoragedValue('sessions_noexpire') : false,
   auto_search_ontype: fromStorage? SettingStoragedValue('auto_search_ontype') : false,

globals/settings.js

@@ -14,6 +14,13 @@ function SettingStoragedValue(e) {
 }
 
 export var ListSettings = [
+  {
+    SettingID: 'disable_pro_tool',
+    type: 'switch',
+    title: 'Hide Pro Tools',
+    description: 'Hide right sidebar utils of comty pro',
+    value: fromStorage ? SettingStoragedValue('disable_pro_tool') : false,
+  },
   {
     SettingID: 'sessions_noexpire',
     type: 'switch',

package.json

@@ -3,8 +3,8 @@
   "UUID": "C8mVSr-4nmPp2-pr5Vrz-CU4kg4",
   "title": "Comty™",
   "DevBuild": true,
-  "version": "0.2.26",
-  "stage": "A2",
+  "version": "0.2.30",
+  "stage": "A1",
   "description": "",
   "main": "app/main.js",
   "author": "RageStudio",

src/@ycore/libs/app_functions/modals.js

@@ -0,0 +1,124 @@
+import React from 'react'
+import * as ycore from 'ycore'
+import * as antd from 'antd'
+import * as Icons from '@ant-design/icons'
+import styles from './modals.less';
+
+
+class __Model_postreport extends React.PureComponent {
+    state = {
+        step: 1
+    }
+    end(){
+        if(this.props.id){
+            const payload = { post_id: this.props.id }
+            ycore.comty_post.__report((err, res) => {
+              if (err) {
+                return false
+              }
+              ycore.notify.info('This post has been reported successfully, our team will review it and inform you about problem resolution ...')
+              ycore.FeedHandler.refresh()
+              ycore.FeedHandler.goToElement(this.props.id)
+            }, payload)
+        }
+        setTimeout(() => {
+            ycore.SecondarySwap.close()
+        }, 500)
+
+    }
+    next(){
+        let a = this.state.step
+        
+        if(a<3)a++
+        this.setState({step: a })
+    }
+    status(i){
+        const a = this.state.step
+        if (a==i) return 'process'
+        if (a>i) return 'finish'
+        if (a<i) return 'wait'
+    }
+    renderStep(){
+        const a = this.state.step
+        switch (a) {
+            case 1:
+               return (
+                <div className={styles.post_report_body}>
+                <h1>Report an post</h1>
+                <p>This tool is intended for the community in a public way to help identify problematic or abusive content and for legitimate purposes.</p><br/>
+                <p>To ensure the proper use of this tool, before proceeding, you must understand the following:</p>
+                <antd.Checkbox onChange={this.validate.term_1}>I understand and agree that my complaint may be sent to the party that posted the content in question.</antd.Checkbox>
+                <antd.Checkbox onChange={this.validate.term_2}>I understand that the abuse of this tool may have consequences for my account</antd.Checkbox>
+                <br/><br/>{this.state.term_1 && this.state.term_2? <antd.Button onClick={() => this.next()} >Next</antd.Button> : null}
+                </div>  
+               )
+            case 2: 
+                return( 
+                <div className={styles.post_report_body}>
+                    <br/>
+                    <h3>For this report or complaint to be fair, make sure that the reason is for the following reasons:</h3>
+                    <br/>
+                    <p>- Harmful content or hate speech</p>
+                    <p>- Violent or repulsive content</p>
+                    <p>- Misleading advertising or spam</p>
+                    <p>- Illegal activities</p>
+                    <p>- Sexual content</p>
+                    <p>- Or any other activity that violates the terms and conditions of use</p>
+                    <antd.Checkbox onChange={this.validate.term_3}>I am sure and understand that the reason for this report is included in the above list.</antd.Checkbox>
+                    <br/><br/>{this.state.term_3? <antd.Button onClick={() => this.next()} >Next</antd.Button> : null}
+
+                </div>
+                )
+            case 3:
+                return (
+                    <div className={styles.post_report_body}>
+                        <br/>
+                        <h3>Given the above circumstances, to send this report or report please confirm that you understand and are following that you want to carry out this action</h3>
+                        <antd.Checkbox onChange={this.validate.confirm}>I am sure of what I do and I want to send this complaint or report</antd.Checkbox>
+                        <br/><br/>{this.state.term_confirm? <antd.Button onClick={() => this.end()} >Send report</antd.Button> : null}
+
+                    </div>
+                )
+            default:
+                return null
+        }
+    }
+    validate = {
+        term_1: (e) =>{this.setState({ term_1: e.target.checked })},
+        term_2: (e) =>{this.setState({ term_2: e.target.checked })},
+        term_3: (e) =>{this.setState({ term_3: e.target.checked })},
+        confirm: (e) =>{this.setState({ term_confirm: e.target.checked })}
+    }
+
+    render(){
+        return(
+            <div className={styles.post_report_main}>
+                <div>
+                    <antd.Steps>
+                       <antd.Steps.Step status={this.status(1)} title="Summary" icon={<Icons.SolutionOutlined />} />
+                       <antd.Steps.Step status={this.status(2)} title="Confirm" icon={<Icons.AuditOutlined />} />
+                       <antd.Steps.Step status={this.status(3)} title="Done" icon={<Icons.CheckCircleOutlined />} />
+                    </antd.Steps>
+                </div>
+                {this.renderStep()}
+            </div>
+        )
+    }
+}
+
+
+export const app_modals = {
+    report_post: (post_id) => {
+        antd.Modal.confirm({
+            title: 'Report an post',
+            icon: <Icons.FrownOutlined />,
+            content: 'It seems that you want to report this post, first of all it is necessary that you take into account that this tool is only intended for serious cases and we need you to comply with some questions to be able to report this post and to guarantee the quality of service ...',
+            onOk() {
+                return ycore.SecondarySwap.openFragment(<__Model_postreport id={post_id} />)
+            },
+            onCancel() {
+                return false
+            },
+          });
+    }
+}

src/@ycore/libs/app_functions/modals.less

@@ -0,0 +1,6 @@
+.post_report_main{
+    padding: 0 0 0 115px;
+}
+.post_report_body{
+    color: #2d2d2d!important;
+}

src/@ycore/libs/app_functions/pre.js

@@ -1,12 +1,17 @@
-import { RenderFeed } from '../../../components/MainFeed'
+import { RenderFeed } from 'components/MainFeed'
 import { transitionToogle } from '../../../pages/login'
 import { SetControls, CloseControls } from '../../../components/Layout/Control'
 import { SwapMode } from '../../../components/Layout/Secondary'
+import umiRouter from 'umi/router'
 import * as ycore from 'ycore'
 import * as antd from 'antd'
 import * as Icons from '@ant-design/icons'
 import React from 'react'
 
+export * from './modals.js'
+
+
+
 export function QueryRuntime() {
   const validBackup = ycore.validate.backup()
 
@@ -21,7 +26,7 @@ export function SetupApp() {
     localStorage.setItem('resource_bundle', 'light_ng')
   }
   setTimeout(() => {
-    ycore.router.go('main')
+    ycore.router.push('main')
   }, 500)
 }
 
@@ -44,6 +49,9 @@ export const SecondarySwap = {
   },
   openSearch: e => {
     SwapMode.openSearch(e)
+  },
+  openFragment: e =>{
+    SwapMode.openFragment(e)
   }
 }
 
@@ -56,12 +64,62 @@ export const ControlBar = {
   },
 }
 
+export const FeedHandler = {
+  refresh: () => {
+    RenderFeed.RefreshFeed()
+  },
+  killByID: (post_id) => {
+    RenderFeed.killByID(post_id)
+  },
+  addToRend: (payload) => {
+    RenderFeed.addToRend(payload)
+  },
+  goToElement: post_id => {
+    RenderFeed.goToElement(post_id)
+  },
+}
+
 export const LoginPage = {
   transitionToogle: () => {
     transitionToogle()
   },
 }
 
+export const router = {
+  go: e => {
+    goTo.element('primaryContent')
+    umiRouter.push({
+      pathname: `/${e}`,
+      search: window.location.search,
+    })
+  },
+  push: e => {
+    umiRouter.push({
+      pathname: `/${e}`,
+      search: window.location.search,
+    })
+  }
+}
+
+export const goTo = {
+  top: (id)=> {
+    const element = document.getElementById(id)
+    element.scrollTop = element.scrollHeight + element.clientHeight
+  },
+  bottom: (id) => {
+    const element = document.getElementById(id)
+    element.scrollTop = element.scrollHeight - element.clientHeight
+  },
+  element: (element) => {
+    try {
+      document.getElementById(element).scrollIntoView()
+    } catch (error) {
+      return false
+    }
+  }
+
+}
+
 export function RefreshONCE() {
   window.location = '/'
 }
@@ -140,7 +198,7 @@ export const app_session = {
       }
       // Runtime after dispatch API
       ycore.token_data.remove()
-      ycore.router.push({ pathname: '/login' })
+      ycore.router.push('login')
     })
   },
 }

src/@ycore/libs/comty_ng/comty_get.js

@@ -1,4 +1,4 @@
-import { API_Call, endpoints } from 'ycore'
+import { API_Call, endpoints, sdcp } from 'ycore'
 
 export const comty_get = {
   sessions: (callback) => {
@@ -40,18 +40,26 @@ export const comty_get = {
     formdata)
   },
   general_data: (callback, payload) => {
-    if (!payload) return false
-    const { id } = payload
+    let formdata = new FormData();
+    let callOptions = { includeUserID: false };
 
-    let formdata = new FormData()
-    formdata.append('user_id', id)
+    if (!payload) {
+      callOptions = {  includeUserID: true }
+      formdata.append('fetch', 'notifications,friend_requests,pro_users,promoted_pages,trending_hashtag,count_new_messages')
+    }
 
+    if (payload) { 
+      payload.user_id? formdata.append('user_id', payload.user_id) : null
+      payload.fetch? formdata.append('fetch', payload.fetch) : null
+    }
+  
     API_Call(
       (err, res) => {
         return callback(err, res)
       },
       endpoints.comty_endpoints.get_general_data,
-      formdata
+      formdata, callOptions
     )
+    
   },
 }

src/@ycore/libs/comty_ng/comty_post.js

@@ -61,7 +61,7 @@ export const comty_post = {
     formdata.append('type', 'new_post')
     formdata.append('postPrivacy', privacy)
     formdata.append('postText', text)
-    file ? formdata.append('postPhoto', file) : null
+    file ? formdata.append('uploadFile', file) : null
 
     const callOptions = { includeUserID: true }
     API_Call(

src/@ycore/libs/comty_ng/pre.js

@@ -1,6 +1,5 @@
 import { token_data } from 'ycore'
 import * as Icons from '@ant-design/icons'
-import { RenderFeed } from 'components/MainFeed'
 
 export * from './comty_post.js'
 export * from './comty_user.js'
@@ -8,17 +7,7 @@ export * from './comty_post_comment.js'
 export * from './comty_search.js'
 export * from './comty_get.js'
 
-export const FeedHandler = {
-  refresh: () => {
-    RenderFeed.RefreshFeed()
-  },
-  killByID: (post_id) => {
-    RenderFeed.killByID(post_id)
-  },
-  addToRend: (payload) => {
-    RenderFeed.addToRend(payload)
-  }
-}
+
 
 export const IsThisPost = {
   owner: (post_uid) => {

src/@ycore/libs/ycore_sdcp/pre.js

@@ -1,29 +1,41 @@
 import * as ycore from 'ycore'
 import localforage from 'localforage'
 
-export const asyncSDCP = {
-  setSDCP: function(value) {
-    return Promise.resolve().then(function() {
-      localforage.setItem('SDCP', value)
-    })
+export const sdcp = {
+  isset: (value) => {
+    if (!value) return false
+    ycore.sdcp.localforage.getItem(value)? true : false
   },
-  getRaw: () => {
+  set: (operator)  => {
+      if (!operator) return false
+      try {
+        let a;
+        let b; 
+
+        let { callback, model } = operator
+        const {key, value} = model
+        if (!typeof key === 'string' || ! a instanceof String) return false
+      
+        a = ycore.sdcp.get(key)
+        if (!a.isArray()) return false
+        
+        b = JSON.parse(a).concat(value)
+
+        localforage.setItem(key, b)
+
+      } catch (err) {
+        console.log(err)
+        return false
+      }
+  },
+  get: (key) => {
     try {
-      return localforage.getItem('SDCP')
-    } catch (err) {
-      return false
-    }
-  },
-  get: callback => {
-    try {
-      const a = ycore.asyncSDCP.getRaw((err, value) => {
-        const b = ycore.cryptSDCP.atob_parse(value)
-        return callback(null, b)
-      })
+      return localforage.getItem(key)
     } catch (err) {
       return false
     }
   },
+
 }
 
 export const cryptSDCP = {
@@ -33,9 +45,7 @@ export const cryptSDCP = {
         atob(e)
       } catch (err) {
         ycore.notify.error(err)
-        ycore.router.push({
-          pathname: '/login',
-        })
+        ycore.router.go('login')
         return false
       }
       try {
@@ -44,9 +54,7 @@ export const cryptSDCP = {
         return parsedSDCP
       } catch (err) {
         ycore.notify.error(err)
-        ycore.router.push({
-          pathname: '/login',
-        })
+        ycore.router.go('login')
         return false
       }
     }

src/@ycore/ycore_worker.js

@@ -9,7 +9,6 @@ import * as Endpoints from 'globals/endpoints/index.js'
 import * as Icons from '@ant-design/icons'
 import localforage from 'localforage'
 import { format } from 'timeago.js'
-import umiRouter from 'umi/router'
 import * as antd from 'antd'
 import moment from 'moment'
 import React from 'react'
@@ -188,37 +187,6 @@ export function booleanFix(e) {
   return false
 }
 
-/**
- * Go to bottom of an element by id
- *
- * @param id {string}
- * @return null
- */
-export function gotoBottom(id) {
-  const element = document.getElementById(id)
-  element.scrollTop = element.scrollHeight - element.clientHeight
-}
-
-/**
- * Go to top of an element by id
- *
- * @param id {string}
- * @return null
- */
-export function gotoTop(id) {  
-  const element = document.getElementById(id)
-  element.scrollTop = element.scrollHeight + element.clientHeight
-}
-
-/**
- * Go to position of an element by id
- *
- * @param element {array}
- * @return object
- */
-export function gotoElement(element) {
-  document.getElementById(element).scrollIntoView()
-}
 
 /**
  * Handle time basic functions
@@ -239,19 +207,6 @@ export const time = {
   },
 }
 
-/**
- * Framework functionality for navigate between pages (Router)
- *
- */
-export const router = {
-  go: e => {
-    gotoElement('primaryContent')
-    umiRouter.push({
-      pathname: `/${e}`,
-      search: window.location.search,
-    })
-  },
-}
 
 /**
  * Framework functionality for show with interface an notification

src/components/CustomIcons/index.js

@@ -6,6 +6,6 @@ const RobotOutlined = () => (<svg viewBox="64 64 896 896" focusable="false"  dat
 const SavedPost = () => (<svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" ><path d="M4 3h16a2 2 0 0 1 2 2v6a10 10 0 0 1-10 10A10 10 0 0 1 2 11V5a2 2 0 0 1 2-2z"></path><polyline points="8 10 12 14 16 10"></polyline></svg>)
 const SavedPostColor = () => (<svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="rgb(230, 247, 255)" stroke="rgb(24, 144, 255)" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" ><path d="M4 3h16a2 2 0 0 1 2 2v6a10 10 0 0 1-10 10A10 10 0 0 1 2 11V5a2 2 0 0 1 2-2z"></path><polyline points="8 10 12 14 16 10"></polyline></svg>)
 const SavedPostGrey = () => (<svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="rgb(196, 196, 196)" stroke="rgba(133, 133, 133, 1)" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" ><path d="M4 3h16a2 2 0 0 1 2 2v6a10 10 0 0 1-10 10A10 10 0 0 1 2 11V5a2 2 0 0 1 2-2z"></path><polyline points="8 10 12 14 16 10"></polyline></svg>)
-
+const TrendBlue = () => (<svg  width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M16,6L18.29,8.29L13.41,13.17L9.41,9.17L2,16.59L3.41,18L9.41,12L13.41,16L19.71,9.71L22,12V6H16Z"></path></svg>)
 const CustomIcons = {SavedPostGrey, SavedPostColor, VerifiedBadge, CommonThings, SunSVG, MoonSVG, RobotOutlined, SavedPost}
 export default CustomIcons

src/components/Layout/Secondary/index.js

@@ -5,11 +5,12 @@ import * as Icons from '@ant-design/icons'
 import styles from './index.less'
 import classnames from 'classnames'
 
-import { __priPost, __secComments, __priSearch } from './renders.js'
+import { __priPost, __secComments, __priSearch, __trendings, __pro } from './renders.js'
+import { FormatListNumbered } from '@material-ui/icons'
 
 export const SwapMode = {
   close: () => {
-    SecondaryLayoutComponent.closeSwap()
+    SecondaryLayoutComponent.Swapper.close()
   },
   openPost: (a, b) => {
     SecondaryLayoutComponent.setState({
@@ -20,22 +21,29 @@ export const SwapMode = {
   },
   openSearch: a => {
     SecondaryLayoutComponent.setState({
-      halfSwap: true,
-      loading: true,
       mode: 'search',
       pri_raw: a,
     })
     SecondaryLayoutComponent.Swapper.half()
   },
+  openFragment: fragment => {
+    SecondaryLayoutComponent.setState({
+      mode: 'fragment',
+      global_raw: fragment,
+    })
+    SecondaryLayoutComponent.Swapper.unique()
+  }
 }
 
 export default class Secondary extends React.PureComponent {
   constructor(props) {
     super(props), (window.SecondaryLayoutComponent = this)
     this.state = {
+      loading: true,
       half: false,
       swap: false,
       mode: '',
+      gen_data: '',
       global_raw: '',
       pri_raw: '',
       sec_raw: '',
@@ -47,6 +55,7 @@ export default class Secondary extends React.PureComponent {
       this.setState({
         swap: false,
         half: false,
+        unique: false,
         pri_raw: null,
         sec_raw: null,
         global_raw: null,
@@ -57,12 +66,21 @@ export default class Secondary extends React.PureComponent {
       this.setState({
         swap: true,
         half: false,
+        unique: false,
       })
     },
     half : () => {
       this.setState({
         swap: false,
         half: true,
+        unique: false,
+      })
+    },
+    unique: ()=>{
+      this.setState({
+        swap: false,
+        half: false,
+        unique: true,
       })
     }
   }
@@ -89,8 +107,11 @@ export default class Secondary extends React.PureComponent {
       case 'search': {
         return this.renderSearch(dtraw)
       }
+      case 'fragment': {
+        return this.renderFragment()
+      }
       default:
-        return null
+        return this.renderMain()
     }
   }
   __sec() {
@@ -137,20 +158,56 @@ export default class Secondary extends React.PureComponent {
       return null
     }
   }
+  renderMain = payload => {
+    try {
+      const trending_data = JSON.parse(this.state.gen_data)['trending_hashtag']
+      return(
+        <div className={styles.secondary_main}>
+
+          {ycore.IsThisUser.pro()? <__pro /> : <__pro /> } 
+          <__trendings data={trending_data} />
+        
+  
+        </div>
+      )
+    } catch (error) {
+      return null
+    }
+    
+  }
+  renderFragment = () => {
+    try {
+      const fragment = this.state.global_raw
+      return <React.Fragment>{fragment}</React.Fragment>
+    } catch (error) {
+      return null
+    }
+  }
+  componentDidMount(){
+    ycore.comty_get.general_data((err,res)=> {
+      if (err) return false
+      const notification_data = JSON.parse(res)['notifications']
+      this.setState({ loading: false, gen_data: res, notification_data: notification_data })
+
+    })
+  }
 
   render() {
     const { userData } = this.props
-    return (
+    if (!this.state.loading) return (
       <>
       <div className={styles.__secondary_colider}></div>
       <div
         className={classnames(styles.secondary_wrapper, {
           [styles.active]: this.state.swap,
           [styles.half]: this.state.half,
+          [styles.unique]: this.state.unique,
         })}
       >
         <div className={styles.secondary_userholder}>
-          <div className={styles.notif_box}></div>
+          <div className={styles.notif_box}>
+            <h1>{this.state.notification_data.length}</h1>    
+          </div>
           <img
             onClick={() => ycore.router.go(`@${userData.username}`)}
             src={userData.avatar}
@@ -162,7 +219,7 @@ export default class Secondary extends React.PureComponent {
         >
           
           <div className={styles.secondary_container_1}>
-            {this.state.swap || this.state.half ? (
+            {this.state.swap || this.state.half || this.state.unique ? (
               <antd.Button
                 type="ghost"
                 icon={<Icons.LeftOutlined />}
@@ -187,5 +244,7 @@ export default class Secondary extends React.PureComponent {
       </div>
       </>
     )
+    return null
+
   }
 }

src/components/Layout/Secondary/index.less

@@ -22,8 +22,8 @@
 
   &.active {
     width: @secondary_wrapper_showFull_width;
-    >.container_bg {
-      border-radius: @__Global_layout_border-rd;
+    >.secondary_container_1 {
+      padding: @secondary_container_1_padding;
     }
     //@media (min-width: 1000px) {
     //  width: 95.4%
@@ -32,11 +32,14 @@
 
   &.half {
     width: @secondary_wrapper_showHalf_width;
-    >.container_bg {
-      border-radius: 12px 0 0 12px;
+  }
+  &.unique {
+    width: @secondary_wrapper_showFull_width;
+    >.secondary_layout_bg  {
+      background-color: #ffffff;
+      padding-right: 90px;
     }
   }
-
   transition: width @__Global_SwapAnimDuration ease-in-out;
 
 }
@@ -68,6 +71,13 @@
     height: 40px;
     border-radius: 15px;
     background-color: #78CFED;
+    h1{
+      line-height: 40px;
+      font-size: 16px;
+      color: #ffffff;
+      text-align: center;
+      margin: 0;
+    }
   }
 }
 
@@ -92,7 +102,7 @@
   height: 100%;
 
   position: relative;
-  padding: @secondary_container_1_padding;
+  padding: 30px 30px 30px 35px;
 
   color: @secondary_container_1_color;
 
@@ -119,11 +129,11 @@
   padding: @secondaty_container_2_padding;
   
   opacity: 0;
-  color: @secondary_container_2_color;
+  color: @secondary_container_2_color!important;
   background-color: @secondary_container_2_backgroud;
 
   border-radius: 32px 0 0 32px;
-
+  
   &.active {
     width: 400px;
     opacity: 1;
@@ -132,7 +142,7 @@
       width: 600px
     }
   }
-
+  
   transition: all @__Global_SwapAnimDuration ease-in-out;
   
 }
@@ -145,4 +155,15 @@
   h2 {
     color: #ffffff;
   }
-}
+}
+
+
+.secondary_main{
+  margin-top: 45px;
+  width: 100%;
+}
+
+
+
+
+

src/components/Layout/Secondary/renders.js

@@ -295,3 +295,38 @@ export class __priSearch extends React.Component {
     )
   }
 }
+
+export class __trendings extends React.PureComponent {
+  render(){
+    if (!this.props.data) return false
+    return(
+      <div className={styles.secondary_hastags}>
+        <div className={styles.secondary_hastags_title}> <h2>Trending now</h2> </div>
+        <div className={styles.secondary_hastags_body}>
+          <antd.List
+            dataSource={this.props.data}
+            renderItem={item=>(
+            <div className={styles.hash}>
+              <p>#{item.tag}</p>
+              <p style={{ color: "white", fontSize: "9px" }}> {item.trend_use_num} Posts</p>
+            </div>)}
+          />
+        </div>
+      </div>
+    )
+  }
+}
+
+export class __pro extends React.PureComponent {
+  render(){
+    return(
+      <div className={styles.secondary_adv_pro}>
+        <h1>
+          Go Pro!
+        </h1>
+        <p>Sabias que la frase de kintxi, se hace la que no me conoze se hizo mientras estaba borracho</p>
+        <antd.Button>Start now <Icons.RightOutlined /></antd.Button>
+      </div>
+    )
+  }
+}

src/components/Layout/Secondary/renders.less

@@ -229,6 +229,13 @@
   width: 82%;
   margin: auto;
   :global{
+    .ant-result-title{
+      color: @secondary_container_1_color!important;
+    }
+    .ant-result-subtitle{
+      color: @secondary_container_1_color!important;
+
+    }
     .ant-list-items{
       height: 82vh;
       overflow: scroll;
@@ -269,4 +276,81 @@
     margin: 10px 0 0 0;
   }
 
+}
+
+.secondary_hastags {
+  font-family: @__Global_general_font_family;
+  color: #ffffff;
+  font-size: 12px;
+
+ 
+ .secondary_hastags_title{
+  h2{color: #ffffff;}
+  }
+
+  .secondary_hastags_body{
+    margin: 20px 0 0 0;
+    background-color: hsl(0, 0%, 21%);
+    border-radius: 12px;
+    word-break: break-all;
+    padding: 5px 5px 5px 10px;
+    height: auto;
+
+    .hash{
+      margin: 5px 0 3px 0;
+      cursor: pointer;
+    }
+
+    p{
+      margin: 0;
+      color: #2196F3;
+      font-size: 12px;
+      max-height: 35px;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      overflow: hidden;
+    }
+
+  }
+
+}
+
+
+
+
+.secondary_adv_pro{
+  border-radius: 12px;
+  // background-color: #ff4d4e;
+  background: rgb(255,77,78);
+  background: linear-gradient(49deg, rgba(255,77,78,1) 15%, rgba(255,87,56,1) 55%, rgba(255,97,36,1) 73%, rgba(255,105,19,1) 82%, rgba(255,114,0,1) 94%);
+  
+  margin: 70px 0 30px 0;
+  padding: 14px;
+
+  width: 100%;
+  height: 140px;
+
+  h1{
+    color: #ffffff;
+    font-family: "Poppins", sans-serif;
+    font-size: 18px;
+    margin-bottom: 0;
+  }
+  p{
+    font-size: 9px;
+
+  }
+
+  :global{
+    .ant-btn{
+      vertical-align: bottom;
+      border: 0;
+      background-color: #d24345a2;
+      border-radius: 7px;
+      height: 27px;
+      padding: 2px 7px;
+      font-size: 12px;
+      font-weight: 600;
+    }
+  }
 }

src/components/MainFeed/index.js

@@ -18,8 +18,13 @@ export const RenderFeed = {
     window.MainFeedComponent.addToRend(payload)
     return
   },
+  goToElement: post_id => {
+    ycore.goTo.element(post_id)
+  },
   disableMenu: () => {
-
+    window.MainFeedComponent.setState({
+      disableMenu: true,
+    })
   },
 }
 class MainFeed extends React.Component {
@@ -29,6 +34,7 @@ class MainFeed extends React.Component {
     this.state = {
       invalid: false,
       loading: false,
+      disableMenu: false,
       data: [],
       fkey: 0,
     }
@@ -120,7 +126,7 @@ class MainFeed extends React.Component {
         const isEnd =
           parsed.length < ycore.AppSettings.limit_post_catch ? true : false
         this.setState({ isEnd: isEnd, data: mix, loading: false }, () =>
-          ycore.gotoElement(getLastPost.id)
+          ycore.goTo.element(getLastPost.id)
         )
         return true
       }, payload)

src/components/PostCard/index.js

@@ -15,7 +15,7 @@ const emptyPayload = {
   user: 'Post Empty',
   ago: 'This Post is empty',
   avatar: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png',
-  content: 'Test Test',
+  content: 'Empty',
 }
 
 class PostCard extends React.PureComponent {
@@ -111,19 +111,13 @@ class PostCard extends React.PureComponent {
             this.setState({ postSaved: true })
             return
           } else {
-            ycore.notify.success('Removed from Saved')
+            ycore.notify.info('Removed from Saved')
             this.setState({ postSaved: false })
           }
         }, payload)
       },
       report: post_id => {
-        const payload = { post_id: post_id }
-        ycore.comty_post.__report((err, res) => {
-          if (err) {
-            return false
-          }
-          ycore.notify.success('Post Reported')
-        }, payload)
+        ycore.app_modals.report_post(post_id)
       },
       boost: post_id => {
         const payload = { post_id: post_id }
@@ -136,7 +130,7 @@ class PostCard extends React.PureComponent {
             this.setState({ postBoosted: true })
             return
           } else {
-            ycore.notify.success('Post Unboosted')
+            ycore.notify.info('Post Unboosted')
             this.setState({ postBoosted: false })
           }
         }, payload)
@@ -186,12 +180,14 @@ class PostCard extends React.PureComponent {
           <Icons.SaveOutlined />{' '}
           {this.state.postSaved ? 'Unsave post' : 'Save Post'}
         </antd.Menu.Item>
+        {this.state.postReported? null: 
         <antd.Menu.Item
           onClick={() => handlePostActions.report(id)}
           key="report_post"
         >
           <Icons.FlagOutlined /> Report post
         </antd.Menu.Item>
+        }
       </antd.Menu>
     )
 

src/components/PostCreator/index.js

@@ -39,8 +39,9 @@ class PostCreator extends React.PureComponent {
 
   renderPostPlayer(payload) {
     const { file, fileURL } = this.state
-    const videofilter = file.type === 'video/mp4'
-    const imagefilter = file.type === 'image/jpeg' || file.type === 'image/png'
+    const videofilter = file.type.includes('video')
+    const imagefilter = file.type.includes('image')
+    const audiofilter = file.type.includes('audio')
     if (imagefilter) {
       return (
         <div className={styles.imagePreviewWrapper}>
@@ -77,6 +78,11 @@ class PostCreator extends React.PureComponent {
         </div>
       )
     }
+    if (audiofilter) {
+      return (
+        <audio controls src={fileURL} preload="auto" />
+      )
+    }
     return null
   }
   ToogleVisibility() {
@@ -104,6 +110,9 @@ class PostCreator extends React.PureComponent {
   beforeUpload = file => {
     const filter =
       file.type === 'image/jpeg' ||
+      file.type === 'audio/mp3' ||
+      file.type === 'audio/wav' ||
+      file.type === 'audio/ogg' ||
       file.type === 'image/png' ||
       file.type === 'image/jpg' ||
       file.type === 'image/gif' ||

src/pages/__m/index.js

@@ -157,6 +157,10 @@ export default class __m extends React.Component {
             {' '}
             Switch to Desktop_mode{' '}
           </antd.Button>
+
+          <antd.Button onClick={() => ycore.app_modals.report_post()}>
+            Open report_post modal
+          </antd.Button>
         </div>
 
         <div className={styles.titleHeader}>

src/pages/pro/index.js

@@ -2,6 +2,6 @@ import React from 'react'
 
 export default class Go_Pro extends React.Component {
   render() {
-    return <div>Go pro? Yeah</div>
+    return <div>Your PRO</div>
   }
 }

src/themes/base/index.less

@@ -180,3 +180,4 @@ body {
 @lightGrayColor: #ddd;
 @borderRadius: 6px;
 @boxShadow: 0 2px 5px rgba(#333, 0.2);
+

src/themes/fonts-imports.css

@@ -2,4 +2,5 @@
 @import url('https://fonts.googleapis.com/css?family=Poppins:300,300i,500,500i,700');
 @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap');
 @import url('https://fonts.googleapis.com/css?family=Kulim+Park&display=swap');
-@import url('https://fonts.googleapis.com/css?family=Nunito&display=swap');
+@import url('https://fonts.googleapis.com/css?family=Nunito&display=swap');
+@import url('https://api.ragestudio.net/fonts/trueno/font.css');