npm - @messenger-box/platform-browser - Versions diffs - 0.0.1-alpha.18 → 0.0.1-alpha.27 - Mend

@messenger-box/platform-browser 0.0.1-alpha.18 → 0.0.1-alpha.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (18) hide show

package/CHANGELOG.md +32 -0
package/lib/components/messenger/avatar/index.d.ts +3 -2
package/lib/components/messenger/avatar/style.d.ts +6 -2
package/lib/components/messenger/mock.d.ts +3 -0
package/lib/components/messenger/style.d.ts +11 -0
package/lib/components/messenger/types/message.d.ts +1 -0
package/lib/index.js +109 -24
package/lib/index.js.map +1 -1
package/package.json +3 -3
package/src/components/messenger/avatar/index.tsx +12 -7
package/src/components/messenger/avatar/style.ts +6 -2
package/src/components/messenger/index.tsx +14 -8
package/src/components/messenger/messagesList/index.tsx +24 -7
package/src/components/messenger/mock.ts +20 -0
package/src/components/messenger/style.ts +12 -1
package/src/components/messenger/types/message.ts +1 -0
package/src/components/messenger/utils/utils.ts +5 -0
package/src/compute.tsx +1 -1

package/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,38 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+## [0.0.1-alpha.27](https://github.com/cdmbase/messenger-box/compare/v0.0.1-alpha.26...v0.0.1-alpha.27) (2021-10-11)
+**Note:** Version bump only for package @messenger-box/platform-browser
+## [0.0.1-alpha.24](https://github.com/cdmbase/messenger-box/compare/v0.0.1-alpha.23...v0.0.1-alpha.24) (2021-10-10)
+**Note:** Version bump only for package @messenger-box/platform-browser
+## [0.0.1-alpha.23](https://github.com/cdmbase/messenger-box/compare/v0.0.1-alpha.22...v0.0.1-alpha.23) (2021-10-08)
+**Note:** Version bump only for package @messenger-box/platform-browser
+## [0.0.1-alpha.20](https://github.com/cdmbase/messenger-box/compare/v0.0.1-alpha.19...v0.0.1-alpha.20) (2021-10-07)
+**Note:** Version bump only for package @messenger-box/platform-browser
 ## [0.0.1-alpha.18](https://github.com/cdmbase/messenger-box/compare/v0.0.1-alpha.17...v0.0.1-alpha.18) (2021-10-06)
 **Note:** Version bump only for package @messenger-box/platform-browser

package/lib/components/messenger/avatar/index.d.ts CHANGED Viewed

@@ -3,7 +3,8 @@ declare type IProps = {
     text?: string;
     url?: string | any;
     size?: IAvatarSize;
-    username?: string;
+    username: string;
+    time: any;
 };
-export declare const Avatar: ({ url, size, text, username }: IProps) => JSX.Element;
+export declare const Avatar: ({ url, size, text, username, time }: IProps) => JSX.Element;
 export {};

package/lib/components/messenger/avatar/style.d.ts CHANGED Viewed

@@ -67,11 +67,15 @@ export declare const styleSheet: {
             content: string;
         };
         '& .username': {
-            marginBottom: string;
+            display: string;
             marginLeft: string;
         };
+        '& .username a': {
+            color: string;
+            textDecoration: string;
+        };
         '& .username p': {
-            marginBottom: string;
+            marginTop: string;
             marginLeft: string;
         };
     };

package/lib/components/messenger/mock.d.ts CHANGED Viewed

@@ -2,6 +2,8 @@ export declare const messagesData: {
     id: number;
     loginUser: boolean;
     message: string;
+    time: string;
+    timeIsToday: boolean;
 }[];
 export declare const userProfile: {
     displayName: string;
@@ -11,6 +13,7 @@ export declare const userProfile: {
     };
     isShared: boolean;
     disablePopover: boolean;
+    url: string;
     displayUsername: boolean;
     hasMention: boolean;
     hideStatus: boolean;

package/lib/components/messenger/style.d.ts CHANGED Viewed

@@ -6,5 +6,16 @@ export declare const styleSheet: {
             bottom: string;
             width: string;
         };
+        '& .icon': {
+            position: string;
+            top: string;
+            right: string;
+        };
+        '& .icon .anticon': {
+            marginRight: string;
+        };
+        '& .icon .anticon svg path': {
+            fill: string;
+        };
     };
 };

package/lib/components/messenger/types/message.d.ts CHANGED Viewed

@@ -2,4 +2,5 @@ export interface IMessageList {
     id: number;
     loginUser: boolean;
     message: string;
+    timeIsToday: boolean;
 }

package/lib/index.js CHANGED Viewed

@@ -96,27 +96,48 @@ module.exports =
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Avatar = void 0;
-const react_1 = __importDefault(__webpack_require__(/*! react */ "react"));
+const React = __importStar(__webpack_require__(/*! react */ "react"));
 const classnames_1 = __importDefault(__webpack_require__(/*! classnames */ "classnames"));
 const react_fela_1 = __webpack_require__(/*! react-fela */ "react-fela");
 const style_1 = __webpack_require__(/*! ./style */ "./src/components/messenger/avatar/style.ts");
-exports.Avatar = ({ url, size = 'md', text, username }) => {
+exports.Avatar = ({ url, size = 'md', text, username, time }) => {
     const { css } = react_fela_1.useFela();
     const classes = classnames_1.default(`Avatar Avatar-${size}`);
     if (text) {
-        return (react_1.default.createElement("div", { className: css(style_1.styleSheet.avatarStyles) },
-            react_1.default.createElement("div", { className: classes + ` Avatar-plain`, "data-content": text })));
+        return (React.createElement("div", { className: css(style_1.styleSheet.avatarStyles) },
+            React.createElement("div", { className: classes + ` Avatar-plain`, "data-content": text })));
     }
-    return (react_1.default.createElement("div", { className: css(style_1.styleSheet.avatarStyles) },
-        react_1.default.createElement("img", { src: url, className: classes, alt: "" }),
-        react_1.default.createElement("div", { className: "username" },
-            react_1.default.createElement("h4", null, username),
-            react_1.default.createElement("p", null, "6:40"))));
+    return (React.createElement("div", { className: css(style_1.styleSheet.avatarStyles) },
+        React.createElement("a", { href: "" },
+            React.createElement("img", { src: url, className: classes, alt: "" })),
+        React.createElement("div", { className: "username" },
+            React.createElement("a", { href: "" },
+                React.createElement("h4", null, username)),
+            React.createElement("p", null, time))));
 };
@@ -206,11 +227,15 @@ exports.styleSheet = {
             content: 'attr(data-content)',
         },
         '& .username': {
-            marginBottom: '30px',
+            display: 'flex',
             marginLeft: '10px',
         },
+        '& .username a': {
+            color: 'black',
+            textDecoration: 'none'
+        },
         '& .username p': {
-            marginBottom: '30px',
+            marginTop: '8px',
             marginLeft: '10px',
         },
     }),
@@ -253,6 +278,7 @@ const react_1 = __importStar(__webpack_require__(/*! react */ "react"));
 const antd_1 = __webpack_require__(/*! antd */ "antd");
 const index_1 = __webpack_require__(/*! ./messagesList/index */ "./src/components/messenger/messagesList/index.tsx");
 const mock_1 = __webpack_require__(/*! ./mock */ "./src/components/messenger/mock.ts");
+const icons_1 = __webpack_require__(/*! @ant-design/icons */ "@ant-design/icons");
 const react_fela_1 = __webpack_require__(/*! react-fela */ "react-fela");
 const style_1 = __webpack_require__(/*! ./style */ "./src/components/messenger/style.ts");
 exports.MessengerComponent = () => {
@@ -266,6 +292,7 @@ exports.MessengerComponent = () => {
                 id: Math.random(),
                 loginUser: true,
                 message: enterValue,
+                timeIsToday: true,
             },
         ]);
         setEnterValue('');
