diff --git a/src/course-outline/header-navigations/HeaderNavigation.test.jsx b/src/course-outline/header-navigations/HeaderNavigation.test.jsx
index 1b83e09191..6b0fde9ca8 100644
--- a/src/course-outline/header-navigations/HeaderNavigation.test.jsx
+++ b/src/course-outline/header-navigations/HeaderNavigation.test.jsx
@@ -8,13 +8,12 @@ import messages from './messages';
 const handleNewSectionMock = jest.fn();
 const handleReIndexMock = jest.fn();
 const handleExpandAllMock = jest.fn();
-const handleViewLiveMock = jest.fn();
 
 const headerNavigationsActions = {
   handleNewSection: handleNewSectionMock,
   handleReIndex: handleReIndexMock,
   handleExpandAll: handleExpandAllMock,
-  handleViewLive: handleViewLiveMock,
+  lmsLink: '',
 };
 
 const renderComponent = (props) => render(
@@ -62,10 +61,6 @@ describe('<HeaderNavigations />', () => {
     const expandAllButton = getByRole('button', { name: messages.expandAllButton.defaultMessage });
     fireEvent.click(expandAllButton);
     expect(handleExpandAllMock).toHaveBeenCalledTimes(1);
-
-    const viewLiveButton = getByRole('button', { name: messages.viewLiveButton.defaultMessage });
-    fireEvent.click(viewLiveButton);
-    expect(handleViewLiveMock).toHaveBeenCalledTimes(1);
   });
 
   it('render collapse button correctly', () => {
diff --git a/src/course-outline/header-navigations/HeaderNavigations.jsx b/src/course-outline/header-navigations/HeaderNavigations.jsx
index 897cebf8df..c741954279 100644
--- a/src/course-outline/header-navigations/HeaderNavigations.jsx
+++ b/src/course-outline/header-navigations/HeaderNavigations.jsx
@@ -17,7 +17,7 @@ const HeaderNavigations = ({
 }) => {
   const intl = useIntl();
   const {
-    handleNewSection, handleReIndex, handleExpandAll, handleViewLive,
+    handleNewSection, handleReIndex, handleExpandAll, lmsLink,
   } = headerNavigationsActions;
 
   return (
@@ -74,7 +74,8 @@ const HeaderNavigations = ({
         )}
       >
         <Button
-          onClick={handleViewLive}
+          href={lmsLink}
+          target="_blank"
           variant="outline-primary"
         >
           {intl.formatMessage(messages.viewLiveButton)}
@@ -92,7 +93,7 @@ HeaderNavigations.propTypes = {
     handleNewSection: PropTypes.func.isRequired,
     handleReIndex: PropTypes.func.isRequired,
     handleExpandAll: PropTypes.func.isRequired,
-    handleViewLive: PropTypes.func.isRequired,
+    lmsLink: PropTypes.string.isRequired,
   }).isRequired,
 };
 
diff --git a/src/course-outline/hooks.jsx b/src/course-outline/hooks.jsx
index ae6a9b38dd..f96b84641c 100644
--- a/src/course-outline/hooks.jsx
+++ b/src/course-outline/hooks.jsx
@@ -21,7 +21,7 @@ import {
 const useCourseOutline = ({ courseId }) => {
   const dispatch = useDispatch();
 
-  const { reindexLink } = useSelector(getOutlineIndexData);
+  const { reindexLink, lmsLink } = useSelector(getOutlineIndexData);
   const { outlineIndexLoadingStatus, reIndexLoadingStatus } = useSelector(getLoadingStatus);
   const statusBarData = useSelector(getStatusBarData);
   const savingStatus = useSelector(getSavingStatus);
@@ -48,9 +48,7 @@ const useCourseOutline = ({ courseId }) => {
     handleExpandAll: () => {
       setSectionsExpanded((prevState) => !prevState);
     },
-    handleViewLive: () => {
-      // TODO add handler
-    },
+    lmsLink,
   };
 
   const handleEnableHighlightsSubmit = () => {