diff --git a/frontend/app/components/Session_/Autoplay/Autoplay.tsx b/frontend/app/components/Session_/Autoplay/Autoplay.tsx
index a83aa3997..5f54b4a8a 100644
--- a/frontend/app/components/Session_/Autoplay/Autoplay.tsx
+++ b/frontend/app/components/Session_/Autoplay/Autoplay.tsx
@@ -2,8 +2,7 @@ import React, { useEffect } from 'react';
 import { connect } from 'react-redux';
 import { setAutoplayValues } from 'Duck/sessions';
 import { session as sessionRoute } from 'App/routes';
-import { Link, Icon, Toggler, Tooltip } from 'UI';
-import { Controls as PlayerControls, connectPlayer } from 'Player';
+import { Link, Icon, Tooltip } from 'UI';
 import { withRouter, RouteComponentProps } from 'react-router-dom';
 import cn from 'classnames';
 import { fetchAutoplaySessions } from 'Duck/search';
@@ -13,12 +12,10 @@ const PER_PAGE = 10;
 interface Props extends RouteComponentProps {
   previousId: string;
   nextId: string;
-  autoplay: boolean;
   defaultList: any;
   currentPage: number;
   total: number;
   setAutoplayValues?: () => void;
-  toggleAutoplay?: () => void;
   latestRequestTime: any;
   sessionIds: any;
   fetchAutoplaySessions?: (page: number) => Promise<void>;
@@ -29,7 +26,6 @@ function Autoplay(props: Props) {
     nextId,
     currentPage,
     total,
-    autoplay,
     sessionIds,
     latestRequestTime,
     match: {
@@ -54,14 +50,6 @@ function Autoplay(props: Props) {
 
   return (
     <div className="flex items-center">
-      <div
-        onClick={props.toggleAutoplay}
-        className="cursor-pointer flex items-center mr-2 hover:bg-gray-light-shade rounded-md p-2"
-      >
-        <Toggler name="sessionsLive" onChange={props.toggleAutoplay} checked={autoplay} />
-        <span className="ml-2 whitespace-nowrap">Auto-Play</span>
-      </div>
-
       <Tooltip
         placement="bottom"
         title={<div className="whitespace-nowrap">Play Previous Session</div>}
@@ -111,13 +99,4 @@ export default connect(
     latestRequestTime: state.getIn(['search', 'latestRequestTime']),
   }),
   { setAutoplayValues, fetchAutoplaySessions }
-)(
-  connectPlayer(
-    (state: any) => ({
-      autoplay: state.autoplay,
-    }),
-    {
-      toggleAutoplay: PlayerControls.toggleAutoplay,
-    }
-  )(withRouter(Autoplay))
-);
+)(withRouter(Autoplay));
diff --git a/frontend/app/components/Session_/Issues/Issues.js b/frontend/app/components/Session_/Issues/Issues.js
index 3c037a019..2cc309624 100644
--- a/frontend/app/components/Session_/Issues/Issues.js
+++ b/frontend/app/components/Session_/Issues/Issues.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import { connect } from 'react-redux';
-import { Icon, Popover } from 'UI';
+import { Icon, Popover, Button } from 'UI';
 import IssuesModal from './IssuesModal';
 import { fetchProjects, fetchMeta } from 'Duck/assignments';
 import stl from './issues.module.css';
@@ -67,30 +67,27 @@ class Issues extends React.Component {
     const provider = issuesIntegration.provider;
 
     return (
-      <div className="relative h-full w-full p-3">
-        <div className={stl.buttonWrapper}>
-          <Popover
-            onOpen={this.handleOpen}
-            render={({ close }) => (
-              <div>
-                <IssuesModal
-                  provider={provider}
-                  sessionId={sessionId}
-                  closeHandler={close}
-                />
-              </div>
-            )}
-          >
-            <div
-              className="flex items-center"
-              disabled={!isModalDisplayed && (metaLoading || fetchIssuesLoading || projectsLoading)}
-            >
-              <Icon name={`integrations/${provider === 'jira' ? 'jira' : 'github'}`} size="16" />
-              <span className="ml-2">Create Issue</span>
-            </div>
-          </Popover>
+      <Popover
+        onOpen={this.handleOpen}
+        render={({ close }) => (
+          <div>
+            <IssuesModal provider={provider} sessionId={sessionId} closeHandler={close} />
+          </div>
+        )}
+      >
+        <div className="relative">
+          <Button icon={`integrations/${provider === 'jira' ? 'jira' : 'github'}`} variant="text">
+            Create Issue
+          </Button>
         </div>
-      </div>
+        {/* <div
+        className="flex items-center cursor-pointer"
+        disabled={!isModalDisplayed && (metaLoading || fetchIssuesLoading || projectsLoading)}
+      >
+        <Icon name={`integrations/${provider === 'jira' ? 'jira' : 'github'}`} size="16" />
+        <span className="ml-2 whitespace-nowrap">Create Issue</span>
+      </div> */}
+      </Popover>
     );
   }
 }
diff --git a/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx b/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx
index a99633bb4..83d993e6b 100644
--- a/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx
+++ b/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx
@@ -1,9 +1,9 @@
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react';
 import cn from 'classnames';
-import { connect } from 'react-redux'
+import { connect } from 'react-redux';
 import { withRouter, RouteComponentProps } from 'react-router-dom';
-import { Button, Link } from 'UI'
-import { session as sessionRoute, withSiteId } from 'App/routes'
+import { Button, Link } from 'UI';
+import { session as sessionRoute, withSiteId } from 'App/routes';
 import stl from './AutoplayTimer.module.css';
 import clsOv from './overlay.module.css';
 
@@ -13,49 +13,53 @@ interface IProps extends RouteComponentProps {
 }
 
 function AutoplayTimer({ nextId, siteId, history }: IProps) {
-  let timer: NodeJS.Timer
+  let timer: NodeJS.Timer;
   const [cancelled, setCancelled] = useState(false);
   const [counter, setCounter] = useState(5);
 
   useEffect(() => {
-    if(counter > 0) {
+    if (counter > 0) {
       timer = setTimeout(() => {
-        setCounter(counter - 1)
-      }, 1000)
+        setCounter(counter - 1);
+      }, 1000);
     }
 
     if (counter === 0) {
-      history.push(withSiteId(sessionRoute(nextId), siteId))
+      history.push(withSiteId(sessionRoute(nextId), siteId));
     }
 
     return () => clearTimeout(timer);
-  }, [counter])
+  }, [counter]);
 
   const cancel = () => {
-    clearTimeout(timer)
-    setCancelled(true)
-  }
+    clearTimeout(timer);
+    setCancelled(true);
+  };
 