@@ -276,7 +303,10 @@ exports.MessengerComponent = () => {
                 react_1.default.createElement(antd_1.Col, { md: 24 },
                     react_1.default.createElement(index_1.MessagesList, { userMessagesList: userMessagesList }))),
             react_1.default.createElement(antd_1.Col, { md: 24, className: "message--box-outer" },
-                react_1.default.createElement(antd_1.Input, { value: enterValue, onChange: (e) => { var _a; return setEnterValue((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value); }, onPressEnter: (e) => handleEnterButton(e), placeholder: "Please Enter" })))));
+                react_1.default.createElement(antd_1.Input, { value: enterValue, onChange: (e) => { var _a; return setEnterValue((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value); }, onPressEnter: (e) => handleEnterButton(e), placeholder: "Please Enter" }),
+                react_1.default.createElement("div", { className: "icon" },
+                    react_1.default.createElement(icons_1.PaperClipOutlined, null),
+                    react_1.default.createElement(icons_1.SmileOutlined, null))))));
 };
@@ -298,17 +328,30 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MessagesList = void 0;
 const react_1 = __importDefault(__webpack_require__(/*! react */ "react"));
 const antd_1 = __webpack_require__(/*! antd */ "antd");
+const mock_1 = __webpack_require__(/*! ../mock */ "./src/components/messenger/mock.ts");
 const avatar_1 = __webpack_require__(/*! ../avatar */ "./src/components/messenger/avatar/index.tsx");
 exports.MessagesList = ({ userMessagesList }) => {
+    var time = '10:45 PM';
+    let avatar;
+    {
+        mock_1.userProfile.find((element, index) => {
+            if ((element.displayName == 'ghazimubina')) {
+                avatar = (react_1.default.createElement(avatar_1.Avatar, { url: element.url, username: element.user.username, time: time, size: "lg", key: index }));
+            }
+        });
+    }
     return (react_1.default.createElement(antd_1.Row, { gutter: [24, 6] }, userMessagesList === null || userMessagesList === void 0 ? void 0 : userMessagesList.map((item, index) => {
         if (!item.loginUser) {
-            return (react_1.default.createElement(antd_1.Col, { md: 24, key: index, style: { textAlign: 'right' } },
-                react_1.default.createElement("p", null, item === null || item === void 0 ? void 0 : item.message)));
+            return (react_1.default.createElement(antd_1.Col, { md: 24, key: index },
+                avatar,
+                react_1.default.createElement("p", { style: { marginLeft: '50px' } }, item === null || item === void 0 ? void 0 : item.message),
+                react_1.default.createElement(antd_1.Divider, null, (item === null || item === void 0 ? void 0 : item.timeIsToday) ? 'today' : 'yesterday')));
         }
         else {
             return (react_1.default.createElement(antd_1.Col, { md: 24, key: index },
-                react_1.default.createElement(avatar_1.Avatar, { url: 'https://images.unsplash.com/photo-1503023345310-bd7c1de61c7d?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8aHVtYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80', size: 'lg', username: 'admin' }),
-                react_1.default.createElement("p", null, item === null || item === void 0 ? void 0 : item.message)));
+                avatar,
+                react_1.default.createElement("p", { style: { marginLeft: '50px' } }, item === null || item === void 0 ? void 0 : item.message),
+                react_1.default.createElement(antd_1.Divider, null, (item === null || item === void 0 ? void 0 : item.timeIsToday) ? 'today' : 'yesterday')));
         }
     })));
 };
@@ -332,21 +375,29 @@ exports.messagesData = [
         id: 1,
         loginUser: true,
         message: 'Hello!',
+        time: '10: 45 PM',
+        timeIsToday: false
     },
     {
         id: 2,
         loginUser: false,
         message: 'Hey!',
+        time: '10: 50 PM',
+        timeIsToday: false
     },
     {
         id: 3,
         loginUser: true,
         message: 'How are you!',
+        time: '10: 50 PM',
+        timeIsToday: false
     },
     {
         id: 4,
         loginUser: false,
         message: 'I am fine!',
+        time: '10: 51 PM',
+        timeIsToday: true
     },
 ];
 exports.userProfile = [
@@ -356,6 +407,18 @@ exports.userProfile = [
         user: { username: 'Admin' },
         isShared: true,
         disablePopover: true,
+        url: 'https://images.unsplash.com/photo-1503023345310-bd7c1de61c7d?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8aHVtYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80',
+        displayUsername: true,
+        hasMention: false,
+        hideStatus: false,
+    },
+    {
+        displayName: 'ghazimubina',
+        isBusy: false,
+        user: { username: 'beena' },
+        isShared: true,
+        disablePopover: true,
+        url: 'https://images.pexels.com/photos/1987301/pexels-photo-1987301.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500',
         displayUsername: true,
         hasMention: false,
         hideStatus: false,
@@ -383,8 +446,19 @@ exports.styleSheet = {
         '& .message--box-outer': {
             position: 'fixed',
             bottom: '10%',
-            width: '84.7%',
+            width: '88.7%',
+        },
+        '& .icon': {
+            position: 'absolute',
+            top: '9px',
+            right: '23px',
+        },
+        '& .icon .anticon': {
+            marginRight: '8px'
         },
+        '& .icon .anticon svg path': {
+            fill: 'grey'
+        }
     }),
 };
@@ -422,13 +496,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.filteredRoutes = exports.messengerPageStore = exports.DashboardProvider = void 0;
 const React = __importStar(__webpack_require__(/*! react */ "react"));
-const components_1 = __webpack_require__(/*! @adminide-stack/platform-browser/lib/components */ "@adminide-stack/platform-browser/lib/components");
+const platform_browser_1 = __webpack_require__(/*! @adminide-stack/platform-browser */ "@adminide-stack/platform-browser");
 const utils_1 = __webpack_require__(/*! ./utils */ "./src/utils/index.ts");
 const react_intl_1 = __webpack_require__(/*! react-intl */ "react-intl");
 const Dashboard = React.lazy(() => Promise.resolve().then(() => __importStar(__webpack_require__(/*! ./containers/Dashboard */ "./src/containers/Dashboard.tsx"))));
 const Messenger = React.lazy(() => Promise.resolve().then(() => __importStar(__webpack_require__(/*! ./containers/Messenger */ "./src/containers/Messenger.tsx"))));
 exports.DashboardProvider = () => {
-    return (React.createElement(components_1.DashboardFill, null,
+    return (React.createElement(platform_browser_1.DashboardFill, null,
         React.createElement(react_intl_1.IntlProvider, { locale: "en" },
             React.createElement(Messenger, null))));
 };
@@ -607,14 +681,25 @@ exports.getFilteredRoutes = (accountPageStore, selectedRoutes) => accountPageSto
 /***/ }),
-/***/ "@adminide-stack/platform-browser/lib/components":
-/*!******************************************************************!*\
-  !*** external "@adminide-stack/platform-browser/lib/components" ***!
-  \******************************************************************/
+/***/ "@adminide-stack/platform-browser":
+/*!***************************************************!*\
+  !*** external "@adminide-stack/platform-browser" ***!
+  \***************************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+module.exports = require("@adminide-stack/platform-browser");
+/***/ }),
+/***/ "@ant-design/icons":
+/*!************************************!*\
+  !*** external "@ant-design/icons" ***!
+  \************************************/
 /*! no static exports found */
 /***/ (function(module, exports) {
-module.exports = require("@adminide-stack/platform-browser/lib/components");
+module.exports = require("@ant-design/icons");
 /***/ }),

