0.2.18

2025-06-09 10:34:17 +00:00 · 2020-03-18 21:54:48 +01:00 · 2020-03-18 21:54:48 +01:00 · dd3d7ec30d
commit dd3d7ec30d
parent 59f570394b
38 changed files with 839 additions and 496 deletions
--- a/globals/post_options.js
+++ b/globals/post_options.js
@ -0,0 +1,31 @@
+import * as Icons from '@ant-design/icons'
+
+export var Post_Options = [
+    {
+        "option": "pro_boost",
+        "icon": <Icons.RocketOutlined />,
+        "type" : "switch",
+        "title": "CPRO™ Boost",
+        "description": "",
+        "require": "pro",
+        "value":  false
+    },
+    {
+        "option": "allow_likes",
+        "icon": <Icons.HeartOutlined />,
+        "type" : "switch",
+        "title": "Allow Likes",
+        "description": "",
+        "require": "",
+        "value":  true
+    },
+    {
+        "option": "allow_comments",
+        "icon": <Icons.CommentOutlined />,
+        "type" : "switch",
+        "title": "Allow Comments",
+        "description": "",
+        "require": "",
+        "value":  true
+    },
+]
--- a/package.json
+++ b/package.json
@ -1,8 +1,9 @@
 {
  "name": "comty-development",
+  "UUID": "annyudx7eo",
  "title": "Comty™",
  "DevBuild": true,
-  "version": "0.2.12",
+  "version": "0.2.18",
  "description": "",
  "main": "index.js",
  "author": "RageStudio",
--- a/src/@ycore/libs.js
+++ b/src/@ycore/libs.js
@ -3,4 +3,4 @@ export * from './libs/comty_ng/pre.js';
 export * from './libs/yulio_id/pre.js';
 export * from './libs/ycore_styles/pre.js';
 export * from './libs/ycore_sdcp/pre.js';
-export * from './libs/control_bar/pre.js'
+export * from './libs/comty_layout/pre.js'
--- a/src/@ycore/libs/comty_layout/pre.js
+++ b/src/@ycore/libs/comty_layout/pre.js
@ -0,0 +1,20 @@
+import {SetControls, CloseControls} from "../../../components/Layout/Control"
+import {SwapMode} from '../../../components/Layout/Secondary.js'
+
+export const SecondarySwap = {
+    ext: ()=> {
+        SwapMode.ext()
+    },
+    PostComments: (e) => {
+        SwapMode.PostComments(e)
+    },
+}
+
+export const ControlBar = {
+    set: (e) => {
+        SetControls(e)
+    },
+    close: () => {
+        CloseControls()
+    }
+}
--- a/src/@ycore/libs/comty_ng/pre.js
+++ b/src/@ycore/libs/comty_ng/pre.js
@ -12,7 +12,7 @@ export function GetGeneralData(callback){
    body: formdata,
    redirect: 'follow'
  };  
-  const urlObj = `${ycore.endpoints.get_general_data}${ycore.GetUserToken.decrypted().UserToken}`
+  const urlObj = `${ycore.endpoints.get_general_data}${ycore.handlerYIDT.__token()}`
  fetch(urlObj, requestOptions)
    .then(response => {
        ycore.yconsole.log(response)
@ -34,7 +34,7 @@ export function follow_user(id, callback) {
    redirect: 'follow'
  };  
  ycore.yconsole.log(`Following user => ${id} `) 
-  const urlObj = `${ycore.endpoints.follow_user}${ycore.GetUserToken.decrypted().UserToken}`
+  const urlObj = `${ycore.endpoints.follow_user}${ycore.handlerYIDT.__token()}`
  fetch(urlObj, requestOptions)
    .then(response => {
        ycore.yconsole.log(response)
@ -85,7 +85,7 @@ export function PublishPost(privacy, raw, file, callback){
  }

  let formdata = new FormData();
-  formdata.append("user_id", ycore.GetUserToken.decrypted().UserID);
+  formdata.append("user_id", ycore.handlerYIDT.__id());
  formdata.append("type", "new_post")
  formdata.append("server_key", ycore.yConfig.server_key);
  formdata.append("postPrivacy", privacy)
@ -93,7 +93,7 @@ export function PublishPost(privacy, raw, file, callback){
  file? formdata.append("postPhoto", file) : null

  const requestOptions = {
-    "url": `${ycore.endpoints.new_post}${ycore.GetUserToken.decrypted().UserToken}`,
+    "url": `${ycore.endpoints.new_post}${ycore.handlerYIDT.__token()}`,
    "method": "POST",
    "timeout": 0,
    "data": formdata,
@ -118,7 +118,7 @@ export function FindUser(key, callback){
    let formdata = new FormData();
    formdata.append("server_key", ycore.yConfig.server_key);
    formdata.append("search_key", key);
-    const urlOBJ = `${ycore.endpoints.find_user}${ycore.GetUserToken.decrypted().UserToken}`
+    const urlOBJ = `${ycore.endpoints.find_user}${ycore.handlerYIDT.__token()}`
    const settings = {
        "url":  urlOBJ,
        "method": "POST",
@ -142,7 +142,7 @@ export function SeachKeywords(key, callback){
    let formdata = new FormData();
    formdata.append("server_key", ycore.yConfig.server_key);
    formdata.append("search_key", key);
-    const urlOBJ = `${ycore.endpoints.search_endpoint}${ycore.GetUserToken.decrypted().UserToken}`
+    const urlOBJ = `${ycore.endpoints.search_endpoint}${ycore.handlerYIDT.__token()}`
    const settings = {
        "url":  urlOBJ,
        "method": "POST",
@ -164,12 +164,46 @@ export function SeachKeywords(key, callback){
 export function ActionPost(type, id, value, callback){
  var formdata = new FormData();
  formdata.append("server_key", ycore.yConfig.server_key);
-  formdata.append("action", type);
-  formdata.append("post_id", id);
-  if (value) {
-    formdata.append("text", value)
+  if (!type || !id) {
+    ycore.notifyError('[ActionPost] No type or id Provided !!!')
+    return false
  }
-  const urlOBJ = `${ycore.endpoints.action_post}${ycore.GetUserToken.decrypted().UserToken}`
+  switch (type) {
+    case 'like':
+    {
+      formdata.append("action", "like");
+      formdata.append("post_id", id);
+      break
+    }
+    case 'commet':
+      {
+        if (!value) {
+          return false
+        }
+        formdata.append("action", "commet");
+        formdata.append("text", value)
+        break
+      }
+    case 'edit': 
+    {
+      if (!value) {
+        return false
+      }
+      formdata.append("action", "edit");
+      formdata.append("text", value)
+      break
+    }
+    case 'delete': 
+    {
+      formdata.append("action", "delete");
+      formdata.append("post_id", id);
+      break
+    }
+    default:
+      break;
+  }
+ 
+  const urlOBJ = `${ycore.endpoints.action_post}${ycore.handlerYIDT.__token()}`
  const settings = {
      "url":  urlOBJ,
      "method": "POST",
@ -195,7 +229,7 @@ export function GetUserTags(id, callback){
  formdata.append("server_key", ycore.yConfig.server_key);
  formdata.append("user_id", id )

-  const urlOBJ = `${ycore.endpoints.get_user_tags}${ycore.GetUserToken.decrypted().UserToken}`
+  const urlOBJ = `${ycore.endpoints.get_user_tags}${ycore.handlerYIDT.__token()}`
  const settings = {
      "url":  urlOBJ,
      "method": "POST",
@ -231,7 +265,7 @@ export function GetPosts(userid, type, fkey, callback) {
      formdata.append("type", "get_news_feed");
      break;
  }
-  const urlOBJ = `${ycore.endpoints.get_posts}${ycore.GetUserToken.decrypted().UserToken}`
+  const urlOBJ = `${ycore.endpoints.get_posts}${ycore.handlerYIDT.__token()}`
  const settings = {
      "url":  urlOBJ,
      "method": "POST",
@ -261,7 +295,7 @@ export const get_app_session = {
        body: formdata,
        redirect: 'follow'
      };
-      const uriObj = `${ycore.endpoints.get_sessions}${ycore.GetUserToken.decrypted().UserToken}`
+      const uriObj = `${ycore.endpoints.get_sessions}${ycore.handlerYIDT.__token()}`
      fetch(uriObj, requestOptions)
        .then(response => response.text())
        .then(result => {
@ -282,7 +316,7 @@ export const get_app_session = {
          body: formdata,
          redirect: 'follow'
        };
-        const uriObj = `${ycore.endpoints.get_sessions}${ycore.GetUserToken.decrypted().UserToken}`
+        const uriObj = `${ycore.endpoints.get_sessions}${ycore.handlerYIDT.__token()}`
        fetch(uriObj, requestOptions)
          .then(response => response.text())
          .then(result => {
--- a/src/@ycore/libs/control_bar/pre.js
+++ b/src/@ycore/libs/control_bar/pre.js
@ -1,10 +0,0 @@
-import {SetControls, CloseControls} from "../../../components/Layout/Control"
-
-export const ControlBar = {
-    set: (e) => {
-        SetControls(e)
-    },
-    close: () => {
-        CloseControls()
-    }
-}
--- a/src/@ycore/libs/ycore_sdcp/leagacy.js
+++ b/src/@ycore/libs/ycore_sdcp/leagacy.js
@ -1,90 +0,0 @@
-import * as ycore from 'ycore'
-
-export const asyncSDCP = {
-    setSDCP: function (value) {
-        return Promise.resolve().then(function () {
-            sessionStorage.setItem('SDCP', value);
-        });
-    },
-    getSDCP: function () {
-        return sessionStorage.getItem('SDCP');
-    }
-};
-export function InitSDCP(values, done) {
-    const prefix = '[InitSDCP]';
-    let payload = {};
-    if (!values) {
-        const message = 'Missing payload! Exception while request data...';
-        ycore.yconsole.log(prefix, message)
-        return;
-    }
-    payload.UserToken = values.UserToken;
-    payload.UserID = values.UserID;
-    if (payload) {
-        ycore.GetUserData(payload, (err, response) => 
-          { 
-            let cooked = JSON.parse(response)['user_data']
-            let Ensamblator = btoa(JSON.stringify(cooked))
-            ycore.SetupApp()
-            ycore.asyncSDCP.setSDCP(Ensamblator).then(() => {
-               ycore.yconsole.log(prefix, ' SDCP Setup done')
-               return done(true)
-           })
-          }
-        )
-    }
-}
-export function UpdateSDCP() {
-   const prefix = '[UpdateSDCP]';
-   ycore.GetUserData(null, (err, response) => {
-       let cooked = JSON.parse(response)['user_data']
-       let Lsdcp = [atob(sessionStorage.getItem('SDCP'))];
-       let Nsdcp = [JSON.stringify(cooked)]
-       const e1 = btoa(Lsdcp)
-       const e2 = btoa(Nsdcp)
-       const n = e1.localeCompare(e2)
-       if (!e2) {
-            ycore.yconsole.log(prefix, 'API Returned empty response! We recommend to logout')
-            return
-       }
-       if (e1 == e2) {
-         ycore.yconsole.log(prefix, 'SDCP Equality')
-       }else{
-           ycore.yconsole.log(prefix, 'SDCP Update detected ! => ', n)
-           ycore.yconsole.debug(`Compare versions =>  NEW ${[e1]} || OLD ${[e2]}  `)
-           ycore.asyncSDCP.setSDCP(e2)
-       }
-
-   })
-}
-export function SDCP() {
-   const prefix = '[SDCPCooker]';
-   let SDCPContainer = sessionStorage.getItem('SDCP')
-   if (SDCPContainer) {
-       try {
-         atob(SDCPContainer);
-       } catch (err) {
-           console.error(prefix, err)
-           ycore.router.push({pathname: '/login',})
-           return null
-       }
-       try {
-           let decodedSDCP = atob(SDCPContainer);
-           let parsedSDCP = JSON.parse(decodedSDCP);
-           return parsedSDCP;
-       } catch (err) {
-           console.error(prefix, err)  
-           ycore.router.push({pathname: '/login',})
-           return null
-       }
-   }
-}
-export function SetupApp(){
-    // TODO: Default sets
-    const resourceLoad = localStorage.getItem('resource_bundle')
-    if (!resourceLoad) {
-        localStorage.setItem('resource_bundle', 'light_ng')
-    }
-   
-
-}
--- a/src/@ycore/libs/ycore_sdcp/pre.js
+++ b/src/@ycore/libs/ycore_sdcp/pre.js
@ -5,14 +5,30 @@ import localforage from 'localforage'
 export const asyncSDCP = {
    setSDCP: function (value) {
        return Promise.resolve().then(function () {
-            sessionStorage.setItem('SDCP', value);
+            localforage.setItem('SDCP', value)
        });
    },
-    getSDCP: function () {
-        return sessionStorage.getItem('SDCP');
-    }
+    getRaw: () => {
+        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)
+            })
+        } catch (err) {
+            console.log(err);
+            return false
+        }
+    },
 };
-export function InitSDCP(values, done) {
+
+export function GetSDCPfromCloud(values, res) {
    const prefix = '[InitSDCP]';
    let payload = {};
    if (!values) {
@ -27,15 +43,12 @@ export function InitSDCP(values, done) {
          { 
            let cooked = JSON.parse(response)['user_data']
            let Ensamblator = btoa(JSON.stringify(cooked))
-            ycore.SetupApp()
-            ycore.asyncSDCP.setSDCP(Ensamblator).then(() => {
-               ycore.yconsole.log(prefix, ' SDCP Setup done')
-               return done(true)
-           })
+            res(Ensamblator);
          }
        )
    }
 }
+
 export function UpdateSDCP() {
   const prefix = '[UpdateSDCP]';
   ycore.GetUserData(null, (err, response) => {
@ -59,28 +72,45 @@ export function UpdateSDCP() {

   })
 }
+
 export function SDCP() {
-   const prefix = '[SDCPCooker]';
-   let SDCPContainer = sessionStorage.getItem('SDCP')
-   if (SDCPContainer) {
-       try {
-         atob(SDCPContainer);
-       } catch (err) {
-           ycore.yconsole.error(prefix, err)
-           ycore.router.push({pathname: '/login',})
-           return null
-       }
-       try {
-           let decodedSDCP = atob(SDCPContainer);
-           let parsedSDCP = JSON.parse(decodedSDCP);
-           return parsedSDCP;
-       } catch (err) {
-           ycore.yconsole.error(prefix, err)  
-           ycore.router.push({pathname: '/login',})
-           return null
-       }
+   let a = ycore.asyncSDCP.get()
+   if (a) {
+     return a
   }
+   return false
 }
+
+export const CryptSDCP = {
+    atob_parse:  (e) => {
+        if (e) {
+            try {
+                atob(e);
+              } catch (err) {
+                  ycore.notifyError(err)
+                  ycore.router.push({pathname: '/login',})
+                  return false
+              }
+            try {
+                let decodedSDCP = atob(e);
+                let parsedSDCP = JSON.parse(decodedSDCP);
+                return parsedSDCP;
+            } catch (err) {
+                ycore.notifyError(err)  
+                ycore.router.push({pathname: '/login',})
+                return false
+            }
+        }
+        return false
+    },
+    valid: () => {
+        const a = ycore.asyncSDCP.get()
+        console.log(a)
+        return a? true : false
+    }
+
+}
+
 export function SetupApp(){
    // TODO: Default sets
    const resourceLoad = localStorage.getItem('resource_bundle')
--- a/src/@ycore/libs/yulio_id/pre.js
+++ b/src/@ycore/libs/yulio_id/pre.js
@ -3,59 +3,112 @@ import * as antd from 'antd'
 import Cookies from "ts-cookies";
 import keys from '../../../../config/keys.js';
 import * as Icons from '@ant-design/icons';
-import Icon from '@ant-design/icons'

 var jquery = require("jquery");
 var jwt = require("jsonwebtoken")

-function __ServerAlive(a, callback){

+export function userData(){
+    return ycore.handlerYIDT.get()
 }

-export function __permission(id){
-  const userAdmin = ycore.SDCP().admin
-  return ycore.booleanFix(userAdmin)
-}

-function __API__User (payload){
-    var ExpireTime =  ycore.DevOptions.MaxJWTexpire
+
+function __API__User (payload, sdcp){
    const now = new Date()
    now.setDate(now.getDate() + 1)
    const { UserID, UserToken } = payload
-    const frame = { UserID, UserToken, deadline: ( ycore.DevOptions.SignForNotExpire? null : now.getTime() )}
-    ycore.yconsole.debug(frame)
-    jwt.sign(
-      frame,
-      keys.secretOrKey,
-      ycore.DevOptions.SignForNotExpire?  { expiresIn: '0' } :  { expiresIn: ExpireTime },
-      (err, token) => {
-       Cookies.set('token', token)
-       ycore.RefreshONCE()
-      }
-    )
+
+    const a = ycore.CryptSDCP.atob_parse(sdcp)
+    const { avatar, admin, pro, dev, is_pro, username } = a;
+
+    const frame = { 
+        UserID, 
+        UserToken, 
+        avatar,
+        admin,
+        pro,
+        dev,
+        is_pro,
+        username,
+        deadline: ( ycore.DevOptions.SignForNotExpire? null : now.getTime() )
+    }
+    ycore.handlerYIDT.set(frame, done => {
+        ycore.RefreshONCE()
+    })
 }
-export function ValidLoginSession(){
+
+export const handlerYIDT = {
+    set: (value, callback) => {
+        const ExpireTime =  ycore.DevOptions.MaxJWTexpire
+        jwt.sign(
+            value,
+            keys.secretOrKey,
+            ycore.DevOptions.SignForNotExpire?  { expiresIn: '0' } :  { expiresIn: ExpireTime },
+            (err, token) => {
+                err? null : Cookies.set('cid', token)
+                callback(true)
+            }
+        )
+        ycore.yconsole.debug(frame)
+        return true
+    },
+    getRaw: () => {
+        return Cookies.get('cid')
+    },
+    get: () => {
+        let final = jwt.decode(Cookies.get('cid')) || jwt.decode(localStorage.getItem('last_backup'));
+        const a = jwt.decode(Cookies.get('cid'))
+        const b = jwt.decode(localStorage.getItem('last_backup'))
+        if (!a && !b) {
+            final = false
+            return final
+        }
+        if (!a) {
+            final = b
+        }
+        if (!b) {
+            final = a
+        }
+        ycore.yconsole.debug(final)
+        return final
+    },
+    remove: () =>{
+        Cookies.remove('cid')
+    },
+    __token: () => {
+        return ycore.handlerYIDT.get().UserToken
+    },
+    __id: () => {
+        return ycore.handlerYIDT.get().UserID
+    }
+
+}
+
+export function ValidLoginSession(callback){
    const prefix = '[YID Session]';
    let final = false;
    let ValidCookiesToken = false;
    let ValidSDCP = false;
-    let TokenContainer = Cookies.get('token');
-    let SDCPContainer = ycore.asyncSDCP.getSDCP();
+
+    let TokenContainer = Cookies.get('cid');
+
    if (TokenContainer) {
      let TokenContainerDC = jwt.decode(TokenContainer)
      if (TokenContainerDC){
        ValidCookiesToken = true
      }
    }
-    if (SDCPContainer) {
-        try {
-            atob(SDCPContainer)
-            ValidSDCP = true 
-        } catch (error) {
-            return
-        }
+
+    if (ycore.CryptSDCP.valid()){
+        ValidSDCP = true;
    }
-    if (ValidCookiesToken == true  && ValidSDCP == true) {final = true} 
+
+    if (ValidCookiesToken == true){
+        final = true
+    } 
+
+    const finalvalids = { ValidSDCP, ValidCookiesToken, final }
    ycore.DevOptions.ShowFunctionsLogs? (
        console.group(`%c ${prefix} `, 'background: #339edf; color: #fff'),
        console.log(`Valid SDCP => ${ValidSDCP}`),
@ -63,6 +116,9 @@ export function ValidLoginSession(){
        console.log(`Session is valid => ${final}`),
        console.groupEnd() 
    ) : null
+    if (callback) {
+        callback(finalvalids)
+    }
    return final
 }
 export function ValidBackup(){
@ -78,14 +134,14 @@ export function ValidBackup(){
 }
 export function MakeBackup(){
    if (ValidBackup() == false) {
-        ycore.asyncLocalStorage.setItem('last_backup', Cookies.get('token'))
+        ycore.asyncLocalStorage.setItem('last_backup', Cookies.get('cid'))
        return
    }
 }
 export function LogoutCall(){
    const prefix = ('[YID Session]  ')
    ycore.yconsole.log('Logout Called !')
-    let DecodedToken = ycore.GetUserToken.decrypted().UserToken || atob(localStorage.getItem('last_backup'))
+    let DecodedToken = ycore.handlerYIDT.__token() || atob(localStorage.getItem('last_backup'))
    const urlOBJ = (`${ycore.endpoints.removeToken}${DecodedToken}`)
    ycore.yconsole.log(prefix, ' Login out with token => ', DecodedToken, urlOBJ)
    const form = new FormData();
@ -116,12 +172,11 @@ export function LogoutCall(){
            ycore.yconsole.log("Successful logout with YulioID™", response, urlOBJ)
        }
        // Runtime after dispatch API
-        Cookies.remove('token')
-        Cookies.remove('SDCP')
+        ycore.handlerYIDT.remove()
        ycore.router.push({pathname: '/login',})
    })
 }
-export function GetAuth(EncUsername, EncPassword, callback) {
+export function __AppSetup__(EncUsername, EncPassword, callback) {
    const prefix = '[Auth Server]:';
    if (!EncUsername || !EncPassword) {
        const message = 'Missing Data! Process Aborted...';
@ -154,7 +209,9 @@ export function GetAuth(EncUsername, EncPassword, callback) {
                  let FramePayload = { UserID, UserToken }
                  ycore.yconsole.log(FramePayload)
                  callback(null, '200')
-                  ycore.InitSDCP(FramePayload, (done) => done? __API__User(FramePayload) : null )
+                  
+                  ycore.GetSDCPfromCloud(FramePayload, (res) => res? __API__User(FramePayload, res) : null )
+                  ycore.SetupApp()
                }
                if (identState == 400) {
                  callback(null, '400')
@ -170,31 +227,10 @@ export function GetAuth(EncUsername, EncPassword, callback) {
        return;
    })
 }
-export const GetUserToken = {
-    decrypted: function () {
-        let final = jwt.decode(Cookies.get('token')) || jwt.decode(localStorage.getItem('last_backup'));
-        const FC = jwt.decode(Cookies.get('token'))
-        const FB = jwt.decode(localStorage.getItem('last_backup'))
-        if (!FC && !FB) {
-            final = false
-            return final
-        }
-        if (!FC) {
-            final = FB
-        }
-        if (!FB) {
-            final = FC
-        }
-        ycore.yconsole.debug(final)
-        return final
-    },
-    raw: function () {
-        return Cookies.get('token') || localStorage.getItem('last_backup');
-    },
-}
+
 export function GetUserData (values, callback) {
    const prefix = '[YID SDCP]';
-    const offlineAPI = ycore.GetUserToken.decrypted();
+    const offlineAPI = ycore.handlerYIDT.get();
    const globalValue = values || {UserToken: offlineAPI.UserToken, UserID: offlineAPI.UserID};
    const usertoken = globalValue.UserToken
    const userid = globalValue.UserID
@ -232,3 +268,24 @@ export function GetUserData (values, callback) {
        }
     )
 }
+
+export const IsThisUser = {
+    admin: () => {
+        const a = ycore.userData()
+        return ycore.booleanFix(a.admin)? true : false
+    },
+    dev: () => {
+        const a = ycore.userData()
+        return ycore.booleanFix(a.dev)? true : false
+    },
+    pro: () => {
+        const a = ycore.userData()
+        return ycore.booleanFix(a.is_pro)? true : false
+    },
+    same: (a) => {
+        if(a == ycore.userData().UserID){
+            return true
+          }
+        return false
+    }
+}
--- a/src/@ycore/ycore_worker.js
+++ b/src/@ycore/ycore_worker.js
@ -5,25 +5,35 @@
 * @licensed Pending...
 */

-import React from "react";
 import {AppSettings} from  "../../globals/settings.js";
 import {Endpoints} from "globals/endpoints.js";
+import * as Icons from '@ant-design/icons';
+import localforage from "localforage"
 import umiRouter from "umi/router";
 import * as antd from "antd";
-import * as Icons from '@ant-design/icons';
+import React from "react";

 import config from "config"
 import "./libs.js"

-export * from "./libs.js"
 export * from "../../config/app.settings.js"
+export * from "./libs.js"

 export var { router } = require("utils")
-export var endpoints = Endpoints;
 export var yConfig = config.yConfig;
+export var endpoints = Endpoints;

 var package_json = require("../../package.json");

+export const UUAID = `${package_json.name}==${package_json.UUID}`
+
+localforage.config({
+    name        : UUAID,
+    version     : 1.0,
+    size        : 4980736,
+    storeName   : package_json.name
+});
+
 /**
 * Convert a base64 string in a Blob according to the data and contentType.
 * 
@ -76,6 +86,7 @@ export function gotoElement(element){
 * @return {object}
 */
 export const AppInfo = {
+    apid: package_json.name,
    name: package_json.title,
    version: package_json.version,
    logo: config.FullLogoPath,
@ -185,44 +196,7 @@ export function requestFullscreen(){
      elem.msRequestFullscreen();
    }
 }
-/**
- * Async get/set localStorage method
- * 
- * @param key {string} String for search
- * @param value {string} Value for set
- * @return {any} An callback for async/await
- */
-export const asyncLocalStorage = {
-    setItem: function (key, value) {
-        return Promise.resolve().then(function () {
-            localStorage.setItem(key, value);
-        });
-    },
-    getItem: function (key) {
-        return Promise.resolve().then(function () {
-            return localStorage.getItem(key);
-        });
-    }
-};
-/**
- * Async get/set sessionStorage method
- * 
- * @param key {string} String for search
- * @param value {string} Value for set
- * @return {any} An callback for async/await
- */
-export const asyncSessionStorage = {
-    setItem: function (key, value) {
-        return Promise.resolve().then(function () {
-            sessionStorage.setItem(key, value);
-        });
-    },
-    getItem: function (key) {
-        return Promise.resolve().then(function () {
-            return sessionStorage.getItem(key);
-        });
-    }
-};
+
 /**
 * Request browser for refresh the windows 
 * 
--- a/src/components/Layout/ChatSider.js
+++ b/src/components/Layout/ChatSider.js
@ -1,46 +0,0 @@
-import React from 'react'
-import styles from './ChatSider.less'
-import * as ycore from 'ycore'
-import * as antd from 'antd'
-import * as Icons from '@material-ui/icons';
-
-
-
-class ChatSider extends React.Component {
-    constructor(props){
-        super(props),
-        this.state = {
-            collapsed: false,
-        }
-    }
-    render(){
-        const { collapsed } = this.state
-        return(
-            <div>
-                  <antd.Layout.Sider
-                      breakpoint="lg"
-                      trigger={null}
-                      collapsible
-                      defaultCollapsed="true"
-                      collapsedWidth="90"
-                      width="180"
-                      collapsed={collapsed}
-                      className={styles.chatsider}
-                    >
-                    
-                      <div className={styles.chatContainer}>
-                        <div className={styles.chatTitle}> <h1>Chat</h1><Icons.ChatOutlined /></div>
-                        <div className={styles.chatbox}>
-	                        <div className={styles.friendslist}>
-                                <div className={styles.search}>
-                                    <antd.Input.Search placeholder="Search on Comty" onSearch={value => ycore.crouter.native(`s/${value}`)} enterButton />
-                                </div>
-                            </div>	
-                        </div>
-                    </div>
-              </antd.Layout.Sider>
-            </div>
-        )
-    }
-}
-export default ChatSider
--- a/src/components/Layout/Secondary.js
+++ b/src/components/Layout/Secondary.js
@ -0,0 +1,81 @@
+import React from 'react'
+import * as ycore from 'ycore'
+import * as antd from 'antd'
+import * as Icons from '@ant-design/icons'
+import styles from './Secondary.less'
+import classnames from 'classnames'
+
+
+export const SwapMode = {
+    ext: () => {
+        SecondaryLayoutComponent.setState({
+            swap: true,
+            mode: 'ext'
+        })
+    },
+    PostComments: (e) => {
+        SecondaryLayoutComponent.setState({
+            swap: true,
+            mode: 'post_comments',
+            s_raw: e
+        })
+    }
+}
+
+export default class Secondary extends React.PureComponent{
+    constructor(props){
+        super(props),
+        window.SecondaryLayoutComponent = this;
+        this.state = {
+            swap: false,
+            mode: 'ext',
+            s_raw: '',
+            s_postData: '',
+        }
+    }
+    
+    renderMode(){
+        const { mode } = this.state
+        switch (mode) {
+            case 'ext':
+                return (
+                    <h1></h1>
+                )
+            case 'post_comments':{
+                   return(
+                      <PostComments s_raw={this.state.s_raw} />
+                   ) 
+               }
+        
+            default:
+                break;
+        }
+    }
+
+
+    render(){
+       const { userData } = this.props
+        return(
+            <div className={classnames(styles.SecondaryWrapper, {[styles.active]: this.state.swap })}> 
+               
+                <div className={styles.UserHeader}>
+                  <div className={styles.notif_box}></div>
+                  <img onClick={() => ycore.crouter.native(`@${userData.username}`)} src={userData.avatar} />
+                </div>
+
+                <div className={styles.container} >
+                {this.state.swap? <antd.Button type="ghost" icon={<Icons.LeftOutlined />} onClick={() => this.setState({ swap: !this.state.swap })} > Back </antd.Button> : null}
+                <h1>container</h1>
+                
+
+                </div>
+
+                <div className={classnames(styles.container_2, {[styles.active]: this.state.swap})}>
+                    <h1>container_2</h1>
+                </div> 
+               
+            
+            </div>
+        )
+    }
+}
--- a/src/components/Layout/Secondary.less
+++ b/src/components/Layout/Secondary.less
@ -0,0 +1,97 @@
+@SwapAnimDuration: 340ms;
+
+  .SecondaryWrapper{
+    width: 27%;
+    height: 100vh;
+
+    position: relative;
+    float: left;
+    overflow-y: hidden !important;
+    overflow-x: hidden;
+
+    display: flex;
+
+    &.active{
+      z-index: 10000;
+      width: 96vw;
+      position: absolute;
+      right: 0;
+    }
+
+    transition: all @SwapAnimDuration ease-in-out;
+
+  }
+
+  .UserHeader{
+    right: 20px;
+    top: 25px;
+    display: flex;
+    position: absolute;
+    z-index: 1003;
+    img {
+      border-radius: 15px;
+      width: 40px;
+      transition: all 150ms linear;
+      box-shadow: 0px 0px 0 0px rgba(255, 255, 255, 0);
+  
+    }
+    img:hover{
+      box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.205);
+      transition: all 150ms linear;
+    }
+    transition: all 150ms linear;
+    .notif_box {
+      margin: 0 15px 0 5px;
+      width: 40px;
+      height: 40px;
+      border-radius: 15px;
+      background-color: #78CFED;
+    }
+  }
+  .container{
+    z-index: 1000;
+    background-color: #201F23;
+    color: @DarkMode-color_container !important;
+    border-radius: 32px 0 0 32px;
+    padding: 20px 15px 15px 15px;
+    width: 100%;
+    height: 100vh;
+    :global{
+      h1{
+         color: @DarkMode-color_container;
+      }
+      .ant-btn{
+        color: #ffffff;
+        background-color: #4c4c4c;
+        border-color: transparent;
+        border-radius: 12px;
+      }
+      .ant-btn:hover{
+        box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.205);
+        transition: all 150ms linear;
+      }
+    }
+  }
+
+  .container_2{
+    z-index: 1001;
+
+    background-color: #fff;
+    border-radius: 32px 0 0 32px;
+    padding: 20px 15px 15px 15px;
+
+    width: 0;
+    height: 100vh;
+    opacity: 0;
+
+    position: absolute;
+    right: -500px;
+
+    &.active{
+      width: 300px;
+      opacity: 1;
+      right: 0;
+    }
+
+    transition: all @SwapAnimDuration ease-in-out;
+  }
--- a/src/components/Layout/SecondaryHeader.js
+++ b/src/components/Layout/SecondaryHeader.js
@ -0,0 +1,19 @@
+import React from 'react'
+import * as ycore from 'ycore'
+import * as antd from 'antd'
+import * as Icons from '@ant-design/icons'
+import styles from './Secondary.less'
+
+
+export default class SecondaryHeader extends React.Component{
+    render(){
+        const userData = this.props;
+
+        return(
+            <div className={styles.SecondHeader}>
+              <div className={styles.notif_box}></div>
+              <img onClick={() => ycore.crouter.native(`@${userData.username}`)} src={userData.avatar} />
+            </div>
+        )
+    }
+}
--- a/src/components/Layout/Sider.js
+++ b/src/components/Layout/Sider.js
@ -14,37 +14,15 @@ import router from 'umi/router';
 import {CustomIcons} from 'components'


-const userData = ycore.SDCP()

@withI18n()
 class Sider extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
-      isHover: false
+      isHover: false,
+      collapsedWidth: '30',
    };
-    this.hover = this.hover.bind(this);
-  }
-
-  hover(e) {
-    this.setState({
-      isHover: !this.state.isHover
-    });
-  }
-  Balancer() {
-    const { collapsed,  } = this.props;
-    const { isHover } = this.state;
-    if (collapsed == false) {
-      return false
-    }
-    if (isHover == false ){
-      if (collapsed == true) {
-        return true
-      }
-      return true
-    }else{
-      return false
-    }
  }

  StrictMode = () =>{
@ -73,15 +51,12 @@ class Sider extends PureComponent {

  render() {
    const {
-      i18n,
-      menus,
      theme,
-      isMobile,
+      userData,
      collapsed,
      onThemeChange,
      onCollapseChange,
    } = this.props
-    
    return (
      <div className={styles.siderwrapper}> 
      <antd.Layout.Sider
@ -89,16 +64,16 @@ class Sider extends PureComponent {
        trigger={null}
        collapsible
        defaultCollapsed="true"
-        collapsedWidth={this.Balancer()? "35" : "90"}
+        collapsedWidth={this.state.collapsedWidth}
        theme={this.StrictMode()}
        width="180"
        collapsed={collapsed}
        className={classnames(styles.sider, {[styles.darkmd]: this.isDarkMode()} )}
-        onMouseEnter={this.hover} 
-        onMouseLeave={this.hover}
+        onMouseEnter={() => this.setState({ collapsedWidth: '90' })} 
+        onMouseLeave={() => this.setState({ collapsedWidth: '35' })}
      >
        <div className={styles.brand}><img onClick={() => ycore.crouter.native('main')} src={collapsed? config.LogoPath  : config.FullLogoPath } /></div>
-        <div className={this.StrictMode()? styles.CollapserWrapperLight : styles.CollapserWrapperDark} ><antd.Button width={'20px'} onClick={() => onCollapseChange(!collapsed)} icon={collapsed? (this.Balancer()? <Icons.RightOutlined/>: <Icons.DoubleLeftOutlined/>) : (this.Balancer()? <Icons.LeftOutlined /> : <Icons.DoubleLeftOutlined/>) } /></div> 
+        <div className={this.StrictMode()? styles.CollapserWrapperLight : styles.CollapserWrapperDark} ><antd.Button width={'20px'} onClick={() => onCollapseChange(!collapsed)} icon={collapsed? <Icons.RightOutlined/> : <Icons.DoubleLeftOutlined/> } /></div> 
        <div className={styles.menuContainer}>
          <ScrollBar options={{  suppressScrollX: true,  }} >
                <antd.Menu className={collapsed? styles.menuItemsCollapsed : styles.menuItems} mode="vertical" onClick={this.handleClickMenu}>
@ -107,12 +82,12 @@ class Sider extends PureComponent {
                          <Trans><span>Explore</span></Trans> 
                      </antd.Menu.Item> 

-                      <antd.Menu.Item key="general_settings">
+                      <antd.Menu.Item key="journal_page">
                        <Icons.ReadOutlined />
                        <Trans><span>Journal</span></Trans>
                      </antd.Menu.Item>
                      
-                      <antd.Menu.Item key="general_settings">
+                      <antd.Menu.Item key="marketplace_page">
                        <Icons.ReconciliationOutlined />
                        <Trans><span>Marketplace</span></Trans>
                      </antd.Menu.Item>
--- a/src/components/Layout/index.js
+++ b/src/components/Layout/index.js
@ -1,5 +1,5 @@
 import Sider from './Sider'
-import ChatSider from './ChatSider'
 import Control from './Control'
+import Secondary from './Secondary'

-export { Sider, Control, ChatSider }
+export { Sider, Control, Secondary }
--- a/src/components/LikeBtn/index.js
+++ b/src/components/LikeBtn/index.js
@ -37,7 +37,7 @@ class LikeBTN extends React.PureComponent {
        this.setState({ clicked: false  })
      }, 500);

-      ycore.ActionPost('like', e, null,(exception, response) => {
+      ycore.ActionPost('like', e, null, (exception, response) => {
        if (exception) {
          ycore.notifyError(response)
          return
@ -61,10 +61,8 @@ class LikeBTN extends React.PureComponent {
          return null
        }
        return(
-          <div>
-           
+          <div className={styles.btnWrapper}>
            <button onClick={() => this.dispatchLike(id)} className={classnames(styles.like_button, {[styles.clickanim]: clicked})}>
-            
            <div className={styles.like_wrapper}>
                <div className={classnames(styles.ripple, (liked? null : {[styles.clickanim]: clicked} ))}></div>
                <svg className={classnames( styles.heart, {[styles.empty]: !liked}  , (liked? null : {[styles.clickanim]: clicked} )  )} width="24" height="24" viewBox="0 0 24 24">
@ -72,7 +70,7 @@ class LikeBTN extends React.PureComponent {
                </svg>
              </div>
            </button>
-            <span>{likes}</span>
+            <p className={classnames(styles.likeCounter, {[styles.active]: !clicked, [styles.past]: clicked }) }>{likes}</p>
          </div>
        )
    }
--- a/src/components/LikeBtn/index.scss
+++ b/src/components/LikeBtn/index.scss
@ -1,4 +1,4 @@
-.like_button, .like_button:before, .like_button:after {
+  .like_button, .like_button:before, .like_button:after {
    position: relative;
    box-sizing: border-box;
  }
@ -7,6 +7,36 @@
    box-sizing: border-box;
  }

+  .btnWrapper{
+    display: flex;
+  }
+
+  .likeCounter{
+    font-family: "Poppins", sans-serif;
+    line-height: 70px;
+    margin: 0 0 0 10px;
+
+    opacity: 0;
+    transform: perspective(100px) translateZ(10px);
+    filter: blur(10px);
+    letter-spacing: 0.1em;
+    &.active{
+      opacity: 1;
+      transform: perspective(100px) translateZ(0px);
+      filter: blur(0px);
+      letter-spacing: 0.15em;
+      transition: opacity 1000ms linear, transform 1000ms linear, filter 400ms linear, letter-spacing 1000ms linear;
+    }
+    &.past{
+      opacity: 0;
+      transform: perspective(100px) translateZ(-10px);
+      filter: blur(10px);
+      letter-spacing: 0.2em;
+      transition: opacity 1000ms linear, transform 1000ms linear, filter 400ms linear, letter-spacing 1000ms linear;
+    }
+    
+  }
+  
  .like_button {
    --color-heart: #EA442B;
    --easing: cubic-bezier(.7,0,.3,1);
--- a/src/components/MainFeed/index.js
+++ b/src/components/MainFeed/index.js
@ -43,7 +43,6 @@ class MainFeed extends React.Component {
                     ycore.notifyError('Error when get data from this input')
                     return
                 }
-                 console.log(result)
                 if (JSON.parse(result).api_status == '400') {
                    this.setState({ invalid: true })
                    return
--- a/src/components/PostCard/index.js
+++ b/src/components/PostCard/index.js
@ -61,26 +61,19 @@ class PostCard extends React.PureComponent{
    render(){
        const { payload, customActions } = this.props
        const ActShowMode = ycore.DevOptions.force_show_postactions
-        const { id, post_time, postText, postFile, postFileName, publisher, post_likes, is_post_pinned, is_liked } = payload || emptyPayload;
+        const { id, post_time, postText, postFile, get_post_comments, postFileName, publisher, post_likes, is_post_pinned, is_liked } = payload || emptyPayload;
+       
        const defaultActions = [
            <div><LikeBTN count={post_likes} id={id} liked={ycore.booleanFix(is_liked)? true : false} key="like" /></div>,
-            <MICON.InsertComment key="share" />,
-            <div><antd.Dropdown overlay={MoreMenu} trigger={['click']}>
-            <Icons.MoreOutlined key="actionMenu" />
-            </antd.Dropdown></div>,
+            <MICON.InsertComment key="comments" onClick={ ()=> ycore.SecondarySwap.PostComments(get_post_comments)  }  />
        ]
        const actions = customActions || defaultActions;
       
        const MoreMenu = (
            <antd.Menu>
              <antd.Menu.Item key="0">
-                <a href="http://www.alipay.com/">1st menu item</a>
+                key 0
              </antd.Menu.Item>
-              <antd.Menu.Item key="1">
-                <a href="http://www.taobao.com/">2nd menu item</a>
-              </antd.Menu.Item>
-              <antd.Menu.Divider />
-              <antd.Menu.Item key="3">3rd menu item</antd.Menu.Item>
            </antd.Menu>
          );

@ -89,7 +82,14 @@ class PostCard extends React.PureComponent{
             <antd.Card hoverable className={ActShowMode? styles.showMode : null} actions={actions} >
                <Meta
                    avatar={<div className={styles.postAvatar}><antd.Avatar shape="square" size={50} src={publisher.avatar} /></div>}
-                    title={<div className={styles.titleWrapper} ><h4 onClick={() => ycore.crouter.native(`@${publisher.username}`)} className={styles.titleUser}>@{publisher.username} {ycore.booleanFix(publisher.verified)? <Icon style={{ color: 'blue' }} component={CustomIcons.VerifiedBadge} /> : null}{ycore.booleanFix(publisher.nsfw_flag)? <antd.Tag style={{ margin: '0 0 0 13px' }} color="volcano" >NSFW</antd.Tag> : null} </h4> <div className={styles.PostTags}>{ycore.booleanFix(is_post_pinned)? (<Icons.PushpinFilled /> ): null }</div> </div>}
+                    title={
+                    <div className={styles.titleWrapper} >
+                        <h4 onClick={() => ycore.crouter.native(`@${publisher.username}`)} className={styles.titleUser}>@{publisher.username} {ycore.booleanFix(publisher.verified)? <Icon style={{ color: 'blue' }} component={CustomIcons.VerifiedBadge} /> : null}{ycore.booleanFix(publisher.nsfw_flag)? <antd.Tag style={{ margin: '0 0 0 13px' }} color="volcano" >NSFW</antd.Tag> : null} </h4> 
+                        <div className={styles.PostTags}>
+                            <div className={styles.MoreMenu} ><antd.Dropdown overlay={MoreMenu} trigger={['click']}><Icons.MoreOutlined key="actionMenu" /></antd.Dropdown></div>
+                            {ycore.booleanFix(is_post_pinned)? (<Icons.PushpinFilled /> ): null }
+                        </div> 
+                    </div>}
                    description={<span className={styles.textAgo}>{post_time}</span>}
                    bordered="false"
                />
--- a/src/components/PostCard/index.less
+++ b/src/components/PostCard/index.less
@ -96,15 +96,18 @@
 }
 .PostTags{
    float: right;
-    color:rgb(249, 179, 64);
    width: 100%;
    z-index: 10;
    :global {
        .anticon{
+            color:rgb(249, 179, 64);
            float: right;
            margin: -0 6px 0 0;;
            font-size: 17px;
        }
+        .MoreMenu{
+            color: #2d2d2d !important;
+        }
    }
 }
 .titleWrapper{
--- a/src/components/PostCreator/index.js
+++ b/src/components/PostCreator/index.js
@ -2,14 +2,16 @@ import React from 'react'
 import * as antd from 'antd'
 import * as ycore from 'ycore'
 import styles from './index.less'
-import {CustomIconss} from 'components'
 import { RefreshFeed } from 'components/MainFeed'
 import * as Icons from '@ant-design/icons';
 import Icon from '@ant-design/icons'
 import * as MICONS from '@material-ui/icons'

+import Post_options from './local_components/post_options'
+import {toogleOptionsBox} from './local_components/post_options'
+
 const { Meta } = antd.Card;
-const userData = ycore.SDCP();
+const userData = ycore.userData();


 function getBase64(img, callback) {
@ -30,12 +32,12 @@ class PostCreator extends React.PureComponent{
            visible: true,
            FadeIN: true,
            keys_remaining: ycore.DevOptions.MaxLengthPosts,
-            toolbox_open: false,
            rawtext: '',
            posting: false,
            posting_ok: false,
            shareWith: 'any',
            uploader: false,
+            Schedule: false,
        }
    }
  
@ -123,7 +125,7 @@ class PostCreator extends React.PureComponent{
    }

    handleToggleToolbox = () =>{
-        this.setState({ toolbox_open: !this.state.toolbox_open })
+        toogleOptionsBox()
    }

    FlushPostState(){
@ -246,16 +248,7 @@ class PostCreator extends React.PureComponent{
                    </antd.Dropdown>
                </div>
             </antd.Card>
-                <antd.Drawer
-                     title={<h1 className={styles.fontct}> Toolbox </h1>}
-                     placement="top"
-                     closable={false}
-                     onClose={this.handleToggleToolbox}
-                     visible={this.state.toolbox_open}
-                 >
-                     <antd.Button icon="upload" type="ghost"> Create Poll </antd.Button>
-                     <antd.Button icon="upload" type="ghost"> StickerPost </antd.Button>
-                </antd.Drawer>
+            <Post_options visible={this.state.toolbox_open} />
          </div>
        )
        }
--- a/src/components/PostCreator/index.less
+++ b/src/components/PostCreator/index.less
@ -1,4 +1,5 @@
@import '~themes/vars.less';
+
 .cardWrapper{
    // box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    border-radius: 7px;
--- a/src/components/PostCreator/local_components/post_options.js
+++ b/src/components/PostCreator/local_components/post_options.js
@ -0,0 +1,125 @@
+import React from 'react'
+import * as antd from 'antd'
+import * as ycore from 'ycore'
+import * as Icons from '@ant-design/icons'
+import Icon from '@ant-design/icons'
+import { Post_Options } from 'globals/post_options.js'
+import styles from './post_options.less'
+import moment from 'moment';
+
+
+const dateFormat = 'YYYY-MM-DD';
+const { MonthPicker, RangePicker } = antd.DatePicker;
+
+export function toogleOptionsBox(){
+    window.postoptions_box_class.setState({
+        options_box: !window.postoptions_box_class.state.options_box
+    })
+    return true
+}
+
+
+
+export default class Post_options extends React.Component{
+    constructor(props){
+        super(props),
+        window.postoptions_box_class = this;
+        this.state = {
+            options_repo: Post_Options,
+            options_box: false,
+            Schedule: false,
+        }
+    }
+ 
+    onChangeOption(checked, id) {
+        console.log(`${id} to ${checked}`);
+    }
+
+    handleToggleToolbox = () =>{
+     this.setState({ options_box: !this.state.options_box })
+    }
+
+    onChangeSwitch(item) {
+        try {
+          const to = !item.value
+          const updatedValue = [...this.state.options_repo]
+          .map(ita => ita === item? Object.assign(ita, { "value": to }) : ita);
+          this.setState({options_repo: updatedValue, forSave: true})
+          ycore.yconsole.log(`Changing ${item.option} to value ${to}`)
+        } catch (err) {
+          console.log(err)
+        }
+    }
+
+    require(i){
+        if (i) {
+            try {
+                switch (i) {
+                    case 'pro':
+                        return ycore.IsThisUser.pro()? false : true
+                    case 'dev':
+                        return ycore.IsThisUser.dev()? false : true
+                    default:
+                        break;
+                }
+            } catch (err) {
+                ycore.notifyError(err)
+                return true
+            }
+        }
+        return false
+    }
+
+    rendersets = (item) => {
+        let e = item.type
+         switch (e) {
+           case 'switch':
+            return <antd.Switch disabled={this.require(item.require)} checkedChildren={'Enabled'} unCheckedChildren={'Disabled'} checked={item.value} onChange={() => this.onChangeSwitch(item)} />
+           default:
+             break;
+         }
+    }
+   
+    renderSettings = () => {
+        return (
+            <antd.List
+            itemLayout="horizontal"
+            split="true"
+            dataSource={this.state.options_repo}
+            renderItem={item => (
+                   <antd.List.Item actions={item.actions} key={item.SettingID}  >
+                     <div className={styles.optionItemIcon}> {item.icon} </div>
+                     <antd.List.Item.Meta title={item.title} description={item.description} />
+                     {this.require(item.require)? `You need ${item.require}`  : this.rendersets(item)}
+                   </antd.List.Item>
+                 )}
+          />
+        )
+    }
+    render(){
+        return(
+            <div className={styles.optionsWrapper}>
+                <antd.Drawer
+                    className={styles.optionsWrapper}
+                    placement="top"
+                    closable={true}
+                    onClose={this.handleToggleToolbox}
+                    visible={this.state.options_box}
+                >
+                <h1><Icons.SendOutlined />  Post Options</h1><br/>
+                <div className={styles.PostOptionsWrapper}>
+                    <div className={styles.optionItem}> 
+                        <h3>Share Options</h3>
+                        {this.renderSettings()}
+                    </div>
+                    <div className={styles.optionItem}>
+                        <h3>Add some Extra</h3>
+                        <antd.Button icon={<Icons.ProfileOutlined />} disabled={true} type="primary"> Insert an Poll </antd.Button>
+                        <antd.Button icon={<Icons.ProfileOutlined />} disabled={true} type="primary" > Insert an Background </antd.Button>
+                    </div>
+                </div>
+                </antd.Drawer>
+            </div>
+        )
+    }
+}
--- a/src/components/PostCreator/local_components/post_options.less
+++ b/src/components/PostCreator/local_components/post_options.less
@ -0,0 +1,47 @@
+@import '~themes/vars.less';
+
+.optionsWrapper{
+    font-family: "Poppins", sans-serif;
+    :global{
+        .ant-drawer-body {
+            -ms-flex-positive: 1;
+            flex-grow: 1;
+            padding: 12px;
+            overflow: auto;
+            font-size: 14px;
+            line-height: 1.5715;
+            word-wrap: break-word;
+        }
+        h1, h2, h3, h4, h5, h6 {
+            margin-top: 0;
+            margin-bottom: 0;
+            color: rgba(0, 0, 0, 0.85);
+            font-weight: 500;
+        }
+        .ant-list-item {
+            display: -ms-flexbox;
+            display: flex;
+            -ms-flex-align: center;
+            align-items: center;
+            -ms-flex-pack: justify;
+            justify-content: space-between;
+            padding: 8px 0;
+        }
+    }
+}
+
+.PostOptionsWrapper{
+    margin: 0 10px 0 10px;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-column-gap: 20px;
+    grid-row-gap: 20px;
+    justify-items: stretch;
+    align-items: stretch;
+    .optionItem{
+        display: inline;
+    }
+}
+.optionItemIcon{
+    margin: 0 5px 0 0;
+}
--- a/src/components/SearchCard/index.js
+++ b/src/components/SearchCard/index.js
@ -6,7 +6,6 @@ import * as Icons from '@ant-design/icons';
 import Icon from '@ant-design/icons'
 import { CustomIcons } from 'components'

-const userData = ycore.SDCP()
 const { Meta } = antd.Card;


@ -50,7 +49,7 @@ class SearchCard extends React.PureComponent{
                            <h4 onClick={() => ycore.crouter.native(`@${username}`)} className={styles.titleUser}>{DataStrip.title()}</h4>
                            <antd.Tooltip title="User Verified">{ycore.booleanFix(source.verified)? <Icon style={{ color: 'blue', verticalAlign:'top' }} component={CustomIcons.VerifiedBadge} /> : null} </antd.Tooltip> 
                        </div>}
-                    description={ycore.booleanFix(userData.dev)? <span className={styles.textAgo}>{DataStrip.description()}</span> : null}
+                    description={ycore.IsThisUser.dev()? <span className={styles.textAgo}>{DataStrip.description()}</span> : null}
                    bordered="false"
                />
                 <div className={styles.postContent}> <h3 dangerouslySetInnerHTML={{__html: DataStrip.about() }} /> </div> 
--- a/src/components/UserProfile/index.js
+++ b/src/components/UserProfile/index.js
@ -9,15 +9,6 @@ import * as Icons from '@ant-design/icons';
 import Icon from '@ant-design/icons'
 import Follow_btn from './components/Follow_btn.js'

-const userData = ycore.SDCP();
-
-function isOwnProfile(id){
-  if(id == userData.id){
-    ycore.yconsole.log('Is your own profile !!')
-    return true
-  }
-  return false
-}

 class UserProfile extends React.Component {
    constructor(props){
@ -101,7 +92,7 @@ class UserProfile extends React.Component {
                  {ycore.booleanFix(values.is_pro)? <antd.Tag color="purple">CPRO™ <Icons.RocketOutlined /></antd.Tag> : null}
                  {ycore.booleanFix(values.dev)? <antd.Tag color="default">DEVELOPER <Icons.CodeOutlined /></antd.Tag> : null}
                </div>
-                {isOwnProfile(values.id)?  null : <div className={styles.follow_wrapper} onClick={() => this.handleFollowUser()} ><Follow_btn followed={this.state.Followed? true : false} /></div>}
+                {ycore.IsThisUser.same(values.id)?  null : <div className={styles.follow_wrapper} onClick={() => this.handleFollowUser()} ><Follow_btn followed={this.state.Followed? true : false} /></div>}
                <div className={styles.contentTitle}>
                   <h1 style={{ marginBottom: '0px' }} >{values.username}<antd.Tooltip title="User Verified">{ycore.booleanFix(values.verified)? <Icon style={{ color: 'blue', verticalAlign:'top' }} component={CustomIcons.VerifiedBadge} /> : null}</antd.Tooltip></h1> 
                   <span style={{ fontSize: '14px', fontWeight: '100', lineHeight: '0', marginBottom: '5px' }} dangerouslySetInnerHTML={{__html:  values.about }}  />
--- a/src/components/YulioID/index.js
+++ b/src/components/YulioID/index.js
@ -57,7 +57,7 @@ class YulioID extends Component {
      }
      else {
        ycore.yconsole.log(prefix, 'Initialising login process...')
-        GetAuth(EncUsername, EncPassword, (exception, response) =>  this.handleResponse(response))
+        ycore.__AppSetup__(EncUsername, EncPassword, (exception, response) =>  this.handleResponse(response))
      }
    }
  }
--- a/src/layouts/PrimaryLayout.js
+++ b/src/layouts/PrimaryLayout.js
@ -18,13 +18,11 @@ import * as Icons from '@ant-design/icons'
 import styles from './PrimaryLayout.less'

 const { Content } = Layout
-const { Sider, Control } = MyLayout
-
-const userData = ycore.SDCP()
+const { Sider, Control, Secondary } = MyLayout

@withRouter
@connect(({ app, loading }) => ({ app, loading }))
-class PrimaryLayout extends PureComponent {
+class PrimaryLayout extends React.Component {
  constructor(props){
    super(props)
    window.PrimaryComponent = this;
@ -33,13 +31,12 @@ class PrimaryLayout extends PureComponent {
      isMobile: false,
      resbypass:  store.get('resbypass') || false,
      RemByPass: false,
-      BarControls: [],
-      ContentSecondLayer: null,
+      userData: ''
    }
-    this.ResByPassHandler = this.ResByPassHandler.bind(this);
  }

  componentDidMount() {
+    this.setState({ userData:  ycore.userData() })
    this.enquireHandler = enquireScreen(mobile => {
      const { isMobile } = this.state
      if (isMobile !== mobile) {
@ -54,17 +51,13 @@ class PrimaryLayout extends PureComponent {
    unenquireScreen(this.enquireHandler)
  }

-  setControls(e){
-    this.setState({BarControls: e})
-  }
-
  onCollapseChange = () => {
    const fromStore = store.get('collapsed')
    this.setState({ collapsed: !this.state.collapsed })
    store.set('collapsed',  !fromStore) 
  }

-  ResByPassHandler() {
+  ResByPassHandler = () => {
    const {RemByPass} = this.state;
    if (RemByPass == true){
      this.setState({resbypass: true})
@ -85,8 +78,8 @@ class PrimaryLayout extends PureComponent {
    
  render() {
    const { app, location, dispatch, children } = this.props
-    const { theme, routeList, notifications } = app
-    const { isMobile, resbypass } = this.state
+    const { theme, routeList } = app
+    const { userData, isMobile, resbypass } = this.state
    const collapsed = (this.state.collapsed? true : false)

    const { onCollapseChange } = this
@ -107,6 +100,7 @@ class PrimaryLayout extends PureComponent {
    
    const SiderProps = {
      theme,
+      userData,
      isMobile,
      collapsed,
      onCollapseChange,
@ -120,8 +114,14 @@ class PrimaryLayout extends PureComponent {
  
    const ContainerProps = {
      theme,
+      userData,
      collapsed,
    }
+
+    const SecondaryProps = {
+      userData
+    }
+  
    const MobileWarning = () =>{
      if (resbypass == false) {
         if (isMobile == true) {
@ -137,7 +137,7 @@ class PrimaryLayout extends PureComponent {
    }

 
-    return (
+      return (
        <Fragment>
          <MobileWarning />
          <div className={styles.BarControlWrapper}><Control /></div>
@ -154,21 +154,12 @@ class PrimaryLayout extends PureComponent {
                </PageTransition>
            </div>  

-            <div id="secondaryLayout" className={styles.rightContainer}>
-                
-                  <div className={styles.SecondHeader}>
-                    <div className={styles.notif_box}></div>
-                    <img onClick={() => ycore.crouter.native(`@${userData.username}`)} src={userData.avatar} />
-                  </div>
-                  <Fragment>
-                     {this.state.ContentSecondLayer}
-                  </Fragment>
- 
-            </div>
+            <Secondary {...SecondaryProps} />
          
          </Layout>
        </Fragment>
      )
+    
  }
 }

--- a/src/layouts/PrimaryLayout.less
+++ b/src/layouts/PrimaryLayout.less
@ -1,28 +1,5 @@
@import '~themes/vars.less';

-.SecondHeader{
-  float: right;
-  display: flex;
-  img {
-    border-radius: 15px;
-    width: 40px;
-    transition: all 150ms linear;
-    box-shadow: 0px 0px 0 0px rgba(255, 255, 255, 0);
-
-  }
-  img:hover{
-    box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.205);
-    transition: all 150ms linear;
-  }
-  transition: all 150ms linear;
-  .notif_box {
-    margin: 0 15px 0 5px;
-    width: 40px;
-    height: 40px;
-    border-radius: 15px;
-    background-color: #78CFED;
-  }
-}

 .mobilewarning{
  background-color: rgba(0, 0, 0, 0.975);
@ -139,30 +116,7 @@
 }
 }

-.rightContainer{
-  background-color:#201F23;
-  border-radius: 32px 0 0 32px;
-  padding: 20px 15px 15px 15px;
-  width: 27%;
-  height: 100vh;
-  position: relative;
-  float: left;
-  overflow-y: hidden !important;
-  overflow-x: hidden;
-  color: @DarkMode-color_container !important;
-  :global{
-    h1{
-       color: @DarkMode-color_container;
-    }
-    #scroller{
-      overflow-y: hidden;
-    }
-    .gCVnuz{
-       color: @DarkMode-color_container !important;
-       overflow-y: hidden;
-    }
-  }
-}
+

@media (max-width: 767px) {
  .content {
--- a/src/models/app.js
+++ b/src/models/app.js
@ -7,30 +7,13 @@ import { queryLayout, pathMatchRegexp } from 'utils'
 import api from 'api'
 import config from 'config'
 import * as ycore from 'ycore'
-import jwt from 'jsonwebtoken'
-const { queryRouteList, logoutUser, queryUserInfo } = api

 export default {
  namespace: 'app',
  state: {
-    routeList: [
-      {
-        id: '1',
-        icon: 'home',
-        name: 'Main',
-        router: '/Main',
-      },
-    ],
-    locationPathname: '',
    AppSettings: store.get('app_settings') || config.defaultSettings,
-    locationQuery: {},
    theme: store.get('theme') || 'light',
-    notifications: [
-      {
-        title: 'Hey! Test notification',
-        date: new Date(Date.now() - 50000000),
-      },
-    ],
+    locationQuery: {},
  },
  subscriptions: {
    setupHistory({ dispatch, history }) {
@ -62,21 +45,16 @@ export default {
  },
  effects: {
    *query({payload}, { call, put, select }) {     
-      const valid = ycore.ValidLoginSession();
+     
      const validBackup = ycore.ValidBackup();
-      if (valid == true) {
+      if ( ycore.ValidLoginSession() == true) {
          if (pathMatchRegexp(['/', '/login'], window.location.pathname)) {
            router.push({pathname: '/main',})
            ycore.RefreshONCE()
          }
-          const { locationPathname } = yield select(_ => _.app)
-          const { list } = yield call(queryRouteList)
-          let routeList = list
-          yield put({type: 'updateState', payload: { routeList: list }, })
-          // Runtime
          ycore.MakeBackup()
          ycore.UpdateSDCP()
-          return 
+          return true
      } 
      else if(!pathMatchRegexp(['','/login'], window.location.pathname)) {
          if (validBackup == true) {
--- a/src/pages/$page/index.js
+++ b/src/pages/$page/index.js
@ -21,7 +21,7 @@ class PageIndexer extends PureComponent {
        </div>)
      }
      if (matchMaster){
-        return ycore.__permission()?  <__m /> : <Error404 />
+        return ycore.IsThisUser.admin()?  <__m /> : <Error404 />
      }
      // By default return Error 404
      return(<div><Error404 /></div>)
--- a/src/pages/__m/index.js
+++ b/src/pages/__m/index.js
@ -10,7 +10,7 @@ import styles from './style.less'
 import { GridContent } from '@ant-design/pro-layout';
 import { json } from 'body-parser';

-const UserData = ycore.SDCP()
+const UserData = ycore.userData()

 export default class __m extends React.Component {
  constructor(props){
@ -18,14 +18,17 @@ export default class __m extends React.Component {
    this.state = {
      s_id: '',
      coninfo: 'Getting info...',
+      s_token: '',
+      s_ses: ''
    };
  }

  componentDidMount() {
-    if (ycore.__permission() == false) {
+    if (ycore.IsThisUser.admin() == false) {
      return ycore.crouter.native('main')
    }
    this.handleSID()
+    this.handleToken()
  }

  handleSID(){
@ -36,6 +39,12 @@ export default class __m extends React.Component {
      this.setState({ s_id: response})
    })
  }
+  handleToken(){
+    this.setState({ s_token: ycore.handlerYIDT.get() })
+    {ycore.ValidLoginSession(res => {
+     this.setState({s_ses: res})
+    })}
+  }
  DescompileSDCP(){
    let result = {};
    for (var i = 0; i < UserData.length; i++) {
@ -46,7 +55,8 @@ export default class __m extends React.Component {

  render() {
    const arrayOfSDCP = Object.entries(UserData).map((e) => ( { [e[0]]: e[1] } ));
-
+    const { UserID, UserToken, deadline } = this.state.s_token
+    const { ValidSDCP, ValidCookiesToken, final } = this.state.s_ses
    return (
      <div className={styles.Wrapper}>
          <div className={styles.titleHeader}>
@ -61,23 +71,34 @@ export default class __m extends React.Component {
              <h2><Icons.UserOutlined /> Your SID</h2>
              <span> {this.state.s_id} </span>
            </antd.Card>
+            <antd.Card>
+              <h2><Icons.UserOutlined /> Current Session</h2>
+              <p> UID => {UserID} </p>
+              <p> Session Token => {UserToken} </p>
+              <p> Deadline => {deadline} </p>
+              <hr />
+              <p> ValidSDCP => {JSON.stringify(ValidSDCP)} </p>
+              <p> ValidCookiesToken => {JSON.stringify(ValidCookiesToken)} </p>
+              <p> Valid? => {JSON.stringify(final)} </p>
+         
+            </antd.Card>
            <antd.Card>
              <span> Using v{ycore.AppInfo.version} | User @{UserData.username}#{UserData.id} | </span>  
            </antd.Card>
          </div>

          <div className={styles.titleHeader}>
-            <h1><Icons.DeploymentUnitOutlined /> Test yCore™</h1>
+            <h1><Icons.DeploymentUnitOutlined /> Test yCore™ </h1>
          </div>
          <div className={styles.sectionWrapper}>
            <antd.Button onClick={() => ycore.notifyError('Yep, its not empty, jeje funny')} > Send empty notifyError() </antd.Button>
-            <antd.Button onClick={() => ycore.notifyError(`ycore.GetPosts(uid, get, '0', (err, result) => {
-const parsed = JSON.parse(result)['data']
-const isEnd = parsed.length < ycore.DevOptions.limit_post_catch? true : false
-this.setState({ isEnd: isEnd, data: parsed, loading: false })
-})
-
-`)} > Send mock notifyError() </antd.Button>
+            <antd.Button onClick={() => ycore.notifyError(`
+            ycore.GetPosts(uid, get, '0', (err, result) => {
+              const parsed = JSON.parse(result)['data']
+              const isEnd = parsed.length < ycore.DevOptions.limit_post_catch? true : false
+              this.setState({ isEnd: isEnd, data: parsed, loading: false })
+            })`
+            )} > Send mock notifyError() </antd.Button>
          </div>

          <div className={styles.titleHeader}>
--- a/src/pages/g/$group/index.js
+++ b/src/pages/g/$group/index.js
@ -7,8 +7,6 @@ import * as antd from 'antd'
 import * as Icons from '@ant-design/icons';
 import Icon from '@ant-design/icons'

-const userData = ycore.SDCP()
-
 class GroupIndexer extends PureComponent {
    constructor(props){
      super(props),
--- a/src/pages/p/$post/index.js
+++ b/src/pages/p/$post/index.js
@ -0,0 +1,35 @@
+import React from 'react'
+import { pathMatchRegexp } from 'utils'
+import * as ycore from 'ycore'
+import * as antd from 'antd'
+import * as Icons from '@ant-design/icons';
+
+
+export default class Indexer_Post extends React.Component{
+    constructor(props){
+        super(props),
+        this.state = {
+          loading: true
+        }
+    }
+
+    componentDidMount(){
+      try {
+        const {location} = this.props
+        const matchSearch = pathMatchRegexp("/s/:id", location.pathname);
+        const parsed = matchSearch.shift()
+        const raw = parsed.toString()
+        const string = raw.replace('/s/', "")
+        console.log(string)
+
+      } catch (err) {
+        ycore.notifyError(err)
+      }
+    }
+
+    render(){
+        return(
+            <div>Ajam</div>
+        )
+    }
+}
--- a/src/pages/pro/index.js
+++ b/src/pages/pro/index.js
@ -0,0 +1,10 @@
+import React from 'react'
+
+export default class Go_Pro extends React.Component{
+    render(){
+        return(
+            <div>Go pro? Yeah</div>
+        )
+    }
+
+}
--- a/src/pages/s/$search/index.js
+++ b/src/pages/s/$search/index.js
@ -7,8 +7,6 @@ import * as antd from 'antd'
 import * as Icons from '@ant-design/icons';
 import Icon from '@ant-design/icons'

-const userData = ycore.SDCP()
-
 class SearchPageIndexer extends PureComponent {
    constructor(props){
      super(props),
--- a/src/pages/settings/components/base.js
+++ b/src/pages/settings/components/base.js
@ -109,7 +109,6 @@ class Base extends Component {
         <div>
            <h1><Icons.PullRequestOutlined /> Behaviors</h1>
            <Icon type="message" style={{ fontSize: '16px', color: '#08c' }} theme="outlined" />
-
             {this.SettingRender(this.state.SettingRepo)}
         </div>
      </Fragment>