-  if (cancelled)
-    return null
+  if (cancelled) return null;
 
   return (
-    <div className={ cn(clsOv.overlay, stl.overlayBg) } >
+    <div className={cn(clsOv.overlay, stl.overlayBg)}>
       <div className="border p-6 shadow-lg bg-white rounded">
         <div className="py-4">Next recording will be played in {counter}s</div>
         <div className="flex items-center">
-          <Button primary="outline" onClick={cancel}>Cancel</Button>
+          <Button primary="outline" onClick={cancel}>
+            Cancel
+          </Button>
           <div className="px-3" />
-          <Link to={ sessionRoute(nextId) } disabled={!nextId}>
+          <Link to={sessionRoute(nextId)} disabled={!nextId}>
             <Button variant="primary">Play Now</Button>
           </Link>
         </div>
+        <div className="mt-2 italic">Turn on/off auto-replay in: More options</div>
       </div>
     </div>
-  )
+  );
 }
 
-export default withRouter(connect(state => ({
-  siteId: state.getIn([ 'site', 'siteId' ]),
-  nextId: parseInt(state.getIn([ 'sessions', 'nextId' ])),
-}))(AutoplayTimer))
+export default withRouter(
+  connect((state: any) => ({
+    siteId: state.getIn(['site', 'siteId']),
+    nextId: parseInt(state.getIn(['sessions', 'nextId'])),
+  }))(AutoplayTimer)
+);
diff --git a/frontend/app/components/Session_/Subheader.js b/frontend/app/components/Session_/Subheader.js
index a1ee8e48d..b45c49e00 100644
--- a/frontend/app/components/Session_/Subheader.js
+++ b/frontend/app/components/Session_/Subheader.js
@@ -10,6 +10,7 @@ import { connectPlayer, pause } from 'Player';
 import ItemMenu from './components/HeaderMenu';
 import { useModal } from 'App/components/Modal';
 import BugReportModal from './BugReport/BugReportModal';
