admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

IO-3020 IO-3036 Add additional upsell components.

Browse Source
This commit is contained in:
Patrick Fic
2024-12-09 18:47:32 -08:00
parent 962f471f0f
commit c7a2c8209a
28 changed files with 1015 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/src/components/feature-wrapper/blur-wrapper.component.jsx
View File

@@ -129,6 +129,7 @@ const featureNameList = [
"media",
"visualboard",
"scoreboard",
"techconsole",
"checklist",
"smartscheduling",
"roguard",

110
client/src/components/upsell/upsell.component.jsx
View File

@@ -1,11 +1,21 @@
import { AppstoreAddOutlined, CalendarOutlined, CarOutlined, MobileOutlined } from "@ant-design/icons";
import { Result, Button, Card } from "antd";
import {
AppstoreAddOutlined,
BuildOutlined,
CalendarOutlined,
CarOutlined,
DashboardOutlined,
DollarOutlined,
LineChartOutlined,
MobileOutlined,
StarOutlined
} from "@ant-design/icons";
import { Button, Card, Result } from "antd";
import i18n from "i18next";
import React, { useEffect, useRef } from "react";
import { useTranslation } from "react-i18next";
import i18n from "i18next";
import "./upsell.styles.scss";
export default function UpsellComponent({ featureName, subFeatureName, upsell, disableMask = false }) {
export default function UpsellComponent({ featureName, subFeatureName, upsell, disableMask }) {
const { t } = useTranslation();
const resultProps = upsell || upsellEnum[featureName][subFeatureName];
const componentRef = useRef(null);
@@ -27,7 +37,9 @@ export default function UpsellComponent({ featureName, subFeatureName, upsell, d
parentElement.prepend(mask);
return () => {
parentElement.removeChild(mask);
if (mask && parentElement.contains(mask)) {
parentElement.removeChild(mask);
}
};
}
}, [disableMask]);
@@ -40,7 +52,7 @@ export default function UpsellComponent({ featureName, subFeatureName, upsell, d
);
}
//Kept in the same function as the result props line must mirror and doesnt warrant a separate function.
export function UpsellMaskWrapper({ children, upsell, featureName, subFeatureName, disableMask = false }) {
export function UpsellMaskWrapper({ children, upsell, featureName, subFeatureName }) {
const resultProps = upsell || upsellEnum[featureName][subFeatureName];
return (
<div className="mask-wrapper">
@@ -71,6 +83,24 @@ export const upsellEnum = {
//status: null
}
},
checklist: {
general: {
//icon: null,
title: i18n.t("upsell.messages.checklist.general.title"),
subTitle: i18n.t("upsell.messages.checklist.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
//status: null
}
},
payments: {
general: {
//icon: null,
title: i18n.t("upsell.messages.payments.general.title"),
subTitle: i18n.t("upsell.messages.payments.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
//status: null
}
},
audit: {
general: {
//icon: null,
@@ -136,5 +166,73 @@ export const upsellEnum = {
subTitle: i18n.t("upsell.messages.smartscheduling.datepicker.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
accounting: {
payables: {
icon: <DollarOutlined />,
title: i18n.t("upsell.messages.accounting.payables.title"),
subTitle: i18n.t("upsell.messages.accounting.payables.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
},
receivables: {
icon: <DollarOutlined />,
title: i18n.t("upsell.messages.accounting.receivables.title"),
subTitle: i18n.t("upsell.messages.accounting.receivables.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
},
payments: {
icon: <DollarOutlined />,
title: i18n.t("upsell.messages.accounting.payments.title"),
subTitle: i18n.t("upsell.messages.accounting.payments.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
courtesycars: {
general: {
icon: <CarOutlined />,
title: i18n.t("upsell.messages.courtesycars.general.title"),
subTitle: i18n.t("upsell.messages.courtesycars.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
dashboard: {
general: {
icon: <DashboardOutlined />,
title: i18n.t("upsell.messages.dashboard.general.title"),
subTitle: i18n.t("upsell.messages.dashboard.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
visualboard: {
general: {
icon: <BuildOutlined />,
title: i18n.t("upsell.messages.visualboard.general.title"),
subTitle: i18n.t("upsell.messages.visualboard.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
scoreboard: {
general: {
icon: <LineChartOutlined />,
title: i18n.t("upsell.messages.scoreboard.general.title"),
subTitle: i18n.t("upsell.messages.scoreboard.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
techconsole: {
general: {
icon: <LineChartOutlined />,
title: i18n.t("upsell.messages.techconsole.general.title"),
subTitle: i18n.t("upsell.messages.techconsole.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
},
csi: {
general: {
icon: <StarOutlined />,
title: i18n.t("upsell.messages.csi.general.title"),
subTitle: i18n.t("upsell.messages.csi.general.subtitle"),
extra: <Button type="primary">{i18n.t("upsell.cta.learnmore")}</Button>
}
}
};