connect status
parent
46611d8322
commit
26b30b47cd
|
@ -196,6 +196,20 @@
|
|||
"subTitle": "Klicken Sie auf die Schaltfläche unten, um Ihren Google Kalender zu verbinden.",
|
||||
"button": "Jetzt verbinden"
|
||||
},
|
||||
"googleCalendarPending": {
|
||||
"title": "Vorbereiten von Google Kalender",
|
||||
"subTitle": "Bitte warten Sie, während wir Ihren Google-Kalender vorbereiten. Dies kann einen Moment dauern."
|
||||
},
|
||||
"googleCalendarNoPerm": {
|
||||
"title": "Keine Berechtigungen für Google Calendar",
|
||||
"subTitle": "Bitte erteilen Sie die Berechtigungen für den Zugriff auf den Google-Kalender.",
|
||||
"button": "Erneut verbinden"
|
||||
},
|
||||
"googleCalendarError": {
|
||||
"title": "Fehler beim Verbinden mit Google Calendar",
|
||||
"subTitle": "Bei der Verbindung zu Ihrem Google-Kalender ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut.",
|
||||
"button": "Erneut verbinden"
|
||||
},
|
||||
"unlinkGoogleCalendar": {
|
||||
"title": "Google Kalender trennen",
|
||||
"description": "Aus Sicherheitsgründen müssen Sie Ihr Passwort eingeben, um die Verbindung zu Ihrem Google Kalender zu trennen.",
|
||||
|
|
|
@ -199,6 +199,20 @@
|
|||
"subTitle": "Click on the button below to connect your Google Calendar.",
|
||||
"button": "Connect now"
|
||||
},
|
||||
"googleCalendarPending": {
|
||||
"title": "Preparing Google Calendar",
|
||||
"subTitle": "Please wait while we prepare your Google Calendar. This may take a moment."
|
||||
},
|
||||
"googleCalendarNoPerm": {
|
||||
"title": "No permissions for Google Calendar",
|
||||
"subTitle": "Please grant the authorisations for access to the Google calendar.",
|
||||
"button": "Connect again"
|
||||
},
|
||||
"googleCalendarError": {
|
||||
"title": "Error when connecting to Google Calendar",
|
||||
"subTitle": "An error occurred while connecting to your Google Calendar. Please try again.",
|
||||
"button": "Connect again"
|
||||
},
|
||||
"unlinkGoogleCalendar": {
|
||||
"title": "Unlink Google Calendar",
|
||||
"description": "For security reasons, you need to enter your password to unlink your Google Calendar.",
|
||||
|
|
|
@ -47,6 +47,7 @@ export default function StoreCalendar() {
|
|||
|
||||
const [calendarSettings, setCalendarSettings] = useState({});
|
||||
const [isRequesting, setIsRequesting] = useState(true);
|
||||
const timer = useRef();
|
||||
|
||||
useEffect(() => {
|
||||
// delete session cookie
|
||||
|
@ -67,6 +68,31 @@ export default function StoreCalendar() {
|
|||
});
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
// if status is pending, check again after
|
||||
|
||||
if (calendarSettings.status === "PENDING") {
|
||||
timer.current = setTimeout(() => {
|
||||
myFetch({
|
||||
url: "/calendar/settings",
|
||||
method: "GET",
|
||||
notificationApi: notificationApi,
|
||||
t: t,
|
||||
})
|
||||
.then((res) => {
|
||||
setCalendarSettings(res);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
return () => {
|
||||
clearTimeout(timer.current);
|
||||
};
|
||||
}, [calendarSettings]);
|
||||
|
||||
if (isRequesting) {
|
||||
return (
|
||||
<MyCenteredContainer>
|
||||
|
@ -75,56 +101,106 @@ export default function StoreCalendar() {
|
|||
);
|
||||
}
|
||||
|
||||
const ConnectCalendarButton = ({ text }) => (
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
document.cookie = `session=${getUserSessionFromLocalStorage()}; path=/;`;
|
||||
|
||||
window.location.href = `${Constants.API_ADDRESS}/calendar/auth/google`;
|
||||
}}
|
||||
>
|
||||
{text || t("calendar.googleCalendarNotConnected.button")}
|
||||
</Button>
|
||||
);
|
||||
|
||||
if (calendarSettings.status === "NOT_CONNECTED") {
|
||||
return (
|
||||
<MyCenteredContainer>
|
||||
<Result
|
||||
status="warning"
|
||||
title={t("calendar.googleCalendarNotConnected.title")}
|
||||
subTitle={t("calendar.googleCalendarNotConnected.subTitle")}
|
||||
extra={<ConnectCalendarButton />}
|
||||
/>
|
||||
</MyCenteredContainer>
|
||||
);
|
||||
}
|
||||
|
||||
if (calendarSettings.status === "PENDING") {
|
||||
return (
|
||||
<MyCenteredContainer>
|
||||
<Result
|
||||
status="info"
|
||||
title={t("calendar.googleCalendarPending.title")}
|
||||
subTitle={t("calendar.googleCalendarPending.subTitle")}
|
||||
extra={<Spin size="large" />}
|
||||
/>
|
||||
</MyCenteredContainer>
|
||||
);
|
||||
}
|
||||
|
||||
if (calendarSettings.status === "NOPERM") {
|
||||
return (
|
||||
<MyCenteredContainer>
|
||||
<Result
|
||||
status="error"
|
||||
title={t("calendar.googleCalendarNoPerm.title")}
|
||||
subTitle={t("calendar.googleCalendarNoPerm.subTitle")}
|
||||
extra={
|
||||
<ConnectCalendarButton
|
||||
text={t("calendar.googleCalendarNoPerm.button")}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</MyCenteredContainer>
|
||||
);
|
||||
}
|
||||
|
||||
if (calendarSettings.status === "ERROR") {
|
||||
return (
|
||||
<MyCenteredContainer>
|
||||
<Result
|
||||
status="error"
|
||||
title={t("calendar.googleCalendarError.title")}
|
||||
subTitle={t("calendar.googleCalendarError.subTitle")}
|
||||
extra={
|
||||
<ConnectCalendarButton
|
||||
text={t("calendar.googleCalendarError.button")}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</MyCenteredContainer>
|
||||
);
|
||||
}
|
||||
|
||||
// status OK
|
||||
return (
|
||||
<>
|
||||
{notificationContextHolder}
|
||||
|
||||
{calendarSettings.connected === false ? (
|
||||
<MyCenteredContainer>
|
||||
<Result
|
||||
status="warning"
|
||||
title={t("calendar.googleCalendarNotConnected.title")}
|
||||
subTitle={t("calendar.googleCalendarNotConnected.subTitle")}
|
||||
extra={
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
document.cookie = `session=${getUserSessionFromLocalStorage()}; path=/;`;
|
||||
<h1>{t("calendar.pageTitle")}</h1>
|
||||
|
||||
window.location.href = `${Constants.API_ADDRESS}/calendar/auth/google`;
|
||||
}}
|
||||
>
|
||||
{t("calendar.googleCalendarNotConnected.button")}
|
||||
</Button>
|
||||
}
|
||||
<Row gutter={[16, 16]}>
|
||||
<Col xs={24} md={12}>
|
||||
<CardPersonalCalendarSettings
|
||||
settings={calendarSettings.userSettings}
|
||||
/>
|
||||
</MyCenteredContainer>
|
||||
) : (
|
||||
<>
|
||||
<h1>{t("calendar.pageTitle")}</h1>
|
||||
</Col>
|
||||
<Col xs={24} md={12}>
|
||||
{calendarSettings.storeSettings && (
|
||||
<CardStoreCalendarSettings
|
||||
settings={calendarSettings.storeSettings}
|
||||
/>
|
||||
)}
|
||||
</Col>
|
||||
|
||||
<Row gutter={[16, 16]}>
|
||||
<Col xs={24} md={12}>
|
||||
<CardPersonalCalendarSettings
|
||||
settings={calendarSettings.userSettings}
|
||||
/>
|
||||
</Col>
|
||||
<Col xs={24} md={12}>
|
||||
{calendarSettings.storeSettings && (
|
||||
<CardStoreCalendarSettings
|
||||
settings={calendarSettings.storeSettings}
|
||||
/>
|
||||
)}
|
||||
</Col>
|
||||
|
||||
<Col xs={24}>
|
||||
<Card title={t("calendar.calendarFrameCustomerView")}>
|
||||
<CalendarFrame storeId={storeId} />
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</>
|
||||
)}
|
||||
<Col xs={24}>
|
||||
<Card title={t("calendar.calendarFrameCustomerView")}>
|
||||
<CalendarFrame storeId={storeId} />
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue