diff --git a/src/state/persisted/schema.ts b/src/state/persisted/schema.ts
index 11204f3090..1381f66b5d 100644
--- a/src/state/persisted/schema.ts
+++ b/src/state/persisted/schema.ts
@@ -71,7 +71,7 @@ const schema = z.object({
contentLanguages: z.array(z.string()),
/**
* The language(s) the user is currently posting in, configured within the
- * composer. Multiple languages are psearate by commas.
+ * composer. Multiple languages are separated by commas.
*
* BCP-47 2-letter language code without region.
*/
diff --git a/src/state/preferences/languages.tsx b/src/state/preferences/languages.tsx
index 14ba62dba9..5d4336814c 100644
--- a/src/state/preferences/languages.tsx
+++ b/src/state/preferences/languages.tsx
@@ -156,6 +156,10 @@ export function toPostLanguages(postLanguage: string): string[] {
return postLanguage.split(',').filter(Boolean)
}
+export function fromPostLanguages(languages: string[]): string {
+ return languages.filter(Boolean).join(',')
+}
+
export function hasPostLanguage(postLanguage: string, code2: string): boolean {
return toPostLanguages(postLanguage).includes(code2)
}
diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx
index a4e0bd06fb..82b0dc6e29 100644
--- a/src/view/com/composer/Composer.tsx
+++ b/src/view/com/composer/Composer.tsx
@@ -88,6 +88,7 @@ import {
import {useModalControls} from '#/state/modals'
import {useRequireAltTextEnabled} from '#/state/preferences'
import {
+ fromPostLanguages,
toPostLanguages,
useLanguagePrefs,
useLanguagePrefsApi,
@@ -196,6 +197,25 @@ export const ComposePost = ({
const [isPublishing, setIsPublishing] = useState(false)
const [publishingStage, setPublishingStage] = useState('')
const [error, setError] = useState('')
+ const [acceptedLanguageSuggestion, setAcceptedLanguageSuggestion] = useState<
+ string | null
+ >(null)
+
+ // NOTE(@elijaharita): if a temporary language suggestion has been accepted,
+ // show that as the post language instead of the one from langPrefs.
+ const currentLanguages = useMemo(
+ () =>
+ acceptedLanguageSuggestion
+ ? [acceptedLanguageSuggestion]
+ : toPostLanguages(langPrefs.postLanguage),
+ [acceptedLanguageSuggestion, langPrefs.postLanguage],
+ )
+
+ // This effect clears the temporary language suggestion if the post language
+ // is manually changed, so the user doesn't get stuck with the suggestion.
+ useEffect(() => {
+ setAcceptedLanguageSuggestion(null)
+ }, [langPrefs.postLanguage])
const [composerState, composerDispatch] = useReducer(
composerReducer,
@@ -414,7 +434,7 @@ export const ComposePost = ({
thread,
replyTo: replyTo?.uri,
onStateChange: setPublishingStage,
- langs: toPostLanguages(langPrefs.postLanguage),
+ langs: currentLanguages,
})
).uris[0]
@@ -490,7 +510,7 @@ export const ComposePost = ({
isPartOfThread: thread.posts.length > 1,
hasLink: !!post.embed.link,
hasQuote: !!post.embed.quote,
- langs: langPrefs.postLanguage,
+ langs: fromPostLanguages(currentLanguages),
logContext: 'Composer',
})
index++
@@ -557,7 +577,7 @@ export const ComposePost = ({
thread,
canPost,
isPublishing,
- langPrefs.postLanguage,
+ currentLanguages,
onClose,
onPost,
onPostSuccess,
@@ -656,6 +676,8 @@ export const ComposePost = ({
text={activePost.richtext.text}
// NOTE(@elijaharita): currently just choosing the first language if any exists
replyToLanguage={replyTo?.langs?.[0]}
+ currentLanguages={currentLanguages}
+ onChange={setAcceptedLanguageSuggestion}
/>
>
)
@@ -1289,6 +1312,7 @@ function ComposerFooter({
onEmojiButtonPress,
onSelectVideo,
onAddPost,
+ currentLanguages,
}: {
post: PostDraft
dispatch: (action: PostAction) => void
@@ -1297,6 +1321,7 @@ function ComposerFooter({
onError: (error: string) => void
onSelectVideo: (postId: string, asset: ImagePickerAsset) => void
onAddPost: () => void
+ currentLanguages: string[]
}) {
const t = useTheme()
const {_} = useLingui()
@@ -1450,7 +1475,7 @@ function ComposerFooter({
)}
-
+
-
+
>
)
}
@@ -43,7 +53,9 @@ export function PostLanguageSelect() {
<>
- {({props}) => }
+ {({props}) => (
+
+ )}
@@ -59,7 +71,7 @@ export function PostLanguageSelect() {
onPress={() => setLangPrefs.setPostLanguage(historyItem)}>
{langName}
)
@@ -77,17 +89,25 @@ export function PostLanguageSelect() {
-
+
>
)
}
-function LanguageBtn(props: Omit) {
+function LanguageBtn(
+ props: Omit & {
+ currentLanguages?: string[]
+ },
+) {
const {_} = useLingui()
const langPrefs = useLanguagePrefs()
const t = useTheme()
const postLanguagesPref = toPostLanguages(langPrefs.postLanguage)
+ const currentLanguages = props.currentLanguages ?? postLanguagesPref
return (