package/lib/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["webpack:///webpack/bootstrap","webpack:///./src/components/messenger/avatar/index.tsx","webpack:///./src/components/messenger/avatar/style.ts","webpack:///./src/components/messenger/index.tsx","webpack:///./src/components/messenger/messagesList/index.tsx","webpack:///./src/components/messenger/mock.ts","webpack:///./src/components/messenger/style.ts","webpack:///./src/compute.tsx","webpack:///./src/containers/Dashboard.tsx","webpack:///./src/containers/Messenger.tsx","webpack:///./src/index.tsx","webpack:///./src/module.ts","webpack:///./src/utils/index.ts","webpack:///external \"@adminide-stack/platform-browser/lib/components\"","webpack:///external \"@common-stack/client-react\"","webpack:///external \"antd\"","webpack:///external \"classnames\"","webpack:///external \"react\"","webpack:///external \"react-fela\"","webpack:///external \"react-intl\""],"names":[],"mappings":"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","file":"index.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8\|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = \"./src/index.tsx\");\n","import React from 'react';\nimport classNames from 'classnames';\n\nimport { useFela } from 'react-fela';\nimport { styleSheet } from './style';\n\ntype IAvatarSize = 'xxs' \| 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl';\n\ntype IProps = {\n text?: string;\n url?: string \| any;\n size?: IAvatarSize;\n username?: string;\n};\n\nexport const Avatar = ({ url, size = 'md', text, username }: IProps) => {\n const { css } = useFela();\n const classes = classNames(`Avatar Avatar-${size}`);\n\n if (text) {\n return (\n <div className={css(styleSheet.avatarStyles as any)}>\n <div className={classes + ` Avatar-plain`} data-content={text} />\n </div>\n );\n }\n return (\n <div className={css(styleSheet.avatarStyles as any)}>\n <img src={url} className={classes} alt=\"\" />\n <div className=\"username\"> \n <h4>{username}</h4>\n <p>6:40</p>\n </div>\n </div>\n );\n};\n","export const styleSheet = {\n // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\n avatarStyles: () => ({\n display: 'flex',\n alignItems: 'center',\n '& .Avatar': {\n '-webkit-user-select': 'none',\n /* Chrome all / Safari all /\n '-moz-user-select': 'none',\n / Firefox all /\n '-ms-user-select': 'none',\n / IE 10+ /\n 'user-select': 'none',\n verticalAlign: 'sub',\n },\n '& .Avatar, .Avatar:focus, .Avatar.a11y--focused': {\n borderRadius: '50%',\n },\n '& .Avatar.Avatar-xs': {\n width: '20px',\n minWidth: '20px',\n height: '20px',\n fontSize: '9.5px',\n },\n '& .Avatar.Avatar-sm': {\n width: '24px',\n minWidth: '24px',\n height: '24px',\n fontSize: '10px',\n },\n '& .Avatar.Avatar-md': {\n width: '32px',\n minWidth: '32px',\n height: '32px',\n fontSize: '12px',\n },\n '& .Avatar.Avatar-lg': {\n width: '36px',\n minWidth: '36px',\n height: '36px',\n fontSize: '14px',\n },\n '& .Avatar.Avatar-xl': {\n width: '50px',\n minWidth: '50px',\n height: '50px',\n fontSize: '18px',\n },\n '& .Avatar.Avatar-xxl': {\n width: '128px',\n minWidth: '128px',\n height: '128px',\n fontSize: '44px',\n },\n '& .Avatar.Avatar-plain': {\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n background: 'red',\n },\n '& .Avatar.Avatar-plain::before': {\n position: 'absolute',\n display: 'inline-flex',\n width: '100%',\n height: '100%',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '50%',\n color: 'rgba(0, 1, 0, )',\n content: 'attr(data-content)',\n },\n '& .username': {\n marginBottom: '30px',\n marginLeft: '10px',\n },\n '& .username p': {\n marginBottom: '30px',\n marginLeft: '10px',\n },\n }),\n};\n","import React, { FC, useState } from 'react';\nimport { Col, Row, Input, Card } from 'antd';\nimport { MessagesList } from './messagesList/index';\nimport { messagesData } from './mock';\nimport { IMessageList } from './types/message';\nimport { useFela } from 'react-fela';\nimport { styleSheet } from './style';\n\nexport const MessengerComponent: FC = () => {\n const { css } = useFela();\n const [enterValue, setEnterValue] = useState<string>('');\n const [userMessagesList, setUserMessagesList] = useState<IMessageList[]>(messagesData);\n const handleEnterButton = (e) => {\n setUserMessagesList([\n ...userMessagesList,\n {\n id: Math.random(),\n loginUser: true,\n message: enterValue,\n },\n ]);\n setEnterValue('');\n };\n\n return (\n <div className={css(styleSheet.messengerStyles as any)}>\n <Row gutter={[24, 6]}>\n <Card style={{ width: '100%', marginBottom: '100px' }}>\n <Col md={24}>\n <MessagesList userMessagesList={userMessagesList} />\n </Col>\n </Card>\n <Col md={24} className=\"message--box-outer\">\n <Input\n value={enterValue}\n onChange={(e: any) => setEnterValue(e?.target?.value)}\n onPressEnter={(e) => handleEnterButton(e)}\n placeholder=\"Please Enter\"\n />\n </Col>\n </Row>\n </div>\n );\n};\n","import React, { FC } from 'react';\nimport { Col, Row } from 'antd';\nimport { IMessageList } from '../types/message';\nimport { Avatar} from '../avatar'\n\ninterface IProps {\n userMessagesList: IMessageList[];\n}\nexport const MessagesList: FC<IProps> = ({ userMessagesList }) => {\n return ( \n <Row gutter={[24, 6]}>\n {userMessagesList?.map((item: IMessageList, index: number) => {\n if (!item.loginUser) {\n return (\n <Col md={24} key={index} style={{ textAlign: 'right' }}>\n <p>{item?.message}</p>\n </Col>\n );\n } else {\n return (\n <Col md={24} key={index}>\n <Avatar url='https://images.unsplash.com/photo-1503023345310-bd7c1de61c7d?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8aHVtYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80' size='lg' username='admin'/>\n <p>{item?.message}</p>\n </Col>\n );\n }\n })}\n </Row>\n );\n};\n","export const messagesData = [\n {\n id: 1,\n loginUser: true,\n message: 'Hello!',\n },\n {\n id: 2,\n loginUser: false,\n message: 'Hey!',\n },\n {\n id: 3,\n loginUser: true,\n message: 'How are you!',\n },\n {\n id: 4,\n loginUser: false,\n message: 'I am fine!',\n },\n];\n\nexport const userProfile = [\n {\n displayName: 'nickname',\n isBusy: false,\n user: { username: 'Admin' },\n isShared: true,\n disablePopover: true,\n displayUsername: true,\n hasMention: false,\n hideStatus: false,\n },\n];\n","export const styleSheet = {\n // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\n messengerStyles: () => ({\n display: 'inharit',\n '& .message--box-outer': {\n position: 'fixed',\n bottom: '10%',\n width: '84.7%',\n },\n }),\n};\n","import as React from 'react';\nimport { IMenuPosition } from '@common-stack/client-react';\nimport { FileOutlined } from '@ant-design/icons';\nimport { userIsAuthenticatedRedir } from '@adminide-stack/user-auth0-browser';\nimport { DashboardFill } from '@adminide-stack/platform-browser/lib/components';\nimport { IPreDefineAccountPermissions, ConfigurationTarget } from '@adminide-stack/core';\nimport { getFilteredRoutes } from './utils';\nimport { IntlProvider } from 'react-intl';\n\nconst Dashboard = React.lazy(() => import('./containers/Dashboard'));\nconst Messenger = React.lazy(() => import('./containers/Messenger'));\n\nexport const DashboardProvider = () => {\n return (\n <DashboardFill>\n {/* <Dashboard/> /}\n <IntlProvider locale=\"en\">\n <Messenger />\n </IntlProvider>\n </DashboardFill>\n );\n};\n\nexport const messengerPageStore: any[] = [\n // {\n // exact: false,\n // icon: <FileOutlined />,\n // key: 'dashboard',\n // component: userIsAuthenticatedRedir(Dashboard),\n // position: IMenuPosition.MIDDLE,\n // tab: 'Dashboard',\n // name: 'Dashboard',\n // path: '/:orgName/o/dashboard',\n // priority: 1,\n // },\n];\n\nconst selectedRoutesAndMenus = ['dashboard'];\n\nconst filteredRoutes = getFilteredRoutes(messengerPageStore, selectedRoutesAndMenus);\nexport { filteredRoutes };\n","import as React from 'react';\n\nconst Dashboard: React.FC = () => {\n return <> This is Dashboard page </>;\n};\n\nexport default Dashboard;\n","import * as React from 'react';\nimport { PostViewPage } from './../components/post/index';\nimport { MessengerComponent } from './../components/messenger'\n\nconst Messenger: React.FC = () => {\n return (\n <>\n <MessengerComponent />\n </>\n );\n};\n\nexport default Messenger;\n","import PlatformModule from './module';\n\nimport { Feature } from '@common-stack/client-react';\n\nexport default new Feature(PlatformModule);\n","/* eslint-disable import/no-extraneous-dependencies */\nimport { Feature } from '@common-stack/client-react';\nimport { filteredRoutes, DashboardProvider } from './compute';\n\nexport default new Feature({\n routeConfig: filteredRoutes,\n stylesInsert: [\n 'bootstrap/dist/css/bootstrap.css',\n 'jasny-bootstrap/dist/css/jasny-bootstrap.css',\n 'font-awesome/css/font-awesome.css',\n ],\n componentFillPlugins: [\n {\n name: 'report-fill-component',\n render: DashboardProvider,\n },\n ],\n});\n","export const getFilteredRoutes = (accountPageStore, selectedRoutes) =>\n accountPageStore\n .map((item) => {\n if (selectedRoutes.indexOf(item.key) !== -1) {\n const { path } = item;\n return {\n [path]: item,\n };\n }\n return null;\n })\n .filter((valid) => valid);\n","module.exports = require(\"@adminide-stack/platform-browser/lib/components\");","module.exports = require(\"@common-stack/client-react\");","module.exports = require(\"antd\");","module.exports = require(\"classnames\");","module.exports = require(\"react\");","module.exports = require(\"react-fela\");","module.exports = require(\"react-intl\");"],"sourceRoot":""}
1	+ {"version":3,"sources":["webpack:///webpack/bootstrap","webpack:///./src/components/messenger/avatar/index.tsx","webpack:///./src/components/messenger/avatar/style.ts","webpack:///./src/components/messenger/index.tsx","webpack:///./src/components/messenger/messagesList/index.tsx","webpack:///./src/components/messenger/mock.ts","webpack:///./src/components/messenger/style.ts","webpack:///./src/compute.tsx","webpack:///./src/containers/Dashboard.tsx","webpack:///./src/containers/Messenger.tsx","webpack:///./src/index.tsx","webpack:///./src/module.ts","webpack:///./src/utils/index.ts","webpack:///external \"@adminide-stack/platform-browser\"","webpack:///external \"@ant-design/icons\"","webpack:///external \"@common-stack/client-react\"","webpack:///external \"antd\"","webpack:///external \"classnames\"","webpack:///external \"react\"","webpack:///external \"react-fela\"","webpack:///external \"react-intl\""],"names":[],"mappings":";;QAAA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;;QAEA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;;;QAGA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;QACA,0CAA0C,gCAAgC;QAC1E;QACA;;QAEA;QACA;QACA;QACA,wDAAwD,kBAAkB;QAC1E;QACA,iDAAiD,cAAc;QAC/D;;QAEA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA,yCAAyC,iCAAiC;QAC1E,gHAAgH,mBAAmB,EAAE;QACrI;QACA;;QAEA;QACA;QACA;QACA,2BAA2B,0BAA0B,EAAE;QACvD,iCAAiC,eAAe;QAChD;QACA;QACA;;QAEA;QACA,sDAAsD,+DAA+D;;QAErH;QACA;;;QAGA;QACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClFA,sEAA+B;AAC/B,0FAAoC;AAEpC,yEAAqC;AACrC,iGAAqC;AAYxB,cAAM,GAAG,CAAC,EAAE,GAAG,EAAE,IAAI,GAAG,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAU,EAAE,EAAE;IACzE,MAAM,EAAE,GAAG,EAAE,GAAG,oBAAO,EAAE,CAAC;IAC1B,MAAM,OAAO,GAAG,oBAAU,CAAC,iBAAiB,IAAI,EAAE,CAAC,CAAC;IAEpD,IAAI,IAAI,EAAE;QACN,OAAO,CACH,6BAAK,SAAS,EAAE,GAAG,CAAC,kBAAU,CAAC,YAAmB,CAAC;YAC/C,6BAAK,SAAS,EAAE,OAAO,GAAG,eAAe,kBAAgB,IAAI,GAAI,CAC/D,CACT,CAAC;KACL;IACD,OAAO,CACH,6BAAK,SAAS,EAAE,GAAG,CAAC,kBAAU,CAAC,YAAmB,CAAC;QAC/C,2BAAG,IAAI,EAAC,EAAE;YACN,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAC,EAAE,GAAG,CAC5C;QACJ,6BAAK,SAAS,EAAC,UAAU;YACrB,2BAAG,IAAI,EAAC,EAAE;gBACN,gCAAK,QAAQ,CAAM,CACnB;YACJ,+BAAI,IAAI,CAAK,CACX,CACJ,CACT,CAAC;AACN,CAAC,CAAC;;;;;;;;;;;;;;;;ACxCW,kBAAU,GAAG;IACtB,6EAA6E;IAC7E,YAAY,EAAE,GAAG,EAAE,CAAC,CAAC;QACjB,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,WAAW,EAAE;YACT,qBAAqB,EAAE,MAAM;YAC7B,6BAA6B;YAC7B,kBAAkB,EAAE,MAAM;YAC1B,iBAAiB;YACjB,iBAAiB,EAAE,MAAM;YACzB,YAAY;YACZ,aAAa,EAAE,MAAM;YACrB,aAAa,EAAE,KAAK;SACvB;QACD,iDAAiD,EAAE;YAC/C,YAAY,EAAE,KAAK;SACtB;QACD,qBAAqB,EAAE;YACnB,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,OAAO;SACpB;QACD,qBAAqB,EAAE;YACnB,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,MAAM;SACnB;QACD,qBAAqB,EAAE;YACnB,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,MAAM;SACnB;QACD,qBAAqB,EAAE;YACnB,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,MAAM;SACnB;QACD,qBAAqB,EAAE;YACnB,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,MAAM;SACnB;QACD,sBAAsB,EAAE;YACpB,KAAK,EAAE,OAAO;YACd,QAAQ,EAAE,OAAO;YACjB,MAAM,EAAE,OAAO;YACf,QAAQ,EAAE,MAAM;SACnB;QACD,wBAAwB,EAAE;YACtB,QAAQ,EAAE,UAAU;YACpB,OAAO,EAAE,aAAa;YACtB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,UAAU,EAAE,KAAK;SACpB;QACD,gCAAgC,EAAE;YAC9B,QAAQ,EAAE,UAAU;YACpB,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,YAAY,EAAE,KAAK;YACnB,KAAK,EAAE,iBAAiB;YACxB,OAAO,EAAE,oBAAoB;SAChC;QACD,aAAa,EAAE;YACX,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,MAAM;SACrB;QACD,eAAe,EAAE;YACb,KAAK,EAAG,OAAO;YACf,cAAc,EAAG,MAAM;SAC1B;QACD,eAAe,EAAE;YACb,SAAS,EAAE,KAAK;YAChB,UAAU,EAAE,MAAM;SACrB;KACJ,CAAC;CACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFF,wEAA4C;AAC5C,uDAA6C;AAC7C,qHAAoD;AACpD,uFAAsC;AAEtC,kFAAqE;AACrE,yEAAqC;AACrC,0FAAqC;AAExB,0BAAkB,GAAO,GAAG,EAAE;IACvC,MAAM,EAAE,GAAG,EAAE,GAAG,oBAAO,EAAE,CAAC;IAC1B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,gBAAQ,CAAS,EAAE,CAAC,CAAC;IACzD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,gBAAQ,CAAiB,mBAAY,CAAC,CAAC;IACvF,MAAM,iBAAiB,GAAG,CAAC,CAAC,EAAE,EAAE;QAC5B,mBAAmB,CAAC;YAChB,GAAG,gBAAgB;YACnB;gBACI,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE;gBACjB,SAAS,EAAE,IAAI;gBACf,OAAO,EAAE,UAAU;gBACnB,WAAW,EAAE,IAAI;aACpB;SACJ,CAAC,CAAC;QACH,aAAa,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG,CAAC,kBAAU,CAAC,eAAsB,CAAC;QAClD,8BAAC,UAAG,IAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;YAChB,8BAAC,WAAI,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE;gBACjD,8BAAC,UAAG,IAAC,EAAE,EAAE,EAAE;oBACP,8BAAC,oBAAY,IAAC,gBAAgB,EAAE,gBAAgB,GAAI,CAClD,CACH;YACP,8BAAC,UAAG,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,oBAAoB;gBACvC,8BAAC,YAAK,IACF,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,CAAC,CAAM,EAAE,EAAE,WAAC,oBAAa,OAAC,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,0CAAE,KAAK,CAAC,KACrD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC,EACzC,WAAW,EAAC,cAAc,GAC5B;gBACF,uCAAK,SAAS,EAAC,MAAM;oBACjB,8BAAC,yBAAiB,OAAG;oBACrB,8BAAC,qBAAa,OAAG,CACf,CACJ,CACJ,CACJ,CACT,CAAC;AACN,CAAC,CAAC;;;;;;;;;;;;;;;;;;;ACjDF,2EAAkC;AAClC,uDAAyC;AACzC,wFAAsC;AAEtC,qGAAmC;AAOtB,oBAAY,GAAe,CAAC,EAAE,gBAAgB,EAAE,EAAE,EAAE;IAC7D,IAAI,IAAI,GAAG,UAAU,CAAC;IACtB,IAAI,MAAM,CAAC;IACX;QACI,kBAAW,CAAC,IAAI,CAAC,CAAC,OAAY,EAAE,KAAU,EAAE,EAAE;YAC1C,IAAI,CAAC,OAAO,CAAC,WAAW,IAAI,aAAa,CAAC,EAAE;gBACxC,MAAM,GAAG,CACL,8BAAC,eAAM,IAAC,GAAG,EAAE,OAAO,CAAC,GAAG,EAAE,QAAQ,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,EAAC,GAAG,EAAE,KAAK,GAAI,CAClG,CAAC;aACL;QACL,CAAC,CAAC,CAAC;KACN;IACD,OAAO,CACH,8BAAC,UAAG,IAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,IACf,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,CAAC,CAAC,IAAkB,EAAE,KAAa,EAAE,EAAE;QACzD,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;YACjB,OAAO,CACH,8BAAC,UAAG,IAAC,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK;gBAClB,MAAM;gBACP,qCAAG,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,IAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,CAAK;gBACrD,8BAAC,cAAO,QAAE,KAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAW,CAC5D,CACT,CAAC;SACL;aAAM;YACH,OAAO,CACH,8BAAC,UAAG,IAAC,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK;gBAClB,MAAM;gBACP,qCAAG,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,IAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,CAAK;gBACrD,8BAAC,cAAO,QAAE,KAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAW,CAC5D,CACT,CAAC;SACL;IACL,CAAC,EACC,CACT,CAAC;AACN,CAAC,CAAC;;;;;;;;;;;;;;;;AC9CW,oBAAY,GAAG;IACxB;QACI,EAAE,EAAE,CAAC;QACL,SAAS,EAAE,IAAI;QACf,OAAO,EAAE,QAAQ;QACjB,IAAI,EAAE,WAAW;QACjB,WAAW,EAAG,KAAK;KACtB;IACD;QACI,EAAE,EAAE,CAAC;QACL,SAAS,EAAE,KAAK;QAChB,OAAO,EAAE,MAAM;QACf,IAAI,EAAE,WAAW;QACjB,WAAW,EAAG,KAAK;KACtB;IACD;QACI,EAAE,EAAE,CAAC;QACL,SAAS,EAAE,IAAI;QACf,OAAO,EAAE,cAAc;QACvB,IAAI,EAAE,WAAW;QACjB,WAAW,EAAG,KAAK;KACtB;IACD;QACI,EAAE,EAAE,CAAC;QACL,SAAS,EAAE,KAAK;QAChB,OAAO,EAAE,YAAY;QACrB,IAAI,EAAE,WAAW;QACjB,WAAW,EAAG,IAAI;KACrB;CACJ,CAAC;AAEW,mBAAW,GAAG;IACvB;QACI,WAAW,EAAE,UAAU;QACvB,MAAM,EAAE,KAAK;QACb,IAAI,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE;QAC3B,QAAQ,EAAE,IAAI;QACd,cAAc,EAAE,IAAI;QACpB,GAAG,EAAG,+IAA+I;QACrJ,eAAe,EAAE,IAAI;QACrB,UAAU,EAAE,KAAK;QACjB,UAAU,EAAE,KAAK;KACpB;IACD;QACI,WAAW,EAAE,aAAa;QAC1B,MAAM,EAAE,KAAK;QACb,IAAI,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE;QAC3B,QAAQ,EAAE,IAAI;QACd,cAAc,EAAE,IAAI;QACpB,GAAG,EAAG,0GAA0G;QAChH,eAAe,EAAE,IAAI;QACrB,UAAU,EAAE,KAAK;QACjB,UAAU,EAAE,KAAK;KACpB;CACJ,CAAC;;;;;;;;;;;;;;;;ACtDW,kBAAU,GAAG;IACtB,6EAA6E;IAC7E,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC;QACpB,OAAO,EAAE,SAAS;QAClB,uBAAuB,EAAE;YACrB,QAAQ,EAAE,OAAO;YACjB,MAAM,EAAE,KAAK;YACb,KAAK,EAAE,OAAO;SACjB;QACD,SAAS,EAAE;YACP,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,KAAK;YACV,KAAK,EAAG,MAAM;SACjB;QACD,kBAAkB,EAAE;YAChB,WAAW,EAAG,KAAK;SACtB;QACD,2BAA2B,EAAE;YACzB,IAAI,EAAG,MAAM;SAChB;KACJ,CAAC;CACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrBF,sEAA+B;AAI/B,2HAAiE;AAEjE,2EAA4C;AAC5C,yEAA0C;AAE1C,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,+DAAQ,8DAAwB,GAAC,CAAC,CAAC;AACrE,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,+DAAQ,8DAAwB,GAAC,CAAC,CAAC;AAExD,yBAAiB,GAAG,GAAG,EAAE;IAClC,OAAO,CACH,oBAAC,gCAAa;QAEV,oBAAC,yBAAY,IAAC,MAAM,EAAC,IAAI;YACrB,oBAAC,SAAS,OAAG,CACF,CACH,CACnB,CAAC;AACN,CAAC,CAAC;AAEW,0BAAkB,GAAU;AACrC,IAAI;AACJ,oBAAoB;AACpB,8BAA8B;AAC9B,wBAAwB;AACxB,sDAAsD;AACtD,sCAAsC;AACtC,wBAAwB;AACxB,yBAAyB;AACzB,qCAAqC;AACrC,mBAAmB;AACnB,KAAK;CACR,CAAC;AAEF,MAAM,sBAAsB,GAAG,CAAC,WAAW,CAAC,CAAC;AAE7C,MAAM,cAAc,GAAG,yBAAiB,CAAC,0BAAkB,EAAE,sBAAsB,CAAC,CAAC;AAC5E,wCAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxCvB,sEAA+B;AAE/B,MAAM,SAAS,GAAa,GAAG,EAAE;IAC7B,OAAO,qEAA6B,CAAC;AACzC,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACNzB,sEAA+B;AAE/B,iHAA8D;AAE9D,MAAM,SAAS,GAAa,GAAG,EAAE;IAC7B,OAAO,CACH;QACI,oBAAC,8BAAkB,OAAG,CACvB,CACN,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC;;;;;;;;;;;;;;;;;;ACZzB,yFAAsC;AAEtC,2GAAqD;AAErD,kBAAe,IAAI,sBAAO,CAAC,gBAAc,CAAC,CAAC;;;;;;;;;;;;;;;ACJ3C,sDAAsD;AACtD,2GAAqD;AACrD,4EAA8D;AAE9D,kBAAe,IAAI,sBAAO,CAAC;IACvB,WAAW,EAAE,wBAAc;IAC3B,YAAY,EAAE;QACV,kCAAkC;QAClC,8CAA8C;QAC9C,mCAAmC;KACtC;IACD,oBAAoB,EAAE;QAClB;YACI,IAAI,EAAE,uBAAuB;YAC7B,MAAM,EAAE,2BAAiB;SAC5B;KACJ;CACJ,CAAC,CAAC;;;;;;;;;;;;;;;;ACjBU,yBAAiB,GAAG,CAAC,gBAAgB,EAAE,cAAc,EAAE,EAAE,CAClE,gBAAgB;KACX,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;IACV,IAAI,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE;QACzC,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;QACtB,OAAO;YACH,CAAC,IAAI,CAAC,EAAE,IAAI;SACf,CAAC;KACL;IACD,OAAO,IAAI,CAAC;AAChB,CAAC,CAAC;KACD,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;;;;;;;;;;;;ACXlC,6D;;;;;;;;;;;ACAA,8C;;;;;;;;;;;ACAA,uD;;;;;;;;;;;ACAA,iC;;;;;;;;;;;ACAA,uC;;;;;;;;;;;ACAA,kC;;;;;;;;;;;ACAA,uC;;;;;;;;;;;ACAA,uC","file":"index.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8\|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = \"./src/index.tsx\");\n","import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { useFela } from 'react-fela';\nimport { styleSheet } from './style';\n\ntype IAvatarSize = 'xxs' \| 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl';\n\ntype IProps = {\n text?: string;\n url?: string \| any;\n size?: IAvatarSize;\n username: string;\n time: any;\n};\n\nexport const Avatar = ({ url, size = 'md', text, username, time }: IProps) => {\n const { css } = useFela();\n const classes = classNames(`Avatar Avatar-${size}`);\n\n if (text) {\n return (\n <div className={css(styleSheet.avatarStyles as any)}>\n <div className={classes + ` Avatar-plain`} data-content={text} />\n </div>\n );\n }\n return (\n <div className={css(styleSheet.avatarStyles as any)}>\n <a href=\"\">\n <img src={url} className={classes} alt=\"\" />\n </a>\n <div className=\"username\">\n <a href=\"\">\n <h4>{username}</h4>\n </a>\n <p>{time}</p>\n </div>\n </div>\n );\n};\n","export const styleSheet = {\n // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\n avatarStyles: () => ({\n display: 'flex',\n alignItems: 'center',\n '& .Avatar': {\n '-webkit-user-select': 'none',\n /* Chrome all / Safari all /\n '-moz-user-select': 'none',\n / Firefox all /\n '-ms-user-select': 'none',\n / IE 10+ /\n 'user-select': 'none',\n verticalAlign: 'sub',\n },\n '& .Avatar, .Avatar:focus, .Avatar.a11y--focused': {\n borderRadius: '50%',\n },\n '& .Avatar.Avatar-xs': {\n width: '20px',\n minWidth: '20px',\n height: '20px',\n fontSize: '9.5px',\n },\n '& .Avatar.Avatar-sm': {\n width: '24px',\n minWidth: '24px',\n height: '24px',\n fontSize: '10px',\n },\n '& .Avatar.Avatar-md': {\n width: '32px',\n minWidth: '32px',\n height: '32px',\n fontSize: '12px',\n },\n '& .Avatar.Avatar-lg': {\n width: '36px',\n minWidth: '36px',\n height: '36px',\n fontSize: '14px',\n },\n '& .Avatar.Avatar-xl': {\n width: '50px',\n minWidth: '50px',\n height: '50px',\n fontSize: '18px',\n },\n '& .Avatar.Avatar-xxl': {\n width: '128px',\n minWidth: '128px',\n height: '128px',\n fontSize: '44px',\n },\n '& .Avatar.Avatar-plain': {\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n background: 'red',\n },\n '& .Avatar.Avatar-plain::before': {\n position: 'absolute',\n display: 'inline-flex',\n width: '100%',\n height: '100%',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '50%',\n color: 'rgba(0, 1, 0, )',\n content: 'attr(data-content)',\n },\n '& .username': {\n display: 'flex',\n marginLeft: '10px',\n },\n '& .username a': {\n color : 'black',\n textDecoration : 'none'\n },\n '& .username p': {\n marginTop: '8px',\n marginLeft: '10px',\n },\n }),\n};\n","import React, { FC, useState } from 'react';\nimport { Col, Row, Input, Card } from 'antd';\nimport { MessagesList } from './messagesList/index';\nimport { messagesData } from './mock';\nimport { IMessageList } from './types/message';\nimport { SmileOutlined, PaperClipOutlined } from '@ant-design/icons';\nimport { useFela } from 'react-fela';\nimport { styleSheet } from './style';\n\nexport const MessengerComponent: FC = () => {\n const { css } = useFela();\n const [enterValue, setEnterValue] = useState<string>('');\n const [userMessagesList, setUserMessagesList] = useState<IMessageList[]>(messagesData);\n const handleEnterButton = (e) => {\n setUserMessagesList([\n ...userMessagesList,\n {\n id: Math.random(),\n loginUser: true,\n message: enterValue,\n timeIsToday: true,\n },\n ]);\n setEnterValue('');\n };\n\n return (\n <div className={css(styleSheet.messengerStyles as any)}>\n <Row gutter={[24, 6]}>\n <Card style={{ width: '100%', marginBottom: '100px' }}>\n <Col md={24}>\n <MessagesList userMessagesList={userMessagesList} />\n </Col>\n </Card>\n <Col md={24} className=\"message--box-outer\">\n <Input\n value={enterValue}\n onChange={(e: any) => setEnterValue(e?.target?.value)}\n onPressEnter={(e) => handleEnterButton(e)}\n placeholder=\"Please Enter\"\n />\n <div className=\"icon\">\n <PaperClipOutlined />\n <SmileOutlined />\n </div>\n </Col>\n </Row>\n </div>\n );\n};\n","import React, { FC } from 'react';\nimport { Col, Row ,Divider } from 'antd';\nimport { userProfile } from '../mock';\nimport { IMessageList } from '../types/message';\nimport { Avatar } from '../avatar';\nimport { conditionalExpression } from '@babel/types';\n\ninterface IProps {\n userMessagesList: IMessageList[];\n}\n\nexport const MessagesList: FC<IProps> = ({ userMessagesList }) => {\n var time = '10:45 PM';\n let avatar;\n {\n userProfile.find((element: any, index: any) => {\n if ((element.displayName == 'ghazimubina')) {\n avatar = (\n <Avatar url={element.url} username={element.user.username} time={time} size=\"lg\" key={index} />\n );\n }\n });\n }\n return (\n <Row gutter={[24, 6]}>\n {userMessagesList?.map((item: IMessageList, index: number) => {\n if (!item.loginUser) {\n return (\n <Col md={24} key={index}>\n {avatar}\n <p style={{ marginLeft: '50px' }}>{item?.message}</p>\n <Divider>{item?.timeIsToday ? 'today' : 'yesterday'}</Divider>\n </Col>\n );\n } else {\n return (\n <Col md={24} key={index}>\n {avatar}\n <p style={{ marginLeft: '50px' }}>{item?.message}</p>\n <Divider>{item?.timeIsToday ? 'today' : 'yesterday'}</Divider>\n </Col>\n );\n }\n })}\n </Row>\n );\n};\n","export const messagesData = [\n {\n id: 1,\n loginUser: true,\n message: 'Hello!',\n time: '10: 45 PM',\n timeIsToday : false\n },\n {\n id: 2,\n loginUser: false,\n message: 'Hey!',\n time: '10: 50 PM',\n timeIsToday : false\n },\n {\n id: 3,\n loginUser: true,\n message: 'How are you!',\n time: '10: 50 PM',\n timeIsToday : false\n },\n {\n id: 4,\n loginUser: false,\n message: 'I am fine!',\n time: '10: 51 PM',\n timeIsToday : true\n },\n];\n\nexport const userProfile = [\n {\n displayName: 'nickname',\n isBusy: false,\n user: { username: 'Admin' },\n isShared: true,\n disablePopover: true,\n url : 'https://images.unsplash.com/photo-1503023345310-bd7c1de61c7d?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8aHVtYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80',\n displayUsername: true,\n hasMention: false,\n hideStatus: false,\n },\n {\n displayName: 'ghazimubina',\n isBusy: false,\n user: { username: 'beena' },\n isShared: true,\n disablePopover: true,\n url : 'https://images.pexels.com/photos/1987301/pexels-photo-1987301.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500',\n displayUsername: true,\n hasMention: false,\n hideStatus: false,\n },\n];\n","export const styleSheet = {\n // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\n messengerStyles: () => ({\n display: 'inharit',\n '& .message--box-outer': {\n position: 'fixed',\n bottom: '10%',\n width: '88.7%',\n },\n '& .icon': {\n position: 'absolute',\n top: '9px',\n right : '23px',\n },\n '& .icon .anticon': {\n marginRight : '8px'\n },\n '& .icon .anticon svg path': {\n fill : 'grey'\n }\n }),\n};\n","import as React from 'react';\nimport { IMenuPosition } from '@common-stack/client-react';\nimport { FileOutlined } from '@ant-design/icons';\nimport { userIsAuthenticatedRedir } from '@adminide-stack/user-auth0-browser';\nimport { DashboardFill } from '@adminide-stack/platform-browser';\nimport { IPreDefineAccountPermissions, ConfigurationTarget } from '@adminide-stack/core';\nimport { getFilteredRoutes } from './utils';\nimport { IntlProvider } from 'react-intl';\n\nconst Dashboard = React.lazy(() => import('./containers/Dashboard'));\nconst Messenger = React.lazy(() => import('./containers/Messenger'));\n\nexport const DashboardProvider = () => {\n return (\n <DashboardFill>\n {/* <Dashboard/> /}\n <IntlProvider locale=\"en\">\n <Messenger />\n </IntlProvider>\n </DashboardFill>\n );\n};\n\nexport const messengerPageStore: any[] = [\n // {\n // exact: false,\n // icon: <FileOutlined />,\n // key: 'dashboard',\n // component: userIsAuthenticatedRedir(Dashboard),\n // position: IMenuPosition.MIDDLE,\n // tab: 'Dashboard',\n // name: 'Dashboard',\n // path: '/:orgName/o/dashboard',\n // priority: 1,\n // },\n];\n\nconst selectedRoutesAndMenus = ['dashboard'];\n\nconst filteredRoutes = getFilteredRoutes(messengerPageStore, selectedRoutesAndMenus);\nexport { filteredRoutes };\n","import as React from 'react';\n\nconst Dashboard: React.FC = () => {\n return <> This is Dashboard page </>;\n};\n\nexport default Dashboard;\n","import * as React from 'react';\nimport { PostViewPage } from './../components/post/index';\nimport { MessengerComponent } from './../components/messenger'\n\nconst Messenger: React.FC = () => {\n return (\n <>\n <MessengerComponent />\n </>\n );\n};\n\nexport default Messenger;\n","import PlatformModule from './module';\n\nimport { Feature } from '@common-stack/client-react';\n\nexport default new Feature(PlatformModule);\n","/* eslint-disable import/no-extraneous-dependencies */\nimport { Feature } from '@common-stack/client-react';\nimport { filteredRoutes, DashboardProvider } from './compute';\n\nexport default new Feature({\n routeConfig: filteredRoutes,\n stylesInsert: [\n 'bootstrap/dist/css/bootstrap.css',\n 'jasny-bootstrap/dist/css/jasny-bootstrap.css',\n 'font-awesome/css/font-awesome.css',\n ],\n componentFillPlugins: [\n {\n name: 'report-fill-component',\n render: DashboardProvider,\n },\n ],\n});\n","export const getFilteredRoutes = (accountPageStore, selectedRoutes) =>\n accountPageStore\n .map((item) => {\n if (selectedRoutes.indexOf(item.key) !== -1) {\n const { path } = item;\n return {\n [path]: item,\n };\n }\n return null;\n })\n .filter((valid) => valid);\n","module.exports = require(\"@adminide-stack/platform-browser\");","module.exports = require(\"@ant-design/icons\");","module.exports = require(\"@common-stack/client-react\");","module.exports = require(\"antd\");","module.exports = require(\"classnames\");","module.exports = require(\"react\");","module.exports = require(\"react-fela\");","module.exports = require(\"react-intl\");"],"sourceRoot":""}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@messenger-box/platform-browser",
-  "version": "0.0.1-alpha.18",
+  "version": "0.0.1-alpha.27",
   "description": "Sample core for higher packages to depend on",
   "license": "ISC",
   "author": "CDMBase LLC",
