Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(dashboard,web): opt-in welcome modal #6920

Merged
merged 14 commits into from
Nov 11, 2024

Conversation

ChmaraX
Copy link
Contributor

@ChmaraX ChmaraX commented Nov 11, 2024

What changed? Why was the change needed?

  • added opt-in welcome modal
  • few changes to opt-in logic

image

Copy link

linear bot commented Nov 11, 2024

@@ -20,7 +20,7 @@ const DialogOverlay = React.forwardRef<
<DialogPrimitive.Overlay
ref={ref}
className={cn(
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80',
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/10',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the backdrop when modal was open was too dark

@@ -37,7 +37,8 @@ const DialogContent = React.forwardRef<
<DialogPrimitive.Content
ref={ref}
className={cn(
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-5 border p-5 shadow duration-200 sm:rounded-lg',
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-auto min-w-[320px] translate-x-[-50%] translate-y-[-50%] gap-5 border p-5 shadow duration-200 sm:rounded-lg',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change so the modal will take width of its content + min width

import { useUser } from '@clerk/clerk-react';
import { NewDashboardOptInStatusEnum } from '@novu/shared';

export function useNewDashboardOptIn() {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1:1 hook as useNewDashboardOptIn in web. Not sure if putting this to shared would be good idea since it depends on @clerk package and we haven't stored hooks in shared yet

Copy link

pkg-pr-new bot commented Nov 11, 2024

Open in Stackblitz

@novu/client

pnpm add https://pkg.pr.new/novuhq/novu/@novu/client@6920

@novu/js

pnpm add https://pkg.pr.new/novuhq/novu/@novu/js@6920

@novu/headless

pnpm add https://pkg.pr.new/novuhq/novu/@novu/headless@6920

@novu/nest

pnpm add https://pkg.pr.new/novuhq/novu/@novu/nest@6920

@novu/nextjs

pnpm add https://pkg.pr.new/novuhq/novu/@novu/nextjs@6920

@novu/node

pnpm add https://pkg.pr.new/novuhq/novu/@novu/node@6920

@novu/framework

pnpm add https://pkg.pr.new/novuhq/novu/@novu/framework@6920

@novu/notification-center

pnpm add https://pkg.pr.new/novuhq/novu/@novu/notification-center@6920

novu

pnpm add https://pkg.pr.new/novuhq/novu@6920

@novu/providers

pnpm add https://pkg.pr.new/novuhq/novu/@novu/providers@6920

@novu/react

pnpm add https://pkg.pr.new/novuhq/novu/@novu/react@6920

@novu/react-native

pnpm add https://pkg.pr.new/novuhq/novu/@novu/react-native@6920

@novu/shared

pnpm add https://pkg.pr.new/novuhq/novu/@novu/shared@6920

@novu/stateless

pnpm add https://pkg.pr.new/novuhq/novu/@novu/stateless@6920

commit: 7030dcd

@ChmaraX ChmaraX merged commit 9cb79a5 into next Nov 11, 2024
42 checks passed
@ChmaraX ChmaraX deleted the nv-4591-implement-prompt-acceptance-path branch November 11, 2024 09:55
Copy link

netlify bot commented Nov 11, 2024

Deploy Preview for novu-stg-vite-dashboard-poc ready!

Name Link
🔨 Latest commit 7030dcd
🔍 Latest deploy log https://app.netlify.com/sites/novu-stg-vite-dashboard-poc/deploys/6731cd4dce494b0008af1e54
😎 Deploy Preview https://deploy-preview-6920--novu-stg-vite-dashboard-poc.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants