add a lihgt gret background to the checkbox of "Notify end user when their email is quarantined by this rule", and make the grey box outside of the launch in active mode radio box. On the grey box, we show the checkbox of "notify end user when their email is quarantined by this rule" first, by default it should be checked, below the checkbox, include fiels in the screenshot. If users uncheck the notify end user checkbox, collapse the rest of the fields
The screenshot shows a notification settings form with:
I need to add this to the Create Rule page with a light grey background box containing a checkbox that controls visibility of these fields.
Now I need to add state variables for the notification form fields and modify the UI to show the checkbox with a grey background box outside the active mode radio, with collapsible form fields below it.
Now let me update the launch modal section to move the checkbox outside the active mode radio and add the grey background box with the notification form fields:
Added the notification settings to the Create Rule launch modal. The checkbox "Notify end user when their email is quarantined by this rule" now appears in a light grey background box (bg-muted/50) outside the "Launch in Active Mode" radio option. The checkbox is checked by default. When checked, the form fields are displayed including "From" email (Display Name and From Email Address), Additional Email Recipients (Bcc) dropdown, "Reply To" email (Display Name and Reply To Email Address), and Subject Line. When the checkbox is unchecked, all these fields collapse and hide. Input fields have a white background to stand out from the grey container.
Added max-h-[85vh] overflow-hidden flex flex-col to the DialogContent and overflow-y-auto flex-1 pr-2 to the content div inside the Launch Rule modal. This constrains the modal to 85% of the viewport height and makes the content area scrollable when it overflows, while keeping the header and footer fixed. The pr-2 adds right padding to prevent content from being hidden by the scrollbar.