@@ -38,7 +38,7 @@
     }
   },
   "dependencies": {
-    "@messenger-box/core": "0.0.1-alpha.18",
+    "@messenger-box/core": "0.0.1-alpha.24",
     "bootstrap": "3.4.1",
     "css-vars-ponyfill": "2.4.5",
     "dynamic-virtualized-list": "github:mattermost/dynamic-virtualized-list#119db968c96643c7106d4d2c965f05b2e251bc83",
@@ -64,5 +64,5 @@
   "typescript": {
     "definition": "lib/index.d.ts"
   },
-  "gitHead": "6f3d445323f4bd2e9a26f7dc61759adb30aa0b52"
+  "gitHead": "1b95880b7a803ba2885b05b50436ad77d0099982"
 }

package/src/components/messenger/avatar/index.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import classNames from 'classnames';
 import { useFela } from 'react-fela';
@@ -10,10 +10,11 @@ type IProps = {
     text?: string;
     url?: string | any;
     size?: IAvatarSize;
-    username?: string;
+    username: string;
+    time:  any;
 };
-export const Avatar = ({ url, size = 'md', text, username }: IProps) => {
+export const Avatar = ({ url, size = 'md', text, username, time }: IProps) => {
     const { css } = useFela();
     const classes = classNames(`Avatar Avatar-${size}`);
@@ -26,10 +27,14 @@ export const Avatar = ({ url, size = 'md', text, username }: IProps) => {
     }
     return (
         <div className={css(styleSheet.avatarStyles as any)}>
-            <img src={url} className={classes} alt="" />
-            <div className="username">
-                <h4>{username}</h4>
-                <p>6:40</p>
+            <a href="">
+                <img src={url} className={classes} alt="" />
+            </a>
+            <div className="username">
+                <a href="">
+                    <h4>{username}</h4>
+                </a>
+                <p>{time}</p>
             </div>
         </div>
     );

package/src/components/messenger/avatar/style.ts CHANGED Viewed

@@ -71,11 +71,15 @@ export const styleSheet = {
             content: 'attr(data-content)',
         },
         '& .username': {
-            marginBottom: '30px',
+            display: 'flex',
             marginLeft: '10px',
         },
+        '& .username a': {
+            color : 'black',
+            textDecoration : 'none'
+        },
         '& .username p': {
-            marginBottom: '30px',
+            marginTop: '8px',
             marginLeft: '10px',
         },
     }),

