IO-3020 IO-3036 Extend blur wrapper, add lock wrapper to components throughout the system. Many placeholders still left for upsell components.

client/src/components/time-ticket-list/time-ticket-list.component.jsx

@@ -14,6 +14,8 @@ import dayjs from "../../utils/day";
 import { alphaSort, dateSort } from "../../utils/sorters";
 import { HasRbacAccess } from "../rbac-wrapper/rbac-wrapper.component";
 import TimeTicketEnterButton from "../time-ticket-enter-button/time-ticket-enter-button.component";
+import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
+import LockWrapperComponent from "../lock-wrapper/lock-wrapper.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -39,7 +41,7 @@ export function TimeTicketList({
   extra
 }) {
   const [state, setState] = useState({
-    sortedInfo: { columnKey: 'date', order: 'descend' },
+    sortedInfo: { columnKey: "date", order: "descend" },
     filteredInfo: { text: "" }
   });
 
@@ -77,7 +79,7 @@ export function TimeTicketList({
     if (isShiftTicket) {
       return !(canEditShiftTickets && (!isCommitted || canEditCommittedTimeTickets));
     }
-    
+
     return !(canEditTimeTickets && (!isCommitted || canEditCommittedTimeTickets));
   };
 
@@ -277,6 +279,8 @@ export function TimeTicketList({
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
+  const hasTimeTicketsAccess = HasFeatureAccess({ bodyshop, featureName: "timetickets" });
+
   return (
     <Card
       title={t("timetickets.labels.timetickets")}
@@ -284,7 +288,7 @@ export function TimeTicketList({
         <Space wrap>
           {jobId && bodyshop.md_tasks_presets.enable_tasks && (
             <Button
-              disabled={disabled}
+              disabled={disabled || !hasTimeTicketsAccess}
               onClick={() => {
                 setTimeTicketTaskContext({
                   actions: { refetch: refetch },
@@ -292,7 +296,9 @@ export function TimeTicketList({
                 });
               }}
             >
-              {t("timetickets.actions.claimtasks")}
+              <LockWrapperComponent featureName="timetickets">
+                {t("timetickets.actions.claimtasks")}
+              </LockWrapperComponent>
             </Button>
           )}
           {jobId &&
@@ -305,9 +311,9 @@ export function TimeTicketList({
                     ? currentUser.email.concat(" | ", currentUser.displayName)
                     : currentUser.email
                 }}
-                disabled={disabled}
+                disabled={disabled || !hasTimeTicketsAccess}
               >
-                {t("timetickets.actions.enter")}
+                <LockWrapperComponent featureName="timetickets">{t("timetickets.actions.enter")}</LockWrapperComponent>
               </TimeTicketEnterButton>
             ))}
           {extra}
@@ -328,7 +334,7 @@ export function TimeTicketList({
         scroll={{
           x: true
         }}
-        dataSource={timetickets}
+        dataSource={hasTimeTicketsAccess ? timetickets : []}
         onChange={handleTableChange}
         summary={() => {
           if (Enhanced_Payroll.treatment === "on") return null;
@@ -354,6 +360,18 @@ export function TimeTicketList({
               </Table.Summary.Row>
             );
         }}
+        locale={{
+          ...(!hasTimeTicketsAccess && {
+            emptyText: (
+              <div>
+                Upsell
+                {
+                  //TODO:Upsell
+                }
+              </div>
+            )
+          })
+        }}
       />
     </Card>
   );