diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 6d82d89..a313082 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -231,6 +231,9 @@
 	"go_to_timesheet": {
 		"message": "Go to Timesheet"
 	},
+	"see_full_timesheet": {
+		"message": "See full Timesheet"
+	},  
 	"go_to_subscriton_page": {
 		"message": "Go to subscription page"
 	},
diff --git a/package.json b/package.json
index c95592b..e98a479 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "timecamp-chrome-extension",
-  "version": "2.85.2",
+  "version": "2.85.74",
   "description": "TimeCamp Google Chrome Time Tracking Extension",
   "main": "index.js",
   "scripts": {
diff --git a/scripts-2.0/components/Billable/styles.scss b/scripts-2.0/components/Billable/styles.scss
index 35258e8..34a0faf 100644
--- a/scripts-2.0/components/Billable/styles.scss
+++ b/scripts-2.0/components/Billable/styles.scss
@@ -45,7 +45,7 @@
         height: 16px;
         border-radius: 100%;
         background: #fff;
-        display: block;;
+        display: block;
       }
 
       input:checked ~ .checkmark {
diff --git a/scripts-2.0/components/ContextMenu/index.tsx b/scripts-2.0/components/ContextMenu/index.tsx
index 76ee817..8dbd703 100644
--- a/scripts-2.0/components/ContextMenu/index.tsx
+++ b/scripts-2.0/components/ContextMenu/index.tsx
@@ -38,7 +38,7 @@ export interface ContextMenuInterface {
     note: string,
     billable: boolean,
     startTimerCallback: Function,
-    addTimeEntryCallback: Function,
+    addTimeEntryCallback?: Function,
     onCloseCallback: Function,
     billableInputVisibility: boolean|null,
     externalTaskId: string,
@@ -91,6 +91,19 @@ const ContextMenu: React.FC<ContextMenuInterface> = (props) => {
 
     const THIRTY_DAYS_IN_MILISEC = 2592000000;
 
+    const isTimeEntryInValid =
+    props.service === "chrome_plugin" &&
+    props.addTimeEntryCallback &&
+    !stopTime;
+
+    const shouldShowAddEntryButton =
+      props.service !== "chrome_plugin"
+        ? false
+        : props.addTimeEntryCallback
+          ? true
+          : false;
+
+
 
     useEffect(() => {
         setNote(props.note);
@@ -298,7 +311,7 @@ const ContextMenu: React.FC<ContextMenuInterface> = (props) => {
     };
 
     const addTimeEntry = (startTime, stopTime) => {
-        addTimeEntryCallback(
+        addTimeEntryCallback?.(
             taskId,
             note,
             service,
@@ -336,6 +349,7 @@ const ContextMenu: React.FC<ContextMenuInterface> = (props) => {
         setClearTriggerForTimePicker(!clearTriggerForTimePicker);
         setOpen(false);
         setTaskId(0);
+        onCloseCallback()
     };
 
     const renderTagPicker = () => {
@@ -382,6 +396,13 @@ const ContextMenu: React.FC<ContextMenuInterface> = (props) => {
             .replace('*linkClose*', '</a>')));
     };
 
+    const onStopTimeValueChange = (value) => {
+        if (value !== null) {
+            setWrongDatesErrorMessage('');
+        }
+        setStopTime(value);
+    } 
+
     //data-elevation is fix for trello card modal (it close when click on context menu)
     return (
         <div
@@ -484,28 +505,29 @@ const ContextMenu: React.FC<ContextMenuInterface> = (props) => {
                         const now = dateTime.getNow();
                         setWrongDatesErrorMessage((now < value && stopTime === null) ? translate('Start time cannot be greater than now') : '');
                     }}
-                    onStopTimeValueChange={(value) => {
-                        if (value !== null) {
-                            setWrongDatesErrorMessage('');
-                        }
-                        setStopTime(value);
-                    }}
+                    onStopTimeValueChange={ props.addTimeEntryCallback? onStopTimeValueChange : undefined}
                 />
                 <WrongDatesError message={wrongDatesErrorMessage} visible={wrongDatesErrorMessage !== ''}/>
                 {
                     billableInputVisibility &&
-                    <Billable
-                        billable={billable}
-                        onBillableChange={(newBillable) => {setBillable(newBillable)}}
-                    />
+                    <div className="billable-wrapper">
+                        <Billable
+                            billable={billable}
+                            onBillableChange={(newBillable) => {setBillable(newBillable)}}
+                        />
+                    </div>
                 }
             </div>
 
             <Footer
-                idDisabled={!isSelectedTagsValid || wrongDatesErrorMessage !== ''}
-                onClickSave={onClickSave}
-                onClickCancel={onClickCancel}
-                showAddEntryButton={stopTime !== null}
+              idDisabled={
+                !isSelectedTagsValid ||
+                wrongDatesErrorMessage !== "" ||
+                isTimeEntryInValid
+              }
+              onClickSave={onClickSave}
+              onClickCancel={onClickCancel}
+              showAddEntryButton={shouldShowAddEntryButton}
             />
         </div>
     );
diff --git a/scripts-2.0/components/ContextMenu/styles.scss b/scripts-2.0/components/ContextMenu/styles.scss
index 03a1434..b3adb2b 100644
--- a/scripts-2.0/components/ContextMenu/styles.scss
+++ b/scripts-2.0/components/ContextMenu/styles.scss
@@ -7,7 +7,6 @@
     font-weight: normal;
     color: $primaryTextColor;
     width: 440px;
-    height: 563px;
     box-sizing: border-box;
     border: #aea6ab 1px solid;
     display: block;
@@ -23,9 +22,12 @@
 
     .context-menu-overflow-wrapper {
       overflow: auto;
-      height: calc(100% - 72px);
       padding: 20px;
       box-sizing: border-box;
+
+      .billable-wrapper {
+        margin-top:20px;        
+      }      
     }
 
     &-extended-height {
@@ -36,10 +38,6 @@
       margin-top: 15px;
     }
 
-    .billable {
-      margin-top: 15px;
-    }
-
     &__info-field {
       padding: 10px 14px 10px 16px;
       border-radius: 8px;
diff --git a/scripts-2.0/components/ContextMenu/types.ts b/scripts-2.0/components/ContextMenu/types.ts
new file mode 100644
index 0000000..f48d91c
--- /dev/null
+++ b/scripts-2.0/components/ContextMenu/types.ts
@@ -0,0 +1,4 @@
+export enum ContextMenuType {
+  TIMER = "TIMER",
+  ENTRY = "ENTRY",
+}
diff --git a/scripts-2.0/components/Footer/index.tsx b/scripts-2.0/components/Footer/index.tsx
index 6100973..9ffe720 100644
--- a/scripts-2.0/components/Footer/index.tsx
+++ b/scripts-2.0/components/Footer/index.tsx
@@ -2,48 +2,62 @@ import * as React from "react";
 import translate from "../../Translator";
 import Button from "../common/Button";
 
-import './styles.scss';
-import {IconName} from "../../icons/types";
+import "./styles.scss";
+import { IconName } from "../../icons/types";
 import Icon from "../Icon";
 
 export interface FooterInterface {
-    onClickSave: any,
-    onClickCancel: any,
-    idDisabled?: boolean
-    showAddEntryButton?: boolean
+  onClickSave: any;
+  onClickCancel: any;
+  idDisabled?: boolean;
+  showAddEntryButton?: boolean;
 }
 
 const Footer: React.FC<FooterInterface> = (props) => {
-    const renderStartTimerButton = () => {
-        return <React.Fragment>
-            <Icon name={IconName.PLAY}/>&nbsp;
-            {translate('start_timer')}
-        </React.Fragment>
-    }
-
-    const renderAddEntryButton = () => {
-        return <React.Fragment>
-            {translate('add_time_entry')}
-        </React.Fragment>
-    }
-
+  const renderStartTimerButton = () => {
     return (
-        <div className={'footer'}>
-            <div className={'footer__buttons'}>
-                <Button
-                    class={'footer__button-save' + (props.idDisabled ? ' footer__button-disabled' : '')}
-                    onClick={!props.idDisabled ? props.onClickSave : () => {}}
-                >
-                    {!props.showAddEntryButton && renderStartTimerButton()}
-                    {!!props.showAddEntryButton && renderAddEntryButton()}
-                </Button>
-
-                <Button class={'footer__button-cancel'} onClick={props.onClickCancel}>
-                    {translate('cancel')}
-                </Button>
-            </div>
+      <React.Fragment>
+        <span>
+          {" "}
+          {translate("start_timer")}
+          &nbsp;&nbsp;
+        </span>
+        <div>
+          <Icon name={IconName.PLAY} />
+          &nbsp;
         </div>
+      </React.Fragment>
+    );
+  };
+
+  const renderAddEntryButton = () => {
+    return (
+      <React.Fragment>
+         {translate("add_time_entry")} 
+      </React.Fragment>
     );
+  };
+
+  return (
+    <div className={"footer"}>
+      <div className={"footer__buttons"}>
+        <Button class={"footer__button-cancel"} onClick={props.onClickCancel}>
+          {translate("cancel")}
+        </Button>
+
+        <Button
+          class={
+            "footer__button-save" +
+            (props.idDisabled ? " footer__button-disabled" : "")
+          }
+          onClick={!props.idDisabled ? props.onClickSave : () => {}}
+        >
+          {!props.showAddEntryButton && renderStartTimerButton()}
+          {!!props.showAddEntryButton && renderAddEntryButton()}
+        </Button>
+      </div>
+    </div>
+  );
 };
 
 export default Footer;
diff --git a/scripts-2.0/components/Footer/styles.scss b/scripts-2.0/components/Footer/styles.scss
index bde1f92..7fff993 100644
--- a/scripts-2.0/components/Footer/styles.scss
+++ b/scripts-2.0/components/Footer/styles.scss
@@ -1,18 +1,16 @@
-@import '../../style/common';
+@import "../../style/common";
 
 .timecamp {
   .footer {
-    position: absolute;
-    bottom: 0;
-    margin: 0;
-    padding: 20px 0 20px 0;
+    bottom: 0;    
     width: 100%;
-    border-top: $primaryBorderColor 1px solid;
     background-color: inherit;
 
     &__buttons {
-      float: right;
+      width: 100%;
       margin: 0 21px 0 0;
+      padding: 1rem;
+      display: flex;
     }
 
     &__button-save {
@@ -21,13 +19,24 @@
       border: none;
       font-family: $defaultFontFamily;
       font-size: $defaultFontSize;
-      width: 133px;
+      width: unset;
+      margin-left: auto;
+      margin-right: 33px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      white-space: nowrap;
+
+      & span {
+        text-transform: uppercase;
+      }
     }
 
     &__button-cancel {
       border: solid 1px $primaryBorderColor;
       font-family: $defaultFontFamily;
       font-size: $defaultFontSize;
+      margin-right: 10px;
     }
 
     &__button-disabled {
diff --git a/scripts-2.0/components/Header/styles.scss b/scripts-2.0/components/Header/styles.scss
index 4706403..102711f 100644
--- a/scripts-2.0/components/Header/styles.scss
+++ b/scripts-2.0/components/Header/styles.scss
@@ -3,6 +3,7 @@
 .timecamp {
   .header {
     margin: 0 0 30px 0;
+    display: flex;
 
     &__logo-svg {
       top: 5px;
diff --git a/scripts-2.0/components/InfoBox/InfoBox.tsx b/scripts-2.0/components/InfoBox/InfoBox.tsx
new file mode 100644
index 0000000..977abe7
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/InfoBox.tsx
@@ -0,0 +1,35 @@
+import * as React from "react";
+import "./styles.scss";
+import { InfoBoxStatus } from "./types";
+import InfoboxesContent from "./infoboxesContent";
+
+interface InfoBoxProps {
+  children?: React.ReactNode;
+  onClose: () => void;
+
+  status: InfoBoxStatus | undefined;
+}
+
+const contentByStatus = {
+  [InfoBoxStatus.SUCCESS]: <InfoboxesContent.success />,
+  [InfoBoxStatus.ERROR]: <InfoboxesContent.error />,
+};
+
+const InfoBox = ({ onClose, status, children = null }: InfoBoxProps) => {
+  if (!status) return null;
+
+  const selectedContent = contentByStatus[status] || null;
+
+  return (
+    <div className="infobox" data-status={status}>
+      {selectedContent}
+      {children}
+
+      <span className="infobox__cross" onClick={onClose}>
+        X
+      </span>
+    </div>
+  );
+};
+
+export default InfoBox;
diff --git a/scripts-2.0/components/InfoBox/index.tsx b/scripts-2.0/components/InfoBox/index.tsx
new file mode 100644
index 0000000..303f07e
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/index.tsx
@@ -0,0 +1 @@
+export { default } from "./InfoBox";
diff --git a/scripts-2.0/components/InfoBox/infoboxesContent/InfoBoxErrorContent.tsx b/scripts-2.0/components/InfoBox/infoboxesContent/InfoBoxErrorContent.tsx
new file mode 100644
index 0000000..fcc1e41
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/infoboxesContent/InfoBoxErrorContent.tsx
@@ -0,0 +1,11 @@
+import * as React from "react";
+
+const InfoBoxError = () => {
+  return (
+    <React.Fragment>
+      <span>There was problem when creating time entry.</span>
+    </React.Fragment>
+  );
+};
+
+export default InfoBoxError;
diff --git a/scripts-2.0/components/InfoBox/infoboxesContent/InfoBoxSuccessContent.tsx b/scripts-2.0/components/InfoBox/infoboxesContent/InfoBoxSuccessContent.tsx
new file mode 100644
index 0000000..2911544
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/infoboxesContent/InfoBoxSuccessContent.tsx
@@ -0,0 +1,24 @@
+import * as React from "react";
+import Icon from "../../Icon";
+import { IconName } from "../../../icons/types";
+import PathService from "../../../PathService"
+
+const serverUrl = new PathService().getBaseUrl();
+
+const InfoBoxSuccess = () => {
+  return (
+    <React.Fragment>
+      <Icon name={IconName.CHECK_CIRCLE} iconPrefix={"fal"} />
+      <span>&nbsp; Time entry added.&nbsp; </span>
+      <a
+        rel="noopener noreferrer"
+        href={serverUrl}
+        target="_blank"
+      >
+        <span>Edit in Timesheet.</span>
+      </a>
+    </React.Fragment>
+  );
+};
+
+export default InfoBoxSuccess;
diff --git a/scripts-2.0/components/InfoBox/infoboxesContent/index.tsx b/scripts-2.0/components/InfoBox/infoboxesContent/index.tsx
new file mode 100644
index 0000000..014fe14
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/infoboxesContent/index.tsx
@@ -0,0 +1,7 @@
+import InfoBoxError from "./InfoBoxErrorContent";
+import InfoBoxSuccess from "./InfoBoxSuccessContent";
+
+export default {
+  success: InfoBoxSuccess,
+  error: InfoBoxError,
+};
diff --git a/scripts-2.0/components/InfoBox/styles.scss b/scripts-2.0/components/InfoBox/styles.scss
new file mode 100644
index 0000000..f3c549e
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/styles.scss
@@ -0,0 +1,37 @@
+.infobox {
+  display: flex;
+  gap: 0.5rem;
+  color: #17b54e;
+  background-color: #f1f9f3;
+  border-radius: 8px;
+  padding: 10px;
+  align-items: center;
+  margin-top: 7px;
+
+  & a {
+    color: #17b54e;
+    font-weight: 900;
+  }
+
+  & span {
+    color: #17b54e;
+    text-decoration-color: #17b54e;
+  }
+
+  &__cross {
+    font-size: 16px;
+    margin-left: auto;
+    cursor: pointer;
+  }
+
+  &[data-status="ERROR"] {
+    color: #8c0517;
+    background-color: #e375bb;
+    & a {
+      color: #8c0517;
+    }
+    & span {
+      color: #8c0517;
+    }
+  }
+}
diff --git a/scripts-2.0/components/InfoBox/types.ts b/scripts-2.0/components/InfoBox/types.ts
new file mode 100644
index 0000000..6777aef
--- /dev/null
+++ b/scripts-2.0/components/InfoBox/types.ts
@@ -0,0 +1,4 @@
+export enum InfoBoxStatus {
+  SUCCESS = "SUCCESS",
+  ERROR = "ERROR",
+}
diff --git a/scripts-2.0/components/PopupMenu/Footer/index.tsx b/scripts-2.0/components/PopupMenu/Footer/index.tsx
index d78c7c1..6351d54 100644
--- a/scripts-2.0/components/PopupMenu/Footer/index.tsx
+++ b/scripts-2.0/components/PopupMenu/Footer/index.tsx
@@ -1,102 +1,58 @@
 import * as React from "react";
-import {useEffect, useRef, useState} from "react";
-import './styles.scss';
+import "./styles.scss";
 import Button from "../../common/Button";
 import Icon from "../../Icon";
-import {IconName} from "../../../icons/types";
-import {User} from "../index";
+import { IconName } from "../../../icons/types";
+import { User } from "../index";
 import translate from "../../../Translator";
+import PathService from "../../../PathService";
+import { ContextMenuType } from "../../ContextMenu/types";
 
 export interface FooterInterface {
-    isUserWindowOpen: boolean,
-    logoutCallback: Function,
-    onPlusButtonClickCallback: Function,
-    user: User
+  logoutCallback: Function;
+  onPlusButtonClickCallback: Function;
+  user: User;
+  onSetContextMenuType?: React.Dispatch<
+    React.SetStateAction<ContextMenuType | undefined>
+  >;
 }
 
-const Footer: React.FC<FooterInterface> = (props) => {
-    const node = useRef<HTMLDivElement>(null);
-    const [isUserWindowOpen, setIsUserWindowOpen] = useState(props.isUserWindowOpen);
-    const [user, setUser] = useState<User>(props.user);
-    const logoutCallback = props.logoutCallback;
-    const onPlusButtonClickCallback = props.onPlusButtonClickCallback;
-    const serverUrl = process.env.SERVER_PROTOCOL + '://' + process.env.SERVER_DOMAIN + '/';
-
-    useEffect(() => {
-        setUser(props.user);
-    }, [props.user]);
-
-    useEffect(() => {
-        setIsUserWindowOpen(props.isUserWindowOpen);
-        document.addEventListener("click", onClickOutside);
-
-        return () => {
-            document.removeEventListener("click", onClickOutside);
-        };
-    }, [props]);
-
-    const onClickOutside = e => {
-        if (e.target.classList.contains('user-img')) {
-            return;
-        }
+const serverUrl = new PathService().getBaseUrl();
 
-        const shouldStayOpen = node.current !== null && node.current.contains(e.target);
-        if (!shouldStayOpen) {
-            setIsUserWindowOpen(false);
-        }
-    };
-
-    return (
-        <div className='tc-popup-footer'>
-            <div>
-                <Button
-                    class={'tc-popup-footer__button-add'}
-                    onClick={onPlusButtonClickCallback}
-                >
-                    <Icon name={IconName.PLAY}/>
-                </Button>
-
-                <a href={serverUrl + 'app#/timesheets/graphical'} target='_blank'>
-                    <Button class={'tc-popup-footer__button-go-to-timesheet'} onClick={() => {}}>
-                        <Icon name={IconName.CLOCK} iconPrefix={'far'}/>
-                        {translate('go_to_timesheet')}
-                    </Button>
-                </a>
-            </div>
-
-            <div className='tc-popup-footer__user-img' onClick={() => {setIsUserWindowOpen(!isUserWindowOpen)}}>
-                <img className='user-img' src={user.gravatarUrl} />
-            </div>
-
-            <div
-                className={`tc-popup-footer__user-slide-window ' ${isUserWindowOpen ? 'tc-popup-footer__user-slide-window--visible' : ''}`}
-                ref={node}
-            >
-                <div>
-                    <div className='section-top user'>
-                        <a href={serverUrl + 'app#/settings/users/me'} target='_blank'>
-                            <img className='user__img user-img' src={user.gravatarUrl} />
-                            <div>
-                                <div className='user__display-name' style={user.displayName === null ? {marginTop: '10px'} : {}}>
-                                    {user.displayName === null ? user.email : user.displayName }
-                                </div>
-                                {user.displayName && <div className='user__email'>{user.email}</div>}
-                            </div>
-                        </a>
-                    </div>
-                    <div className='section-bottom'>
-                        <Button
-                            class={'section-bottom__button-sign-out'}
-                            onClick={logoutCallback}
-                        >
-                            <Icon name={IconName.SIGN_OUT_ALT} iconPrefix={'far'}/>
-                            {translate('log_out')}
-                        </Button>
-                    </div>
-                </div>
-            </div>
+const Footer: React.FC<FooterInterface> = (props) => {
+  const { onSetContextMenuType } = props;
+  return (
+    <div className="tc-popup-footer">
+      <div className="tc-popup-footer__button-anchor">
+        <a
+          className="tc-popup-footer__button-anchor__href"
+          href={serverUrl + "app#/timesheets/graphical"}
+          target="_blank"
+        >
+          <Icon name={IconName.EXTERNAL_LINK} iconPrefix={"fal"} />
+
+          {translate("see_full_timesheet")}
+        </a>
+      </div>
+
+      <Button
+        class={"tc-popup-footer__button-cancel"}
+        onClick={() => onSetContextMenuType?.(ContextMenuType.ENTRY)}
+      >
+        <Icon name={IconName.PLUS} />
+      </Button>
+
+      <button
+        className={"tc-popup-footer__button-add"}
+        onClick={() => onSetContextMenuType?.(ContextMenuType.TIMER)}
+      >
+        <span>Start timer</span>
+        <div className="tc-popup-footer__button-add__icon">
+          <Icon name={IconName.PLAY} />
         </div>
-    );
+      </button>
+    </div>
+  );
 };
 
 export default Footer;
diff --git a/scripts-2.0/components/PopupMenu/Footer/styles.scss b/scripts-2.0/components/PopupMenu/Footer/styles.scss
index 9969ed1..d6224fc 100644
--- a/scripts-2.0/components/PopupMenu/Footer/styles.scss
+++ b/scripts-2.0/components/PopupMenu/Footer/styles.scss
@@ -1,4 +1,4 @@
-@import '../../../style/common';
+@import "../../../style/common";
 
 .tc-popup-footer {
   font-family: $defaultFontFamily;
@@ -7,30 +7,48 @@
 
   display: flex;
   justify-content: space-between;
-  border-top: solid 1px $popupBorderGray;
   padding-top: 20px;
-  margin-top: 28px;
+  margin-top: 10px;
 
-  .user-img {
-    height: 39px;
-    border-radius: 50%;
+  &__button-anchor {
+    display: flex;
+    justify-content: center;
+    align-items: flex-end;
 
-    &:hover {
-      border: solid 1px $popupGreen;
-      padding: 5px;
-      margin: -6px;
+    &__href {
+      color: #2380e3;
+      font-size: 12px;
+    }
+    & svg {
+      margin-right: 0.3rem;
     }
   }
-
-  &__button-add {
+  &__button-cancel {
+    border: solid 1px $primaryBorderColor;
+    font-family: $defaultFontFamily;
+    font-size: $defaultFontSize;
     width: 39px;
     height: 39px;
+    background-color: transparent;
+    color: #4f4f4f;
+    border-radius: 8px;
+    cursor: pointer;
+    margin-left: auto;
+    margin-right: 15px;
+  }
+  &__button-add {
+    width: 133px;
+    height: 39px;
     border-radius: 8px;
     background-color: $popupGreen;
     border: none;
     color: white;
     cursor: pointer;
-
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    padding: 0 0 0 0.5rem;
+    
     &:hover {
       opacity: 0.8;
     }
@@ -38,6 +56,17 @@
     svg {
       font-size: 17px;
     }
+
+    &__icon {
+      flex: 1;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+
+    & span {
+      text-transform: uppercase;
+    }
   }
 
   &__user-img {
@@ -66,83 +95,4 @@
       font-size: 16px;
     }
   }
-
-  &__user-slide-window {
-    box-shadow: 0 6px 32px 0 $popupShadowGray;
-    padding: 10px;
-    height: 114px;
-    width: 265px;
-    background: $popupBackground;
-    position: absolute;
-    top: 25%;
-    right: -1px;
-    display: none;
-
-    .section-top {
-      display: flex;
-      flex-direction: row;
-      padding: 10px;
-
-      &:hover {
-        background-color: $popupGrayThird;
-        border-radius: 8px;
-      }
-
-      a {
-        display: flex;
-        text-decoration: none;
-        &:visited {
-          color: inherit;
-        }
-      }
-
-      .user {
-        &__display-name {
-          margin-left: 9px;
-          font-weight: bold;
-        }
-
-        &__email {
-          margin-left: 9px;
-          color: $popupGray;
-          font-size: 12px;
-        }
-      }
-    }
-
-    .section-bottom {
-      border-top: solid 1px $popupBorderGray;
-      margin-top: 9px;
-      padding-top: 10px;
-
-      &__button-sign-out {
-        border: none;
-        cursor: pointer;
-        font-size: 14px;
-        text-align: left;
-        width: 100%;
-        height: 35px;
-        background-color: white;
-        color: $popupGraySecond;
-        font-family: $defaultFontFamily;
-        padding: 9px;
-
-        &:hover {
-          background-color: $popupGrayThird;
-          border-radius: 8px;
-        }
-
-        svg {
-          color: $popupGray;
-          font-size: 16px;
-          margin-left: 10px;
-          margin-right: 10px;
-        }
-      }
-    }
-
-    &--visible {
-      display: block;
-    }
-  }
 }
diff --git a/scripts-2.0/components/PopupMenu/Header/Header.tsx b/scripts-2.0/components/PopupMenu/Header/Header.tsx
new file mode 100644
index 0000000..b19d556
--- /dev/null
+++ b/scripts-2.0/components/PopupMenu/Header/Header.tsx
@@ -0,0 +1,62 @@
+import * as React from "react";
+// @ts-ignore
+import tcLogo from "../../../../images/logoTC-with-name.svg";
+
+// @ts-ignore
+import AvatarIconSVG from "../../../icons/user-circle-fas.svg";
+import { User } from "..";
+import "./styles.scss";
+
+import UserPopup from "./UserPopup";
+
+export interface HeaderInterface {
+  user: User;
+  setIsUserWindowOpen: React.Dispatch<React.SetStateAction<boolean>>;
+  isUserWindowOpen: boolean;
+  logoutCallback: () => void;
+}
+
+const Header: React.FC<HeaderInterface> = ({
+  user,
+  isUserWindowOpen,
+  setIsUserWindowOpen,
+  logoutCallback,
+}) => {
+  const handleClickUserAvatar = (e) => {
+    if (isUserWindowOpen) return;
+
+    setIsUserWindowOpen(true);
+    e.stopPropagation();
+  };
+
+  return (
+    <div className="tc-popup-header">
+      <img
+        className={"tc-popup-header__logo-svg"}
+        src={tcLogo}
+        alt="TimeCamp logo"
+      />
+      <div className="tc-popup-header__user-logo">
+        <div
+          className="tc-popup-header__user-logo__user-img"
+          onClick={handleClickUserAvatar}
+        >
+          <img
+            className="tc-popup-header__user-logo__user-img__avatar"
+            src={user.gravatarUrl}
+            data-status={isUserWindowOpen ? "active" : ""}
+          />
+        </div>
+      </div>
+
+      <UserPopup
+        setIsUserWindowOpen={setIsUserWindowOpen}
+        isUserWindowOpen={isUserWindowOpen}
+        user={user}
+        logoutCallback={logoutCallback}
+      />
+    </div>
+  );
+};
+
+export default Header;
diff --git a/scripts-2.0/components/PopupMenu/Header/UserPopup.tsx b/scripts-2.0/components/PopupMenu/Header/UserPopup.tsx
new file mode 100644
index 0000000..efc0572
--- /dev/null
+++ b/scripts-2.0/components/PopupMenu/Header/UserPopup.tsx
@@ -0,0 +1,77 @@
+import * as React from "react";
+import translate from "../../../Translator.js";
+import Button from "../../common/Button/";
+import "./styles.scss";
+import PathService from "../../../PathService.js";
+
+// @ts-ignore
+import ShutdownIconSVG from "../../../icons/shutdown-icon.svg";
+
+const serverUrl = new PathService().getBaseUrl();
+
+const UserPopup = ({
+  setIsUserWindowOpen,
+  isUserWindowOpen,
+  user,
+  logoutCallback,
+}) => {
+  const node = React.useRef<HTMLDivElement>(null);
+  const wrapperClassName = `tc-popup-header__user-slide-window  ${isUserWindowOpen ? "tc-popup-header__user-slide-window--visible" : ""}`;
+
+  React.useEffect(() => {
+    document.addEventListener("click", onClickOutside);
+
+    return () => {
+      document.removeEventListener("click", onClickOutside);
+    };
+  }, [setIsUserWindowOpen]);
+
+  const onClickOutside = (e) => {
+    const shouldStayOpen =
+      node.current !== null && node.current.contains(e.target);
+    if (!shouldStayOpen) {
+      setIsUserWindowOpen(false);
+    }
+  };
+
+  return (
+    <div className={wrapperClassName} ref={node}>
+      <div>
+        <div className="section-top">
+          <a href={serverUrl + "app#/settings/users/me"} target="_blank">
+            <div className="section-top__image">
+              <img className="user__img user-img" src={user.gravatarUrl} />
+            </div>
+            <div className="section-top__user">
+              <div
+                className="section-top__user__display-name"
+                style={user.displayName === null ? { marginTop: "10px" } : {}}
+              >
+                {user.displayName === null ? user.email : user.displayName}
+              </div>
+              {user.displayName && (
+                <div className="section-top__user__email">{user.email}</div>
+              )}
+            </div>
+          </a>
+        </div>
+        <a
+          className="section-middle-timecamp"
+          href={serverUrl}
+          target="_blank"
+          rel="noreferrer"
+        >
+          <img src={"images/icon-14.png"} alt="TimeCamp logo"></img>
+          <span>TimeCamp Web</span>
+        </a>
+
+        <Button class={"section-bottom"} onClick={logoutCallback}>
+          <img src={ShutdownIconSVG} alt="shutdown svg" />
+          {translate("log_out")}
+        </Button>
+      </div>
+    </div>
+  );
+};
+
+export default UserPopup;
diff --git a/scripts-2.0/components/PopupMenu/Header/index.tsx b/scripts-2.0/components/PopupMenu/Header/index.tsx
new file mode 100644
index 0000000..2764567
--- /dev/null
+++ b/scripts-2.0/components/PopupMenu/Header/index.tsx
@@ -0,0 +1 @@
+export { default } from "./Header";
diff --git a/scripts-2.0/components/PopupMenu/Header/styles.scss b/scripts-2.0/components/PopupMenu/Header/styles.scss
new file mode 100644
index 0000000..286114b
--- /dev/null
+++ b/scripts-2.0/components/PopupMenu/Header/styles.scss
@@ -0,0 +1,164 @@
+@import "../../../style/common";
+
+@mixin before-divider-mixin {
+  position: relative;
+  &:before {
+    content: "";
+    top: 0;
+    left: 50%;
+    height: 1px;
+    width: 90%;
+    z-index: 10;
+    transform: translateX(-50%);
+
+    background: $popupBorderGray;
+    position: absolute;
+  }
+}
+
+.tc-popup-header {
+  display: flex;
+
+  &__logo-svg {
+    top: 5px;
+  }
+
+  &__user-logo {
+    margin-left: auto;
+
+    &__user-img {
+      cursor: pointer;
+
+      &__avatar {
+        height: 38px;
+        border-radius: 50%;
+        border: 1px solid transparent;
+        box-shadow: 0 0 0 2px transparent;
+        &[data-status="active"] {
+          box-shadow: 0 0 0 2px #4bb063;
+        }
+      }
+    }
+  }
+  &__user-slide-window {
+    box-shadow: 0 6px 32px 0 $popupShadowGray;
+    padding: 10px;
+    width: 265px;
+    background: $popupBackground;
+
+    position: absolute;
+    top: 25%;
+    right: -1px;
+    display: none;
+
+    &--visible {
+      display: block;
+    }
+
+    .section-top {
+      padding: 10px;
+
+      &:hover {
+        background-color: $popupGrayThird;
+        border-radius: 8px;
+      }
+
+      a {
+        display: flex;
+        text-decoration: none;
+
+        &:visited {
+          color: inherit;
+        }
+      }
+
+      &__image {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+
+        .user-img {
+          height: 39px;
+          border-radius: 50%;
+
+          &:hover {
+            border: solid 1px $popupGreen;
+            padding: 5px;
+            margin: -6px;
+          }
+        }
+      }
+
+      &__user {
+        padding-left: 10px;
+
+        &__display-name {
+          font-size: 14px;
+          font-weight: 400;
+          color: $primaryTextColor;
+        }
+
+        &__email {
+          white-space: nowrap;
+          color: $secondaryTextColor;
+          font-size: 10px;
+        }
+      }
+    }
+
+    .section-middle-timecamp {
+      display: flex;
+      color: inherit;
+      text-decoration: none;
+      align-items: center;
+      padding: 15px;
+      padding-left: 9px;
+
+      @include before-divider-mixin;
+
+      & img {
+        margin-right: 10px;
+        margin-left: 5px;
+      }
+
+      &:hover {
+        background-color: $popupGrayThird;
+        border-radius: 8px;
+      }
+    }
+
+    .section-bottom {
+      padding: 15px;
+
+      border: none;
+      cursor: pointer;
+      font-size: 14px;
+      text-align: left;
+      width: 100%;
+
+      color: $popupGraySecond;
+      font-family: $defaultFontFamily;
+      background-color: white;
+
+      display: flex;
+      align-items: center;
+
+      &:hover {
+        background-color: $popupGrayThird;
+        border-radius: 8px;
+
+        & button {
+          background-color: $popupGrayThird;
+        }
+      }
+      img {
+        color: $popupGray;
+        font-size: 18px;
+
+        margin-right: 15px;
+      }
+
+      @include before-divider-mixin;
+    }
+  }
+}
diff --git a/scripts-2.0/components/PopupMenu/WorkingTimerSection/index.tsx b/scripts-2.0/components/PopupMenu/WorkingTimerSection/index.tsx
index 34e9a2d..d8fbebb 100644
--- a/scripts-2.0/components/PopupMenu/WorkingTimerSection/index.tsx
+++ b/scripts-2.0/components/PopupMenu/WorkingTimerSection/index.tsx
@@ -6,7 +6,8 @@ import tcStopButton from "../../../icons/stop-button-small.svg";
 import {Entry} from "../index";
 import translate from "../../../Translator";
 import TimeFormatter, {DURATION_FORMATS} from "../../../TimeFormatter";
-
+import Icon from '../../Icon'
+import {IconName} from '../../../icons/types'
 const timeFormatter = new TimeFormatter();
 
 export interface WorkingTimerSectionInterface {
@@ -56,7 +57,10 @@ const WorkingTimerSection: React.FC<WorkingTimerSectionInterface> = (props) => {
                             <div className='name'>{entry.taskName}</div>
                         </div>
                         {entry.breadcrumb && <div className='entry__breadcrumb'>{entry.breadcrumb}</div>}
-                        <div className='entry__note'>{entry.note}</div>
+                        {entry.note && <div className='entry__note'>
+                            <Icon name={IconName.STICKY_NOTE} iconPrefix={"far"} />&nbsp;&nbsp;&nbsp;
+                            {entry.note}
+                        </div>}
                     </div>
 
                     <div className='right'>
diff --git a/scripts-2.0/components/PopupMenu/WorkingTimerSection/styles.scss b/scripts-2.0/components/PopupMenu/WorkingTimerSection/styles.scss
index d435cbc..f26a217 100644
--- a/scripts-2.0/components/PopupMenu/WorkingTimerSection/styles.scss
+++ b/scripts-2.0/components/PopupMenu/WorkingTimerSection/styles.scss
@@ -1,4 +1,4 @@
-@import '../../../style/common';
+@import "../../../style/common";
 
 .working-timer {
   font-family: $defaultFontFamily;
@@ -12,7 +12,7 @@
   }
 
   &__entry {
-    border: solid 1px $popupBorderGray;
+    border: dashed 2px $popupBorderGray;
     border-radius: 8px;
     width: 360px;
     height: 52px;
@@ -21,6 +21,10 @@
     align-items: center;
     padding: 15px;
 
+    &--active {
+      border-style: solid;
+    }
+
     .entry-empty-info {
       color: $popupDisabledFontColor;
     }
@@ -80,7 +84,13 @@
 
       .right {
         display: flex;
-        flex-direction: column;
+        flex-direction: row;
+        align-items: center;
+        white-space: nowrap;
+
+        & .entry__timer{
+          margin-right:10px;
+        }
       }
     }
 
diff --git a/scripts-2.0/components/PopupMenu/index.tsx b/scripts-2.0/components/PopupMenu/index.tsx
index deb56d8..1c5dd76 100644
--- a/scripts-2.0/components/PopupMenu/index.tsx
+++ b/scripts-2.0/components/PopupMenu/index.tsx
@@ -1,14 +1,18 @@
-const browser = require('webextension-polyfill');
+const browser = require("webextension-polyfill");
 import * as React from "react";
-import Header from "../Header";
-import {useEffect, useState, useMemo} from "react";
-import WorkingTimerSection from "./WorkingTimerSection";
-import Footer from "./Footer";
-import './styles.scss';
-import LoginWindow from "../LoginWindow";
+import { useEffect, useMemo, useState } from "react";
 import ContextMenu from "../ContextMenu";
-import Gravatar from "../../helpers/Gravatar";
+import LoginWindow from "../LoginWindow";
+import Footer from "./Footer";
+import Header from "./Header";
+import WorkingTimerSection from "./WorkingTimerSection";
+import "./styles.scss";
+
 import DateTime from "../../helpers/DateTime";
+import Gravatar from "../../helpers/Gravatar";
+import InfoBox from "../InfoBox";
+import { InfoBoxStatus } from "../InfoBox/types";
+import { ContextMenuType } from "../ContextMenu/types";
 
 const gravatar = new Gravatar();
 const dateTime = new DateTime();
@@ -45,18 +49,22 @@ const PopupMenu: React.FC<PopupMenuInterface> = (props) => {
         color: '#aaa',
     }
 
-    const [isUserWindowOpen, setIsUserWindowOpen] = useState(false);
-    const [isContextMenuOpen, setIsContextMenuOpen] = useState(false);
-    const [isUserLogged, setIsUserLogged] = useState(false);
-    const [user, setUser] = useState<User>(emptyUser);
-    const [entry, setEntry] = useState<Entry>(emptyEntry);
-    const [isTimerWorking, setIsTimerWorking] = useState(false);
+  const [isUserWindowOpen, setIsUserWindowOpen] = useState(false);
+  const [contextMenuType, setContextMenuType] = useState<
+    ContextMenuType | undefined
+  >(undefined);
+  const [isUserLogged, setIsUserLogged] = useState(false);
+  const [user, setUser] = useState<User>(emptyUser);
+  const [entry, setEntry] = useState<Entry>(emptyEntry);
+  const [isTimerWorking, setIsTimerWorking] = useState(false);
+  const [timeEntryAddedInfoBoxStatus, settimeEntryAddedInfoBoxStatus] =
+    useState<InfoBoxStatus | undefined>(undefined);
 
-    const setCurrentEntry = (currentEntry) => {
-        if (currentEntry === null) {
-            setIsTimerWorking(false);
-            return;
-        }
+  const setCurrentEntry = (currentEntry) => {
+    if (currentEntry === null) {
+      setIsTimerWorking(false);
+      return;
+    }
 
         let entry = {
             taskName: currentEntry.description !== undefined ? currentEntry.description : emptyEntry.taskName,
@@ -93,6 +101,7 @@ const PopupMenu: React.FC<PopupMenuInterface> = (props) => {
             type: 'logOut'
         }).then(() => {
             setIsUserWindowOpen(false);
+            setContextMenuType(undefined);
             setIsUserLogged(false);
             setUser(emptyUser);
         }).catch(() => {
@@ -136,7 +145,8 @@ const PopupMenu: React.FC<PopupMenuInterface> = (props) => {
                 buttonHash: buttonHash
             }).then((response) => {
                 setIsTimerWorking(true);
-                setIsContextMenuOpen(false);
+                setContextMenuType(undefined);
+                
 
                 let entry = {
                     taskName: response.name === null ? emptyEntry.taskName : response.name,
@@ -176,8 +186,10 @@ const PopupMenu: React.FC<PopupMenuInterface> = (props) => {
                 service: service,
                 buttonHash: buttonHash
             }).then((response) => {
+                settimeEntryAddedInfoBoxStatus(InfoBoxStatus.SUCCESS);
                 resolve(response);
             }).catch((response) => {
+                settimeEntryAddedInfoBoxStatus(InfoBoxStatus.ERROR);
                 reject(response);
             });
         });
@@ -212,48 +224,67 @@ const PopupMenu: React.FC<PopupMenuInterface> = (props) => {
         });
     }, []);
 
-    return (
-        <div className='popup-container'>
-            <div className={`tc-popup ${!isUserLogged || isContextMenuOpen ? 'tc-popup--hidden' : ''}`}>
-                <Header />
-                <WorkingTimerSection
-                    isTimerWorking={isTimerWorking}
-                    entry={entry}
-                    stopTimerCallback={stopTimer}
-                />
-                <Footer
-                    isUserWindowOpen={isUserWindowOpen}
-                    user={user}
-                    logoutCallback={logOut}
-                    onPlusButtonClickCallback={()=>{setIsContextMenuOpen(true);}}
-                />
-            </div>
+  return (
+    <div className="popup-container">
+      <div
+        className={`tc-popup ${!isUserLogged || contextMenuType ? "tc-popup--hidden" : ""}`}
+      >
+        <Header
+          user={user}
+          logoutCallback={logOut}
+          isUserWindowOpen={isUserWindowOpen}
+          setIsUserWindowOpen={setIsUserWindowOpen}
+        />
+        <InfoBox
+          status={timeEntryAddedInfoBoxStatus}
+          onClose={() => settimeEntryAddedInfoBoxStatus(undefined)}
+        />
+        <WorkingTimerSection
+          isTimerWorking={isTimerWorking}
+          entry={entry}
+          stopTimerCallback={stopTimer}
+        />
+        <Footer
+          user={user}
+          logoutCallback={logOut}
+          onPlusButtonClickCallback={() => {}}
+          onSetContextMenuType={setContextMenuType}
+        />
+      </div>
 
-            {!isUserLogged && <div className='timecamp login-window-wrapper'>
-                <LoginWindow
-                    position={{ left: 0, top: 0 }}
-                />
-            </div>}
+      {!isUserLogged && (
+        <div className="timecamp login-window-wrapper">
+          <LoginWindow position={{ left: 0, top: 0 }} />
+        </div>
+      )}
 
-            {isContextMenuOpen && <div className='timecamp'>
-                <ContextMenu
-                    service={'chrome_plugin'}
-                    position={{ left: 0, top: 0 }}
-                    note={''}
-                    billable={true}
-                    startTimerCallback={startTimer}
-                    addTimeEntryCallback={addTimeEntry}
-                    billableInputVisibility={null}
-                    externalTaskId={''}
-                    buttonHash={null}
-                    isBackendIntegration={false}
-                    taskNotFoundInBackendIntegrationInfo={''}
-                    onCloseCallback={() => {setIsContextMenuOpen(false)}}
-                    embedOnPopup={true}
-                />
-            </div>}
+      {contextMenuType && (
+        <div className="timecamp">
+          <ContextMenu
+            service={"chrome_plugin"}
+            position={{ left: 0, top: 0 }}
+            note={""}
+            billable={true}
+            startTimerCallback={startTimer}
+            addTimeEntryCallback={
+              contextMenuType === ContextMenuType.ENTRY
+                ? addTimeEntry
+                : undefined
+            }
+            billableInputVisibility={null}
+            externalTaskId={""}
+            buttonHash={null}
+            isBackendIntegration={false}
+            taskNotFoundInBackendIntegrationInfo={""}
+            onCloseCallback={() => {
+              setContextMenuType(undefined);
+            }}
+            embedOnPopup={true}
+          />
         </div>
-    );
+      )}
+    </div>
+  );
 };
 
 export default PopupMenu;
diff --git a/scripts-2.0/components/TimeSelectors/index.tsx b/scripts-2.0/components/TimeSelectors/index.tsx
index 4257a9d..824abfa 100644
--- a/scripts-2.0/components/TimeSelectors/index.tsx
+++ b/scripts-2.0/components/TimeSelectors/index.tsx
@@ -16,7 +16,7 @@ export interface TimeSelectorsInterface {
     stopTime: Date|null,
     durationFormat?: number|null,
     onStartTimeValueChange(newValue: any): any
-    onStopTimeValueChange(newValue: any): any
+    onStopTimeValueChange?(newValue: any): any
 }
 
 const TimeSelectors: React.FC<TimeSelectorsInterface> = (props) => {
@@ -61,7 +61,7 @@ const TimeSelectors: React.FC<TimeSelectorsInterface> = (props) => {
     }, [startTime]);
 
     useEffect(() => {
-        props.onStopTimeValueChange(stopTime);
+        props.onStopTimeValueChange?.(stopTime);
         validateBoth();
         validateStartTime();
         calculateAndSetDuration();
@@ -138,29 +138,34 @@ const TimeSelectors: React.FC<TimeSelectorsInterface> = (props) => {
                 />
 
             </div>
+            {
+                props.onStopTimeValueChange ?  <React.Fragment>
+                    <div className='time-selector time-selectors__stop'>
+                        <label>{translate('stop')}</label>
+                        <TimePicker
+                            is12hFormat={is12hFormat}
+                            time={stopTime}
+                            placeholder={translate('stop time')}
+                            canBeNull={true}
+                            onValueChange={(value) => {
+                                if (value != undefined) {
+                                    value = new Date(value.getTime());
+                                }
+                                setStopTime(value);
+                            }}
+                        />
+                    </div>
+                    <div className='time-selector time-selectors__duration'>
+                        <label>{translate('duration')}</label>
+                        <input
+                            className='time-selector__input'
+                            value={duration}
+                        />
+                    </div>                
+                </React.Fragment> : null
+            }
+
 
-            <div className='time-selector time-selectors__stop'>
-                <label>{translate('stop')}</label>
-                <TimePicker
-                    is12hFormat={is12hFormat}
-                    time={stopTime}
-                    placeholder={translate('stop time')}
-                    canBeNull={true}
-                    onValueChange={(value) => {
-                        if (value != undefined) {
-                            value = new Date(value.getTime());
-                        }
-                        setStopTime(value);
-                    }}
-                />
-            </div>
-            <div className='time-selector time-selectors__duration'>
-                <label>{translate('duration')}</label>
-                <input
-                    className='time-selector__input'
-                    value={duration}
-                />
-            </div>
         </div>
     );
 }
diff --git a/scripts-2.0/helpers/Gravatar.js b/scripts-2.0/helpers/Gravatar.js
index 45e176d..4dc9e51 100644
--- a/scripts-2.0/helpers/Gravatar.js
+++ b/scripts-2.0/helpers/Gravatar.js
@@ -1,5 +1,8 @@
 import md5 from 'crypto-js/md5';
 
+//@ts-ignore
+import AvatarIconSVG from "../icons/user-circle-fas.svg";
+
 const AVATAR_URL = 'https://www.gravatar.com/avatar/';
 
 export default class Gravatar {
@@ -15,6 +18,6 @@ export default class Gravatar {
     }
 
     getDefaultImageUrl = () => {
-        return AVATAR_URL + 'aaa?s=120&d=mm';
+        return AvatarIconSVG;
     }
 }
diff --git a/scripts-2.0/icons/index.tsx b/scripts-2.0/icons/index.tsx
index 934e190..7f92e81 100644
--- a/scripts-2.0/icons/index.tsx
+++ b/scripts-2.0/icons/index.tsx
@@ -1,4 +1,4 @@
-import { library } from '@fortawesome/fontawesome-svg-core';
+import { library } from "@fortawesome/fontawesome-svg-core";
 import {
   faSync,
   faCaretUp,
@@ -18,7 +18,6 @@ import {
   faUndo,
   faTimes,
   faAsterisk,
-  faUserCircle,
   faSpinner,
   faBriefcase,
   faFileInvoiceDollar,
@@ -31,8 +30,8 @@ import {
   faTimesCircle,
   faPlus,
   faHeartBroken,
-  faDollarSign,
-} from '@fortawesome/pro-solid-svg-icons';
+  faDollarSign
+} from "@fortawesome/pro-solid-svg-icons";
 
 import {
   faTimesCircle as farTimesCircle,
@@ -41,8 +40,9 @@ import {
   faCalendarAlt as farCalendarAlt,
   faSignOutAlt as farSignOutAlt,
   faChartPie as farChartPie,
-  faClock as farClock
-} from '@fortawesome/pro-regular-svg-icons';
+  faClock as farClock,
+  faStickyNote as farStickyNote
+} from "@fortawesome/pro-regular-svg-icons";
 
 import {
   faGrinBeamSweat as falGrinBeamSweat,
@@ -60,9 +60,10 @@ import {
   faUserClock as falUserClock,
   faChevronDown as falChevronDown,
   faChevronUp as falChevronUp,
-} from '@fortawesome/pro-light-svg-icons';
+  faExternalLink as falExternalLink,
+} from "@fortawesome/pro-light-svg-icons";
 
-import { faGoogle } from '@fortawesome/free-brands-svg-icons';
+import { faGoogle } from "@fortawesome/free-brands-svg-icons";
 
 /* Add icons to library */
 library.add(
@@ -85,7 +86,7 @@ library.add(
   faTimes,
   faAsterisk,
   faSpinner,
-  faUserCircle,
+
   faBriefcase,
   faFileInvoiceDollar,
   faCalendarCheck,
@@ -121,4 +122,6 @@ library.add(
   falUserClock,
   falChevronDown,
   falChevronUp,
+  falExternalLink,
+  farStickyNote 
 );
diff --git a/scripts-2.0/icons/shutdown-icon.svg b/scripts-2.0/icons/shutdown-icon.svg
new file mode 100644
index 0000000..601ecdc
--- /dev/null
+++ b/scripts-2.0/icons/shutdown-icon.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.3427 1.86693C18.1411 3.64113 20 6.76613 20 10.3226C20 15.8387 15.5323 20.3105 10.0202 20.3226C4.51613 20.3347 0.00807106 15.8468 6.54704e-06 10.3387C-0.00402571 6.77419 1.85484 3.64113 4.65726 1.86693C4.89113 1.71774 5.20162 1.79435 5.33871 2.03629L5.49597 2.31855C5.62097 2.54435 5.54839 2.82661 5.33065 2.96371C2.8992 4.51613 1.29033 7.24193 1.29033 10.3226C1.29033 15.1573 5.21372 19.0323 10 19.0323C14.8347 19.0323 18.7097 15.1089 18.7097 10.3226C18.7097 7.21774 17.0927 4.50806 14.6653 2.96774C14.4476 2.83064 14.375 2.54435 14.5 2.32258L14.6573 2.04032C14.7944 1.79435 15.1089 1.72177 15.3427 1.86693ZM10.6452 11.129V0.483871C10.6452 0.217742 10.4274 0 10.1613 0H9.83871C9.57258 0 9.35484 0.217742 9.35484 0.483871V11.129C9.35484 11.3952 9.57258 11.6129 9.83871 11.6129H10.1613C10.4274 11.6129 10.6452 11.3952 10.6452 11.129Z" fill="#6B6B6B"/>
+</svg>
diff --git a/scripts-2.0/icons/types.tsx b/scripts-2.0/icons/types.tsx
index 60200b7..ed595a4 100644
--- a/scripts-2.0/icons/types.tsx
+++ b/scripts-2.0/icons/types.tsx
@@ -51,4 +51,7 @@ export enum IconName {
   CHART_PIE = 'chart-pie',
   CLOCK = 'clock',
   USER_CLOCK = 'user-clock',
+  EXTERNAL_LINK='external-link',
+  POWER_OFF='power-off',
+  STICKY_NOTE='sticky-note'
 }
diff --git a/scripts-2.0/icons/user-circle-fas.svg b/scripts-2.0/icons/user-circle-fas.svg
new file mode 100644
index 0000000..a1e22fd
--- /dev/null
+++ b/scripts-2.0/icons/user-circle-fas.svg
@@ -0,0 +1,3 @@
+<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.2188 16.6875C25.2188 18.1152 24.7954 19.5109 24.0022 20.698C23.209 21.8851 22.0816 22.8104 20.7625 23.3568C19.4434 23.9031 17.992 24.0461 16.5917 23.7675C15.1914 23.489 13.9051 22.8015 12.8956 21.7919C11.886 20.7824 11.1985 19.4961 10.92 18.0958C10.6414 16.6955 10.7844 15.2441 11.3308 13.925C11.8771 12.606 12.8024 11.4785 13.9895 10.6853C15.1766 9.89212 16.5723 9.46875 18 9.46875C19.9145 9.46875 21.7507 10.2293 23.1044 11.5831C24.4582 12.9369 25.2188 14.773 25.2188 16.6875ZM35.0625 18C35.0625 21.3746 34.0618 24.6735 32.187 27.4794C30.3121 30.2853 27.6473 32.4723 24.5295 33.7637C21.4118 35.0551 17.9811 35.393 14.6713 34.7346C11.3615 34.0763 8.32123 32.4512 5.935 30.065C3.54876 27.6788 1.92372 24.6385 1.26536 21.3287C0.606999 18.0189 0.944893 14.5882 2.23631 11.4705C3.52773 8.3527 5.71468 5.6879 8.52059 3.81305C11.3265 1.9382 14.6254 0.9375 18 0.9375C22.5226 0.946172 26.8575 2.74661 30.0554 5.94457C33.2534 9.14253 35.0538 13.4774 35.0625 18ZM32.4375 18C32.4384 15.6617 31.8713 13.3581 30.785 11.2875C29.6987 9.2168 28.1257 7.44097 26.2012 6.11269C24.2768 4.78441 22.0586 3.94342 19.7372 3.66206C17.4159 3.3807 15.061 3.66738 12.8749 4.49745C10.6889 5.32751 8.73719 6.67612 7.18765 8.42731C5.63811 10.1785 4.5371 12.2798 3.9793 14.5507C3.4215 16.8215 3.42362 19.1938 3.98545 21.4636C4.54729 23.7334 5.65204 25.8328 7.2047 27.5813C8.26713 26.0572 9.63622 24.772 11.2242 23.8078C13.0475 25.5546 15.475 26.5297 18 26.5297C20.525 26.5297 22.9525 25.5546 24.7758 23.8078C26.3638 24.772 27.7329 26.0572 28.7953 27.5813C31.1457 24.9437 32.4423 21.5329 32.4375 18Z" fill="#6B6B6B"/>
+</svg>