diff --git a/functions/src/emulator/seed/content-generate.ts b/functions/src/emulator/seed/content-generate.ts index c5a7a42a19..ba6de13ea3 100644 --- a/functions/src/emulator/seed/content-generate.ts +++ b/functions/src/emulator/seed/content-generate.ts @@ -63,7 +63,7 @@ async function setMockNotifications(user: IMockAuthUser) { }, ], notification_settings: { - emailFrequency: 'weekly', + emailFrequency: 'weekly' as any, // should set from Enum but want to avoid import enabled: { new_comment: true, howto_useful: true, diff --git a/src/models/user.models.tsx b/src/models/user.models.tsx index ed24d25d0c..5d0dc95b8c 100644 --- a/src/models/user.models.tsx +++ b/src/models/user.models.tsx @@ -101,11 +101,18 @@ export const NotificationTypes = [ export type NotificationType = typeof NotificationTypes[number] +export enum EmailNotificationFrequency { + NEVER = '', + DAILY = 'daily', + WEEKLY = 'weekly', + MONTHLY = 'monthly', +} + export type INotificationSettings = { enabled: { [T in NotificationType]: boolean } - emailFrequency: 'daily' | 'weekly' + emailFrequency: EmailNotificationFrequency } export interface IEmailNotificationsQueueItem { diff --git a/src/pages/Settings/SettingsPage.tsx b/src/pages/Settings/SettingsPage.tsx index eda9d3d51c..542b71937d 100644 --- a/src/pages/Settings/SettingsPage.tsx +++ b/src/pages/Settings/SettingsPage.tsx @@ -10,6 +10,7 @@ import { ExpertiseSection } from './content/formSections/Expertise.section' import { WorkspaceSection } from './content/formSections/Workspace.section' import { CollectionSection } from './content/formSections/Collection.section' import { AccountSettingsSection } from './content/formSections/AccountSettings.section' +import { EmailNotificationsSection } from './content/formSections/EmailNotifications.section' import { Button, TextNotification } from 'oa-components' import { ProfileGuidelines } from './content/PostingGuidelines' import { Form } from 'react-final-form' @@ -24,6 +25,7 @@ import { toJS } from 'mobx' import { isModuleSupported, MODULE } from 'src/modules' import { logger } from 'src/logger' import { ProfileType } from 'src/modules/profile/types' +import { AuthWrapper } from 'src/common/AuthWrapper' interface IProps { /** user ID for lookup when editing another user as admin */ @@ -258,6 +260,11 @@ export class UserSettings extends React.Component { showLocationDropdown={this.state.showLocationDropdown} /> + + + diff --git a/src/pages/Settings/content/formSections/EmailNotifications.section.tsx b/src/pages/Settings/content/formSections/EmailNotifications.section.tsx new file mode 100644 index 0000000000..214edb72da --- /dev/null +++ b/src/pages/Settings/content/formSections/EmailNotifications.section.tsx @@ -0,0 +1,60 @@ +import * as React from 'react' +import { Heading, Box, Text } from 'theme-ui' +import { FlexSectionContainer } from './elements' +import { observer, inject } from 'mobx-react' +import { Select } from 'oa-components' +import type { INotificationSettings } from 'src/models/user.models' +import { EmailNotificationFrequency } from 'src/models/user.models' +import { Field } from 'react-final-form' + +interface IProps { + notificationSettings?: INotificationSettings +} + +const emailFrequencyOptions: { + value: EmailNotificationFrequency + label: string +}[] = [ + { value: EmailNotificationFrequency.NEVER, label: 'Never' }, + { value: EmailNotificationFrequency.DAILY, label: 'Daily' }, + { value: EmailNotificationFrequency.WEEKLY, label: 'Weekly' }, + { value: EmailNotificationFrequency.MONTHLY, label: 'Monthly' }, +] + +@inject('userStore') +@observer +export class EmailNotificationsSection extends React.Component { + constructor(props: IProps) { + super(props) + } + + render() { + return ( + + Email notifications + + We send an email with all the notifications you've missed. Select how + often you want to receive this: + + + + {({ input }) => { + return ( +