diff --git a/apps/browser/src/autofill/content/components/lit-stories/notification/body.lit-stories.ts b/apps/browser/src/autofill/content/components/lit-stories/notification/body.lit-stories.ts index c4b32e8b0f1..e43bc08b920 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/notification/body.lit-stories.ts +++ b/apps/browser/src/autofill/content/components/lit-stories/notification/body.lit-stories.ts @@ -12,6 +12,7 @@ type Args = { ciphers: NotificationCipherData[]; notificationType: NotificationType; theme: Theme; + handleEditOrUpdateAction: (e: Event) => void; }; export default { diff --git a/apps/browser/src/autofill/content/components/lit-stories/notification/footer.lit-stories.ts b/apps/browser/src/autofill/content/components/lit-stories/notification/footer.lit-stories.ts index d63c72bf019..b03aeeae311 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/notification/footer.lit-stories.ts +++ b/apps/browser/src/autofill/content/components/lit-stories/notification/footer.lit-stories.ts @@ -8,6 +8,7 @@ import { NotificationFooter } from "../../notification/footer"; type Args = { notificationType: NotificationType; theme: Theme; + handleSaveAction: (e: Event) => void; }; export default { diff --git a/apps/browser/src/autofill/content/components/lit-stories/rows/button-row.lit-stories.ts b/apps/browser/src/autofill/content/components/lit-stories/rows/button-row.lit-stories.ts index 3283c2798a3..ffef4751627 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/rows/button-row.lit-stories.ts +++ b/apps/browser/src/autofill/content/components/lit-stories/rows/button-row.lit-stories.ts @@ -6,6 +6,7 @@ import { ButtonRow } from "../../rows/button-row"; type Args = { theme: Theme; + buttonAction: (e: Event) => void; }; export default { diff --git a/apps/browser/src/autofill/content/components/notification/body.ts b/apps/browser/src/autofill/content/components/notification/body.ts index 6dc957ab8b8..2433381dfba 100644 --- a/apps/browser/src/autofill/content/components/notification/body.ts +++ b/apps/browser/src/autofill/content/components/notification/body.ts @@ -19,11 +19,13 @@ export function NotificationBody({ ciphers, notificationType, theme = ThemeTypes.Light, + handleEditOrUpdateAction, }: { ciphers: NotificationCipherData[]; customClasses?: string[]; notificationType?: NotificationType; theme: Theme; + handleEditOrUpdateAction: (e: Event) => void; }) { // @TODO get client vendor from context const isSafari = false; @@ -37,9 +39,7 @@ export function NotificationBody({ cipher, notificationType, theme, - handleAction: () => { - // @TODO connect update or edit actions to handler - }, + handleAction: handleEditOrUpdateAction, }), }), )} diff --git a/apps/browser/src/autofill/content/components/notification/container.ts b/apps/browser/src/autofill/content/components/notification/container.ts index 8d1b57c80cd..1cdde3ec3ed 100644 --- a/apps/browser/src/autofill/content/components/notification/container.ts +++ b/apps/browser/src/autofill/content/components/notification/container.ts @@ -24,7 +24,13 @@ export function NotificationContainer({ theme = ThemeTypes.Light, type, ciphers, -}: NotificationBarIframeInitData & { handleCloseNotification: (e: Event) => void } & { + handleSaveAction, + handleEditOrUpdateAction, +}: NotificationBarIframeInitData & { + handleCloseNotification: (e: Event) => void; + handleSaveAction: (e: Event) => void; + handleEditOrUpdateAction: (e: Event) => void; +} & { i18n: { [key: string]: string }; type: NotificationType; // @TODO typing override for generic `NotificationBarIframeInitData.type` ciphers: NotificationCipherData[]; @@ -42,12 +48,14 @@ export function NotificationContainer({ })} ${showBody ? NotificationBody({ + handleEditOrUpdateAction, ciphers, notificationType: type, theme, }) : null} ${NotificationFooter({ + handleSaveAction, theme, notificationType: type, })} diff --git a/apps/browser/src/autofill/content/components/notification/footer.ts b/apps/browser/src/autofill/content/components/notification/footer.ts index 91a72dc9aab..edc6d6f6e00 100644 --- a/apps/browser/src/autofill/content/components/notification/footer.ts +++ b/apps/browser/src/autofill/content/components/notification/footer.ts @@ -12,9 +12,11 @@ import { ActionRow } from "../rows/action-row"; import { ButtonRow } from "../rows/button-row"; export function NotificationFooter({ + handleSaveAction, notificationType, theme, }: { + handleSaveAction: (e: Event) => void; notificationType?: NotificationType; theme: Theme; }) { @@ -25,8 +27,12 @@ export function NotificationFooter({ return html`
`; } diff --git a/apps/browser/src/autofill/content/components/rows/button-row.ts b/apps/browser/src/autofill/content/components/rows/button-row.ts index ce14a242e97..942c8dd55fe 100644 --- a/apps/browser/src/autofill/content/components/rows/button-row.ts +++ b/apps/browser/src/autofill/content/components/rows/button-row.ts @@ -8,12 +8,18 @@ import { spacing, themes } from "../../../content/components/constants/styles"; import { Folder, User } from "../../../content/components/icons"; import { DropdownMenu } from "../dropdown-menu"; -export function ButtonRow({ theme }: { theme: Theme }) { +export function ButtonRow({ + theme, + buttonAction, +}: { + theme: Theme; + buttonAction: (e: Event) => void; +}) { return html`