+import AutoplayToggle from 'Shared/AutoplayToggle';
 
 function SubHeader(props) {
   const [isCopied, setCopied] = React.useState(false);
@@ -29,8 +30,16 @@ function SubHeader(props) {
       exceptionsList: props.exceptionsList,
       eventsList: props.eventsList,
       endTime: props.endTime,
-    }
-    showModal(<BugReportModal width={props.width} height={props.height} xrayProps={xrayProps} hideModal={hideModal} />, { right: true });
+    };
+    showModal(
+      <BugReportModal
+        width={props.width}
+        height={props.height}
+        xrayProps={xrayProps}
+        hideModal={hideModal}
+      />,
+      { right: true }
+    );
   };
 
   return (
@@ -55,39 +64,31 @@ function SubHeader(props) {
           className="ml-auto text-sm flex items-center color-gray-medium gap-2"
           style={{ width: 'max-content' }}
         >
-          <Button icon="file-pdf" variant="text" onClick={showReportModal}>Create Bug Report</Button>
+          <Button icon="file-pdf" variant="text" onClick={showReportModal}>
+            Create Bug Report
+          </Button>
           <NotePopup />
+          <Issues sessionId={props.sessionId} />
+          <SharePopup
+            entity="sessions"
+            id={props.sessionId}
+            showCopyLink={true}
+            trigger={
+              <div className="relative">
+                <Button icon="share-alt" variant="text" className="relative">
+                  Share
+                </Button>
+              </div>
+            }
+          />
           <ItemMenu
             items={[
+              {
+                key: 1,
+                component: <AutoplayToggle />,
+              },
               {
                 key: 2,
-                component: props.jiraConfig && props.jiraConfig.token && (
-                  <Issues sessionId={props.sessionId} />
-                ),
-              },
-              {
-                key: 3,
-                component: (
-                  <SharePopup
-                    entity="sessions"
-                    id={props.sessionId}
-                    showCopyLink={true}
-                    trigger={
-                      <div className="flex items-center h-full w-full">
-                        <Icon
-                          className="mr-2"
-                          disabled={props.disabled}
-                          name="share-alt"
-                          size="16"
-                        />
-                        <span>Share</span>
-                      </div>
-                    }
-                  />
-                ),
-              },
-              {
-                key: 4,
                 component: <Bookmark noMargin sessionId={props.sessionId} />,
               },
             ]}
@@ -102,20 +103,17 @@ function SubHeader(props) {
   );
 }
 
-const SubH = connectPlayer(
-  (state) => ({
-    width: state.width,
-    height: state.height,
-    currentLocation: state.location,
-    resourceList: state.resourceList
-      .filter((r) => r.isRed() || r.isYellow())
-      .concat(state.fetchList.filter((i) => parseInt(i.status) >= 400))
-      .concat(state.graphqlList.filter((i) => parseInt(i.status) >= 400)),
-    exceptionsList: state.exceptionsList,
-    eventsList: state.eventList,
-    endTime: state.endTime,
-  })
-
-  )(SubHeader);
+const SubH = connectPlayer((state) => ({
+  width: state.width,
+  height: state.height,
+  currentLocation: state.location,
+  resourceList: state.resourceList
+    .filter((r) => r.isRed() || r.isYellow())
+    .concat(state.fetchList.filter((i) => parseInt(i.status) >= 400))
+    .concat(state.graphqlList.filter((i) => parseInt(i.status) >= 400)),
+  exceptionsList: state.exceptionsList,
+  eventsList: state.eventList,
+  endTime: state.endTime,
+}))(SubHeader);
 
 export default React.memo(SubH);
diff --git a/frontend/app/components/shared/AutoplayToggle/AutoplayToggle.tsx b/frontend/app/components/shared/AutoplayToggle/AutoplayToggle.tsx
new file mode 100644
index 000000000..3f25fd525
--- /dev/null
+++ b/frontend/app/components/shared/AutoplayToggle/AutoplayToggle.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import { Controls as PlayerControls, connectPlayer } from 'Player';
+import { Toggler } from 'UI';
+
+interface Props {
+  toggleAutoplay: () => void;
+  autoplay: boolean;
+}
+function AutoplayToggle(props: Props) {
+  const { autoplay } = props;
+  return (
+    <div
+      onClick={props.toggleAutoplay}
+      className="cursor-pointer flex items-center mr-2 hover:bg-gray-light-shade rounded-md p-2"
+    >
+      <Toggler name="sessionsLive" onChange={props.toggleAutoplay} checked={autoplay} />
+      <span className="ml-2 whitespace-nowrap">Auto-Play</span>
+    </div>
+  );
+}
+
+export default connectPlayer(
+  (state: any) => ({
+    autoplay: state.autoplay,
+  }),
+  {
+    toggleAutoplay: PlayerControls.toggleAutoplay,
+  }
+)(AutoplayToggle);
diff --git a/frontend/app/components/shared/AutoplayToggle/index.ts b/frontend/app/components/shared/AutoplayToggle/index.ts
new file mode 100644
index 000000000..a170180b0
--- /dev/null
+++ b/frontend/app/components/shared/AutoplayToggle/index.ts
@@ -0,0 +1 @@
+export { default } from './AutoplayToggle';
diff --git a/frontend/app/components/shared/SharePopup/SharePopup.js b/frontend/app/components/shared/SharePopup/SharePopup.js
index 9fef76843..4c75df64b 100644
--- a/frontend/app/components/shared/SharePopup/SharePopup.js
+++ b/frontend/app/components/shared/SharePopup/SharePopup.js
@@ -128,7 +128,7 @@ export default class SharePopup extends React.PureComponent {
           </div>
         )}
       >
-        <div className="p-3 w-full">{trigger}</div>
+        {trigger}
       </Popover>
     );
   }