package/src/components/messenger/index.tsx CHANGED Viewed

@@ -3,6 +3,7 @@ import { Col, Row, Input, Card } from 'antd';
 import { MessagesList } from './messagesList/index';
 import { messagesData } from './mock';
 import { IMessageList } from './types/message';
+import { SmileOutlined, PaperClipOutlined } from '@ant-design/icons';
 import { useFela } from 'react-fela';
 import { styleSheet } from './style';
@@ -17,6 +18,7 @@ export const MessengerComponent: FC = () => {
                 id: Math.random(),
                 loginUser: true,
                 message: enterValue,
+                timeIsToday: true,
             },
         ]);
         setEnterValue('');
@@ -30,14 +32,18 @@ export const MessengerComponent: FC = () => {
                         <MessagesList userMessagesList={userMessagesList} />
                     </Col>
                 </Card>
-                    <Col md={24} className="message--box-outer">
-                        <Input
-                            value={enterValue}
-                            onChange={(e: any) => setEnterValue(e?.target?.value)}
-                            onPressEnter={(e) => handleEnterButton(e)}
-                            placeholder="Please Enter"
-                        />
-                    </Col>
+                <Col md={24} className="message--box-outer">
+                    <Input
+                        value={enterValue}
+                        onChange={(e: any) => setEnterValue(e?.target?.value)}
+                        onPressEnter={(e) => handleEnterButton(e)}
+                        placeholder="Please Enter"
+                    />
+                    <div className="icon">
+                        <PaperClipOutlined />
+                        <SmileOutlined />
+                    </div>
+                </Col>
             </Row>
         </div>
     );

