Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| } | ||
| return ( | ||
| <List className="flex flex-col gap-6"> | ||
| <List className="flex flex-col gap-6" noBorderTreatment> |
There was a problem hiding this comment.
Had to make the list without borders as they were messing up each calendar integration list item, specifically the warning itself.
| message={item.error?.message} | ||
| title={t("something_went_wrong")} | ||
| message={t("calendar_error")} | ||
| iconClassName="h-10 w-10 ml-2 mr-1 mt-0.5" |
There was a problem hiding this comment.
Made the icon the same size and position as the rest of the icons in the calendar integration list
| iconClassName="h-10 w-10 ml-2 mr-1 mt-0.5" | ||
| actions={ | ||
| <div className="w-32"> | ||
| <div className="flex w-32 justify-end"> |
There was a problem hiding this comment.
Disconnect icon at the very end as the other integrations
|
|
||
| key = token.res?.data; | ||
|
|
||
| if (!key) res.status(401).json({ message: "Permissions not granted" }); |
There was a problem hiding this comment.
We have already covered this scenario afterwards in the workflow. This result in the API was throwing a bare bones JSON when clicking "Cancel" in Google Calendar permission flow, not a very good UX.
| if (!primary) { | ||
| throw new Error("No primary calendar found"); | ||
| } | ||
| if (!calendar) { |
There was a problem hiding this comment.
Replacing the try/catch with the proper short-circuit return value that enables showing the warning without needing to catch an error or even showing it.
| } | ||
| export function Alert(props: AlertProps) { | ||
| const { severity } = props; | ||
| const { severity, iconClassName } = props; |
There was a problem hiding this comment.
To be able to style the icon in the alert as I needed for the calendar list
| className={classNames( | ||
| "divide-y divide-neutral-200 rounded-md border border-l border-r sm:mx-0 sm:overflow-hidden", | ||
| "sm:mx-0 sm:overflow-hidden", | ||
| !noBorderTreatment && "divide-y divide-neutral-200 rounded-md border border-l border-r ", |
There was a problem hiding this comment.
no border option, thank God!
|
Found a small misalignment issue, converted to draft to tackle it before it can be merged. |
|
Before merging we should also make sure this displays on the settings calendar page as well. |
|
Took the opportunity to improve the mobile experience aside from the needed type fix. From this: To this: |
|
Turns out it was quick to do. I have made the changes and this is how it should look. @Jaibles for design on showing a link in the alert I picture the ideal flow should be that when user clicks delete button(which should be changed to a reconnect icon), the app should be uninstalled the same way it is currently and user should be redirected to App installation page to reinstall it(preferably directly to the URL that is behind Install button) |
What does this PR do?
For some reason we lost the warning that let the users know if there was any connected calendar without the correct permissions given.
How it looked before the fix:
How it looks now with the fix for one connected calendar:
How it looks now with the fix for two connected calendar (one failing):
Fixes #4641
Environment: Staging(main branch) / Production
Type of change
How should this be tested?
Go to Apps and connect a Google Calendar. When providing permission don't check the following checkboxes and click the "Continue" button.