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

This commit is contained in:
Patrick Fic
2024-12-04 11:51:54 -08:00
parent c85a5eb208
commit 6b3fb00cc0
47 changed files with 781 additions and 408 deletions

View File

@@ -15,6 +15,8 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import ScheduleDayViewContainer from "../schedule-day-view/schedule-day-view.container";
import ScheduleExistingAppointmentsList from "../schedule-existing-appointments-list/schedule-existing-appointments-list.component";
import "./schedule-job-modal.scss";
import LockWrapperComponent from "../lock-wrapper/lock-wrapper.component";
import { BlurWrapper } from "../feature-wrapper/blur-wrapper.component";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop
@@ -99,36 +101,43 @@ export function ScheduleJobModalComponent({
<DateTimePicker onlyFuture />
</Form.Item>
</LayoutFormRow>
{HasFeatureAccess({ featureName: "smartscheduling", bodyshop }) && (
{
<>
<Typography.Title level={4}>{t("appointments.labels.smartscheduling")}</Typography.Title>
<Space wrap>
<Button onClick={handleSmartScheduling} loading={loading}>
{t("appointments.actions.calculate")}
<LockWrapperComponent featureName="smartscheduling">
{t("appointments.actions.calculate")}
</LockWrapperComponent>
</Button>
{smartOptions.map((d, idx) => (
<Button
className="imex-flex-row__margin"
key={idx}
onClick={() => {
const ssDate = dayjs(d);
if (ssDate.isBefore(dayjs())) {
form.setFieldsValue({ start: dayjs() });
} else {
form.setFieldsValue({
start: dayjs(d).add(8, "hour")
});
}
handleDateBlur();
}}
>
<DateFormatter includeDay>{d}</DateFormatter>
</Button>
<BlurWrapper featureName="smartscheduling" key={idx}>
<Button
className="imex-flex-row__margin"
disabled={!HasFeatureAccess({ bodyshop, featureName: "smartscheduling" })}
onClick={() => {
const ssDate = dayjs(d);
if (ssDate.isBefore(dayjs())) {
form.setFieldsValue({ start: dayjs() });
} else {
form.setFieldsValue({
start: dayjs(d).add(8, "hour")
});
}
handleDateBlur();
}}
>
<DateFormatter includeDay>{d}</DateFormatter>
</Button>
</BlurWrapper>
))}
{
//TODO:Upsell
}
</Space>
</>
)}
,
}
<LayoutFormRow grow>
<Form.Item name="notifyCustomer" valuePropName="checked" label={t("jobs.labels.appointmentconfirmation")}>
<Switch />