package/src/components/messenger/messagesList/index.tsx CHANGED Viewed

@@ -1,26 +1,43 @@
 import React, { FC } from 'react';
-import { Col, Row } from 'antd';
+import { Col, Row ,Divider } from 'antd';
+import { userProfile } from '../mock';
 import { IMessageList } from '../types/message';
-import { Avatar} from '../avatar'
+import { Avatar } from '../avatar';
+import { conditionalExpression } from '@babel/types';
 interface IProps {
     userMessagesList: IMessageList[];
 }
 export const MessagesList: FC<IProps> = ({ userMessagesList }) => {
-    return (
+    var time = '10:45 PM';
+    let avatar;
+    {
+        userProfile.find((element: any, index: any) => {
+            if ((element.displayName == 'ghazimubina')) {
+                avatar = (
+                    <Avatar url={element.url} username={element.user.username} time={time} size="lg" key={index} />
+                );
+            }
+        });
+    }
+    return (
         <Row gutter={[24, 6]}>
             {userMessagesList?.map((item: IMessageList, index: number) => {
                 if (!item.loginUser) {
                     return (
-                        <Col md={24} key={index} style={{ textAlign: 'right' }}>
-                            <p>{item?.message}</p>
+                        <Col md={24} key={index}>
+                            {avatar}
+                            <p style={{ marginLeft: '50px' }}>{item?.message}</p>
+                            <Divider>{item?.timeIsToday ? 'today' : 'yesterday'}</Divider>
                         </Col>
                     );
                 } else {
                     return (
                         <Col md={24} key={index}>
-                            <Avatar url='https://images.unsplash.com/photo-1503023345310-bd7c1de61c7d?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8aHVtYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80' size='lg' username='admin'/>
-                            <p>{item?.message}</p>
+                            {avatar}
+                            <p style={{ marginLeft: '50px' }}>{item?.message}</p>
+                            <Divider>{item?.timeIsToday ? 'today' : 'yesterday'}</Divider>
                         </Col>
                     );
                 }

package/src/components/messenger/mock.ts CHANGED Viewed

@@ -3,21 +3,29 @@ export const messagesData = [
         id: 1,
         loginUser: true,
         message: 'Hello!',
+        time: '10: 45 PM',
+        timeIsToday : false
     },
     {
         id: 2,
         loginUser: false,
         message: 'Hey!',
+        time: '10: 50 PM',
+        timeIsToday : false
     },
     {
         id: 3,
         loginUser: true,
         message: 'How are you!',
+        time: '10: 50 PM',
+        timeIsToday : false
     },
     {
         id: 4,
         loginUser: false,
         message: 'I am fine!',
+        time: '10: 51 PM',
+        timeIsToday : true
     },
 ];
@@ -28,6 +36,18 @@ export const userProfile = [
         user: { username: 'Admin' },
         isShared: true,
         disablePopover: true,
+        url : 'https://images.unsplash.com/photo-1503023345310-bd7c1de61c7d?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8aHVtYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80',
+        displayUsername: true,
+        hasMention: false,
+        hideStatus: false,
+    },
+    {
+        displayName: 'ghazimubina',
+        isBusy: false,
+        user: { username: 'beena' },
+        isShared: true,
+        disablePopover: true,
+        url : 'https://images.pexels.com/photos/1987301/pexels-photo-1987301.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500',
         displayUsername: true,
         hasMention: false,
         hideStatus: false,

package/src/components/messenger/style.ts CHANGED Viewed

@@ -5,7 +5,18 @@ export const styleSheet = {
         '& .message--box-outer': {
             position: 'fixed',
             bottom: '10%',
-            width: '84.7%',
+            width: '88.7%',
         },
+        '& .icon': {
+            position: 'absolute',
+            top: '9px',
+            right : '23px',
+        },
+        '& .icon .anticon': {
+            marginRight : '8px'
+        },
+        '& .icon .anticon svg path': {
+            fill : 'grey'
+        }
     }),
 };

package/src/components/messenger/types/message.ts CHANGED Viewed

@@ -2,4 +2,5 @@ export interface IMessageList {
     id: number;
     loginUser: boolean;
     message: string;
+    timeIsToday : boolean;
 }

package/src/components/messenger/utils/utils.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export const currentTime = () => {
+    var today = new Date();
+    var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
+}

package/src/compute.tsx CHANGED Viewed

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { IMenuPosition } from '@common-stack/client-react';
 import { FileOutlined } from '@ant-design/icons';
 import { userIsAuthenticatedRedir } from '@adminide-stack/user-auth0-browser';
-import { DashboardFill } from '@adminide-stack/platform-browser/lib/components';
+import { DashboardFill } from '@adminide-stack/platform-browser';
 import { IPreDefineAccountPermissions, ConfigurationTarget } from '@adminide-stack/core';
 import { getFilteredRoutes } from './utils';
 import { IntlProvider } from 'react-intl';