feat: Enhance private link expiration with usage and date limits

[retrogtx]

What does this PR do?

• Fixes #19906 (GitHub issue number)
• Fixes CAL-5283 (Linear issue number - should be visible at the bottom of the GitHub issue description)

https://www.loom.com/share/918768d71448470a9b19aeea8686917f?sid=74bfe2f6-73e1-4e7c-80e0-82386099bb5a

Mandatory Tasks (DO NOT REMOVE)

• [ ] I have self-reviewed the code (A decent size PR without self-review might be rejected).
• [x] I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. If N/A, write N/A here and check the checkbox. N/A.
• [x] I confirm automated tests are in place that prove my fix is effective or that my feature works.

[vercel[bot]]

@retrogtx is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.

[graphite-app[bot]]

Graphite Automations

"Add consumer team as reviewer" took an action on this PR • (03/17/25)

1 reviewer was added to this PR based on Keith Williams's automation.

"Add community label" took an action on this PR • (03/17/25)

1 label was added to this PR based on Keith Williams's automation.

[asadath1395]

@retrogtx You beat me on this :D. I was almost done with the implementation, i had implemented it differently as in instead of dropdown, just provided the max usage and expiry date field as input and then based on the values add the checks for expiry and also show the link expiry error message below the link. Anyways good job!

[retrogtx]

hey @asadath1395

thanks for trying, there are many other issues lying around along with bounties that might interest you

thank you again 🫡

[github-actions[bot]]

E2E results are ready!

• Workflow #66154.1 latest results

[retrogtx]

🫡 @alishaz-polymath everything's done

[retrogtx]

That weird since one can't choose a previous date in the first place

[alishaz-polymath]

That weird since one can't choose a previous date in the first place

Yeah I updated the date directly in the DB for testing purposes.

[retrogtx]

btw it has been implemented, done! @alishaz-polymath

[alishaz-polymath]

Looks

A few things failing:

1. When I try to create multiple private links, say I have created 1 that expires on a certain date -> As soon as I try to "Add new link", I get error: Error: Rendered more hooks than during the previous render.
2. The expiration date is not working. My expiration date is set to 15 of March 2025, yet I am able to access the booking page on 18th of March 2025
3. Translation missing for link_expired_on_date

These issues seem to be addressed 🙏 Reviewing the code right now, but I am wondering if the flow where the expired private link leads to private link toggle being turned off is the desired flow here. @CarinaWolli Can you confirm if that's what we want?

[alishaz-polymath]

I have some UI suggestions. I think it would look cleaner if we don't show the 'Expires on' and 'Maximum number of uses' inputs and only have the gray text there:

Instead, open a Dialog after clicking the settings button and handle all settings in there. In the dialog you can either pick 'Usage-based or 'Time-based', by default it's a usage-based linked with Number of uses = 1

Let me know what you think about that

If I understand you correctly, the dialog where the user selects "time based" or "usage based", they get the exact number/date input there so that we don't see an input afterwards, right? I agree that's a lot cleaner yeah. Love it! @retrogtx what do you think?

[retrogtx]

will make the changes 🫡

[retrogtx]

things are ready! @alishaz-polymath @CarinaWolli

[CarinaWolli]

Can we use the same radio buttons as here?

Also I would remove 'single use' as an option and only have 'time-based' and 'usage-based'. The default is usage-based with 1 as the input

[retrogtx]

on it

[retrogtx]

fixed, will push everything in a while!

[alishaz-polymath]

fixed, will push everything in a while!

Can we not have the input inline like so?

[retrogtx]

yep working on that

[retrogtx]

I have some UI suggestions. I think it would look cleaner if we don't show the 'Expires on' and 'Maximum number of uses' inputs and only have the gray text there:

Instead, open a Dialog after clicking the settings button and handle all settings in there. In the dialog you can either pick 'Usage-based or 'Time-based', by default it's a usage-based linked with Number of uses = 1

Let me know what you think about that

I thought about that dialog as it was mentioned here soo did not go with the inline approach initially

[alishaz-polymath]

I have some UI suggestions. I think it would look cleaner if we don't show the 'Expires on' and 'Maximum number of uses' inputs and only have the gray text there: Instead, open a Dialog after clicking the settings button and handle all settings in there. In the dialog you can either pick 'Usage-based or 'Time-based', by default it's a usage-based linked with Number of uses = 1 Let me know what you think about that

I thought about that dialog as it was mentioned here soo did not go with the inline approach initially

Yeah I mean within the dialog itself, just have it as inline, just like the image shared by @CarinaWolli I think that's what she meant as well, she can correct me if I'm mistaken here. 🤚

[retrogtx]

alright, is this nice?

[alishaz-polymath]

alright, is this nice?

I like this, deferring to @CarinaWolli for the final decision.

[CarinaWolli]

alright, is this nice?

This looks good 🙌🏻

[alishaz-polymath]

@retrogtx Type checks failing, I pulled it locally and I see a bunch of errors too in the MultiplePrivateLinksController file. Can you take a look?

[retrogtx]

most of these are prettier errors from untouched files, strange

[retrogtx]

gentle ping, @alishaz-polymath

[CarinaWolli]

I have some design suggestions.

Before:

After:

• also make use of our radio button component, it should look like that:

[retrogtx]

will be done 👍👍

[alishaz-polymath]

@retrogtx How is this looking? Is it ready for a review again?

[retrogtx]

@alishaz-polymath it has always been ready!!