diff --git a/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx b/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx index 3e645212f..7a9a813fe 100644 --- a/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx +++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx @@ -2,9 +2,11 @@ import React, { useState } from 'react'; import { defineMessages, useIntl } from 'react-intl'; import { useHistory } from 'react-router-dom'; +import { changeSetting } from 'soapbox/actions/settings'; import List, { ListItem } from 'soapbox/components/list'; import { Button, CardBody, CardTitle, Form, HStack, IconButton, Stack, Toggle } from 'soapbox/components/ui'; -import { useOwnAccount } from 'soapbox/hooks'; +import SettingToggle from 'soapbox/features/notifications/components/setting-toggle'; +import { useAppDispatch, useOwnAccount, useSettings } from 'soapbox/hooks'; import { useUpdateCredentials } from 'soapbox/queries/accounts'; type FormData = { @@ -14,8 +16,10 @@ type FormData = { const messages = defineMessages({ title: { id: 'chat.page_settings.title', defaultMessage: 'Message Settings' }, + preferences: { id: 'chat.page_settings.preferences', defaultMessage: 'Preferences' }, privacy: { id: 'chat.page_settings.privacy', defaultMessage: 'Privacy' }, - acceptingMessageLabel: { id: 'chat.page_settings.accepting_messages.label', defaultMessage: 'Allow users you follow to start a new chat with you' }, + acceptingMessageLabel: { id: 'chat.page_settings.accepting_messages.label', defaultMessage: 'Allow users to start a new chat with you' }, + playSoundsLabel: { id: 'chat.page_settings.play_sounds.label', defaultMessage: 'Play a sound when you receive a message' }, submit: { id: 'chat.page_settings.submit', defaultMessage: 'Save' }, }); @@ -23,6 +27,8 @@ const ChatPageSettings = () => { const account = useOwnAccount(); const intl = useIntl(); const history = useHistory(); + const dispatch = useAppDispatch(); + const settings = useSettings(); const updateCredentials = useUpdateCredentials(); const [data, setData] = useState({ @@ -30,6 +36,10 @@ const ChatPageSettings = () => { accepts_chat_messages: account?.accepts_chat_messages, }); + const onToggleChange = (key: string[], checked: boolean) => { + dispatch(changeSetting(key, checked, { showAlert: true })); + }; + const handleSubmit = (event: React.FormEvent) => { event.preventDefault(); @@ -49,6 +59,16 @@ const ChatPageSettings = () => {
+ + + + + + + +