diff --git a/bodyshop_translations.babel b/bodyshop_translations.babel
index e0869b086..a978d8765 100644
--- a/bodyshop_translations.babel
+++ b/bodyshop_translations.babel
@@ -13685,6 +13685,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>shiftclock</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
                                     <concept_node>
                                         <name>shop</name>
                                         <definition_loaded>false</definition_loaded>
diff --git a/client/src/components/header/header.component.jsx b/client/src/components/header/header.component.jsx
index 596abdd60..9d5fdbc11 100644
--- a/client/src/components/header/header.component.jsx
+++ b/client/src/components/header/header.component.jsx
@@ -81,7 +81,7 @@ function Header({
       <Row>
         <Col {...logoSpan}>
           <img
-            className="header-shop-logo"
+            className='header-shop-logo'
             alt={bodyshop ? bodyshop.shopname : "ImEX Online Logo"}
             src={
               bodyshop && bodyshop.logo_img_path
@@ -92,13 +92,12 @@ function Header({
         </Col>
         <Col {...menuSpan}>
           <Menu
-            mode="horizontal"
-            theme="dark"
-            className="header-main-menu"
-            onClick={handleMenuClick}
-          >
-            <Menu.Item key="home">
-              <Link to="/manage">
+            mode='horizontal'
+            theme='dark'
+            className='header-main-menu'
+            onClick={handleMenuClick}>
+            <Menu.Item key='home'>
+              <Link to='/manage'>
                 <HomeFilled />
                 {t("menus.header.home")}
               </Link>
@@ -109,51 +108,50 @@ function Header({
                   <Icon component={FaCarCrash} />
                   <span>{t("menus.header.jobs")}</span>
                 </span>
-              }
-            >
-              <Menu.Item key="schedule">
-                <Link to="/manage/schedule">
+              }>
+              <Menu.Item key='schedule'>
+                <Link to='/manage/schedule'>
                   <Icon component={FaCalendarAlt} />
                   {t("menus.header.schedule")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="productionlist">
-                <Link to="/manage/production/list">
+              <Menu.Item key='productionlist'>
+                <Link to='/manage/production/list'>
                   <Icon component={FaCalendarAlt} />
                   {t("menus.header.productionlist")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="productionboard">
-                <Link to="/manage/production/board">
+              <Menu.Item key='productionboard'>
+                <Link to='/manage/production/board'>
                   {t("menus.header.productionboard")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="scoreboard">
-                <Link to="/manage/scoreboard">
+              <Menu.Item key='scoreboard'>
+                <Link to='/manage/scoreboard'>
                   {t("menus.header.scoreboard")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="activejobs">
-                <Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>
+              <Menu.Item key='activejobs'>
+                <Link to='/manage/jobs'>{t("menus.header.activejobs")}</Link>
               </Menu.Item>
-              <Menu.Item key="alljobs">
-                <Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>
+              <Menu.Item key='alljobs'>
+                <Link to='/manage/jobs/all'>{t("menus.header.alljobs")}</Link>
               </Menu.Item>
-              <Menu.Item key="availablejobs">
-                <Link to="/manage/available">
+              <Menu.Item key='availablejobs'>
+                <Link to='/manage/available'>
                   {t("menus.header.availablejobs")}
                 </Link>
               </Menu.Item>
             </Menu.SubMenu>
             <Menu.SubMenu title={t("menus.header.customers")}>
-              <Menu.Item key="owners">
-                <Link to="/manage/owners">
+              <Menu.Item key='owners'>
+                <Link to='/manage/owners'>
                   <TeamOutlined />
                   {t("menus.header.owners")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="vehicles">
-                <Link to="/manage/vehicles">
+              <Menu.Item key='vehicles'>
+                <Link to='/manage/vehicles'>
                   <CarFilled />
                   {t("menus.header.vehicles")}
                 </Link>
@@ -165,22 +163,21 @@ function Header({
                   <CarFilled />
                   <span>{t("menus.header.courtesycars")}</span>
                 </span>
-              }
-            >
-              <Menu.Item key="courtesycarsall">
-                <Link to="/manage/courtesycars">
+              }>
+              <Menu.Item key='courtesycarsall'>
+                <Link to='/manage/courtesycars'>
                   <CarFilled />
                   {t("menus.header.courtesycars-all")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="contracts">
-                <Link to="/manage/courtesycars/contracts">
+              <Menu.Item key='contracts'>
+                <Link to='/manage/courtesycars/contracts'>
                   <FileFilled />
                   {t("menus.header.courtesycars-contracts")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="newcontract">
-                <Link to="/manage/courtesycars/contracts/new">
+              <Menu.Item key='newcontract'>
+                <Link to='/manage/courtesycars/contracts/new'>
                   <FileAddFilled />
                   {t("menus.header.courtesycars-newcontract")}
                 </Link>
@@ -192,87 +189,83 @@ function Header({
                   <DollarCircleFilled />
                   <span>{t("menus.header.accounting")}</span>
                 </span>
-              }
-            >
+              }>
               <Menu.Item
-                key="enterpayments"
+                key='enterpayments'
                 onClick={() => {
                   setPaymentContext({
                     actions: {},
                     context: {},
                   });
-                }}
-              >
+                }}>
                 <Icon component={FaCreditCard} />
                 {t("menus.header.enterpayment")}
               </Menu.Item>
 
               <Menu.Item
-                key="enterinvoices"
+                key='enterinvoices'
                 onClick={() => {
                   setInvoiceEnterContext({
                     actions: {},
                     context: {},
                   });
-                }}
-              >
+                }}>
                 {t("menus.header.enterinvoices")}
               </Menu.Item>
-              <Menu.Item key="invoices">
-                <Link to="/manage/invoices">{t("menus.header.invoices")}</Link>
+              <Menu.Item key='invoices'>
+                <Link to='/manage/invoices'>{t("menus.header.invoices")}</Link>
               </Menu.Item>
               <Menu.Item
-                key="entertimetickets"
+                key='entertimetickets'
                 onClick={() => {
                   setTimeTicketContext({
                     actions: {},
                     context: {},
                   });
-                }}
-              >
+                }}>
                 {t("menus.header.entertimeticket")}
               </Menu.Item>
 
               <Menu.SubMenu title={t("menus.header.export")}>
-                <Menu.Item key="receivables">
-                  <Link to="/manage/accounting/receivables">
+                <Menu.Item key='receivables'>
+                  <Link to='/manage/accounting/receivables'>
                     {t("menus.header.accounting-receivables")}
                   </Link>
                 </Menu.Item>
-                <Menu.Item key="payables">
-                  <Link to="/manage/accounting/payables">
+                <Menu.Item key='payables'>
+                  <Link to='/manage/accounting/payables'>
                     {t("menus.header.accounting-payables")}
                   </Link>
                 </Menu.Item>
-                <Menu.Item key="payments">
-                  <Link to="/manage/accounting/payments">
+                <Menu.Item key='payments'>
+                  <Link to='/manage/accounting/payments'>
                     {t("menus.header.accounting-payments")}
                   </Link>
                 </Menu.Item>
               </Menu.SubMenu>
 
-              <Menu.Item key="allpayments">
-                <Link to="/manage/payments">
+              <Menu.Item key='allpayments'>
+                <Link to='/manage/payments'>
                   {t("menus.header.allpayments")}
                 </Link>
               </Menu.Item>
             </Menu.SubMenu>
             <Menu.SubMenu title={t("menus.header.shop")}>
-              <Menu.Item key="shop">
-                <Link to="/manage/shop">{t("menus.header.shop_config")}</Link>
+              <Menu.Item key='shop'>
+                <Link to='/manage/shop'>{t("menus.header.shop_config")}</Link>
               </Menu.Item>
-              <Menu.Item key="shop-templates">
-                <Link to="/manage/shop/templates">
+              <Menu.Item key='shop-templates'>
+                <Link to='/manage/shop/templates'>
                   {t("menus.header.shop_templates")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="shop-vendors">
-                <Link to="/manage/shop/vendors">
+              <Menu.Item key='shop-vendors'>
+                <Link to='/manage/shop/vendors'>
                   {t("menus.header.shop_vendors")}
                 </Link>
               </Menu.Item>
-              <Menu.Item key="shop-csi">
-                <Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>
+              <Menu.Item key='shop-csi'>
+                <Link to='/manage/shop/csi'>{t("menus.header.shop_csi")}</Link>
               </Menu.Item>
             </Menu.SubMenu>
             <Menu.SubMenu
@@ -297,13 +290,17 @@ function Header({
 
                   {currentUser.displayName || t("general.labels.unknown")}
                 </div>
-              }
-            >
+              }>
               <Menu.Item danger onClick={() => signOutStart()}>
                 {t("user.actions.signout")}
               </Menu.Item>
+              <Menu.Item key='shiftclock'>
+                <Link to='/manage/shiftclock'>
+                  {t("menus.header.shiftclock")}
+                </Link>
+              </Menu.Item>
               <Menu.Item>
-                <Link to="/manage/profile">
+                <Link to='/manage/profile'>
                   {t("menus.currentuser.profile")}
                 </Link>
               </Menu.Item>
@@ -313,15 +310,14 @@ function Header({
                     <GlobalOutlined />
                     <span>{t("menus.currentuser.languageselector")}</span>
                   </span>
-                }
-              >
-                <Menu.Item actiontype="lang-select" key="en-US">
+                }>
+                <Menu.Item actiontype='lang-select' key='en-US'>
                   {t("general.languages.english")}
                 </Menu.Item>
-                <Menu.Item actiontype="lang-select" key="fr-CA">
+                <Menu.Item actiontype='lang-select' key='fr-CA'>
                   {t("general.languages.french")}
                 </Menu.Item>
-                <Menu.Item actiontype="lang-select" key="es-MX">
+                <Menu.Item actiontype='lang-select' key='es-MX'>
                   {t("general.languages.spanish")}
                 </Menu.Item>
               </Menu.SubMenu>
diff --git a/client/src/components/time-ticket-shift-form/time-ticket-shift-form.component.jsx b/client/src/components/time-ticket-shift-form/time-ticket-shift-form.component.jsx
index ee07db801..6bd25a2ea 100644
--- a/client/src/components/time-ticket-shift-form/time-ticket-shift-form.component.jsx
+++ b/client/src/components/time-ticket-shift-form/time-ticket-shift-form.component.jsx
@@ -1,4 +1,4 @@
-import { Form, InputNumber, Select } from "antd";
+import { Form, Select } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
diff --git a/client/src/components/time-ticket-shift-form/time-ticket-shift-form.container.jsx b/client/src/components/time-ticket-shift-form/time-ticket-shift-form.container.jsx
index aefcb7136..b30c1d097 100644
--- a/client/src/components/time-ticket-shift-form/time-ticket-shift-form.container.jsx
+++ b/client/src/components/time-ticket-shift-form/time-ticket-shift-form.container.jsx
@@ -69,7 +69,6 @@ export function TimeTicektShiftContainer({
 
   return (
     <div>
-      The form TimeTicektShiftContainer
       <Form
         form={form}
         layout='vertical'
diff --git a/client/src/pages/manage/manage.page.component.jsx b/client/src/pages/manage/manage.page.component.jsx
index 35d9abc51..ac1efe7be 100644
--- a/client/src/pages/manage/manage.page.component.jsx
+++ b/client/src/pages/manage/manage.page.component.jsx
@@ -116,7 +116,7 @@ const ShopCsiPageContainer = lazy(() =>
 const PaymentsAll = lazy(() =>
   import("../payments-all/payments-all.container.page")
 );
-
+const ShiftClock = lazy(() => import("../shift-clock/shift-clock.page"));
 const Scoreboard = lazy(() =>
   import("../scoreboard/scoreboard.page.container.jsx")
 );
@@ -319,6 +319,11 @@ export function Manage({ match, conflict }) {
                 path={`${match.path}/payments`}
                 component={PaymentsAll}
               />
+              <Route
+                exact
+                path={`${match.path}/shiftclock`}
+                component={ShiftClock}
+              />
               <Route
                 exact
                 path={`${match.path}/scoreboard`}
diff --git a/client/src/pages/shift-clock/shift-clock.page.jsx b/client/src/pages/shift-clock/shift-clock.page.jsx
new file mode 100644
index 000000000..6458f9f28
--- /dev/null
+++ b/client/src/pages/shift-clock/shift-clock.page.jsx
@@ -0,0 +1,10 @@
+import React from "react";
+import TimeTicketShift from "../../components/time-ticket-shift/time-ticket-shift.container";
+
+export default function ShiftClock() {
+  return (
+    <div>
+      <TimeTicketShift />
+    </div>
+  );
+}
diff --git a/client/src/translations/en_us/common.json b/client/src/translations/en_us/common.json
index b5f8fbfab..702675463 100644
--- a/client/src/translations/en_us/common.json
+++ b/client/src/translations/en_us/common.json
@@ -834,6 +834,7 @@
 				"productionlist": "Production - List",
 				"schedule": "Schedule",
 				"scoreboard": "Scoreboard",
+				"shiftclock": "Shift Clock",
 				"shop": "My Shop",
 				"shop_config": "Configuration",
 				"shop_csi": "CSI",
diff --git a/client/src/translations/es/common.json b/client/src/translations/es/common.json
index 95f340af6..369cff5f1 100644
--- a/client/src/translations/es/common.json
+++ b/client/src/translations/es/common.json
@@ -834,6 +834,7 @@
 				"productionlist": "",
 				"schedule": "Programar",
 				"scoreboard": "",
+				"shiftclock": "",
 				"shop": "Mi tienda",
 				"shop_config": "Configuración",
 				"shop_csi": "",
diff --git a/client/src/translations/fr/common.json b/client/src/translations/fr/common.json
index 894073f9d..3bb646697 100644
--- a/client/src/translations/fr/common.json
+++ b/client/src/translations/fr/common.json
@@ -834,6 +834,7 @@
 				"productionlist": "",
 				"schedule": "Programme",
 				"scoreboard": "",
+				"shiftclock": "",
 				"shop": "Mon magasin",
 				"shop_config": "Configuration",
 				"shop_csi": "",