diff --git a/app/soapbox/features/chats/components/chat-page/chat-page.tsx b/app/soapbox/features/chats/components/chat-page/chat-page.tsx index 728f4bfc2..32a69ee0d 100644 --- a/app/soapbox/features/chats/components/chat-page/chat-page.tsx +++ b/app/soapbox/features/chats/components/chat-page/chat-page.tsx @@ -9,6 +9,7 @@ import { useChat } from 'soapbox/queries/chats'; import ChatPageMain from './components/chat-page-main'; import ChatPageNew from './components/chat-page-new'; +import ChatPageSettings from './components/chat-page-settings'; import ChatPageSidebar from './components/chat-page-sidebar'; import Welcome from './components/welcome'; @@ -85,7 +86,7 @@ const ChatPage: React.FC = ({ chatId }) => { - + 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 new file mode 100644 index 000000000..4c214ff07 --- /dev/null +++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx @@ -0,0 +1,67 @@ +import React, { useState } from 'react'; +import { defineMessages, useIntl } from 'react-intl'; + +import List, { ListItem } from 'soapbox/components/list'; +import { Button, CardBody, CardTitle, Form, Stack, Toggle } from 'soapbox/components/ui'; +import { useOwnAccount } from 'soapbox/hooks'; +import { useUpdateCredentials } from 'soapbox/queries/accounts'; + +type FormData = { + accepting_messages?: boolean + chats_onboarded: boolean +} + +const messages = defineMessages({ + title: { id: 'chat.page_settings.title', defaultMessage: 'Message Settings' }, + privacy: { id: 'chat.page_settings.privacy', defaultMessage: 'Privacy' }, + acceptingMessageLabel: { id: 'chat.page_settings.accepting_messages.label', defaultMessage: 'Allow others to message me' }, + acceptingMessageHint: { id: 'chat.page_settings.accepting_messages.hint', defaultMessage: 'Only people I follow can send me messages' }, + submit: { id: 'chat.page_settings.submit', defaultMessage: 'Save' }, +}); + +const ChatPageSettings = () => { + const account = useOwnAccount(); + const intl = useIntl(); + const updateCredentials = useUpdateCredentials(); + + const [data, setData] = useState({ + chats_onboarded: true, + accepting_messages: account?.accepting_messages, + }); + + const handleSubmit = (event: React.FormEvent) => { + event.preventDefault(); + + updateCredentials.mutate(data); + }; + + return ( + + + +
+ + + + + + setData((prevData) => ({ ...prevData, accepting_messages: event.target.checked }))} + /> + + + + + + +
+ ); +}; + +export default ChatPageSettings; \ No newline at end of file diff --git a/app/soapbox/features/chats/components/chat-page/components/welcome.tsx b/app/soapbox/features/chats/components/chat-page/components/welcome.tsx index b096cf9ab..d70cf7d93 100644 --- a/app/soapbox/features/chats/components/chat-page/components/welcome.tsx +++ b/app/soapbox/features/chats/components/chat-page/components/welcome.tsx @@ -77,7 +77,7 @@ const Welcome = () => { {intl.formatMessage(messages.notice)} -