Add localized feed profile-completion nudge
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { StyleSheet, SafeAreaView, FlatList } from 'react-native';
|
||||
import { Card, Text, Button } from 'react-native-paper';
|
||||
import API from './../API.js';
|
||||
import Post from './../components/Post.js';
|
||||
import PostPopularUsers from '../components/PostPopularUsers.js';
|
||||
@@ -7,6 +8,8 @@ import GlobalState from '../contexts/GlobalState.js';
|
||||
import * as Linking from 'expo-linking';
|
||||
import { posthog } from './../PostHog.js';
|
||||
import * as Updates from 'expo-updates';
|
||||
import { useSnapshot } from 'valtio';
|
||||
import i18n from "../i18nMessages.js";
|
||||
|
||||
import AsyncStorage from '@react-native-async-storage/async-storage';
|
||||
|
||||
@@ -69,6 +72,8 @@ async function onFetchUpdateAsync() {
|
||||
}
|
||||
|
||||
let Feed = ({ navigation, route }) => {
|
||||
const gState = useSnapshot(GlobalState);
|
||||
const viewer = gState.me || {};
|
||||
let [Posts, setPosts] = useState([]);
|
||||
const flatListRef = React.useRef()
|
||||
logFeed('render', {
|
||||
@@ -151,12 +156,36 @@ let Feed = ({ navigation, route }) => {
|
||||
return (<Post post={item} />);
|
||||
});
|
||||
|
||||
const missingProfilePhoto = !viewer?.profile?.photo;
|
||||
const missingDescription = !String(viewer?.profile?.description || '').trim();
|
||||
const shouldShowProfileNudge = missingProfilePhoto || missingDescription;
|
||||
const renderProfileNudge = () => {
|
||||
if (!shouldShowProfileNudge) return null;
|
||||
return (
|
||||
<Card style={styles.profileNudgeCard}>
|
||||
<Card.Content>
|
||||
<Text style={styles.profileNudgeTitle}>{i18n.t("message.completeProfileTitle")}</Text>
|
||||
<Text style={styles.profileNudgeBody}>{i18n.t("message.completeProfileBody")}</Text>
|
||||
<Text style={styles.profileNudgeHint}>
|
||||
{i18n.t("message.completeProfileMissingHint")}
|
||||
</Text>
|
||||
</Card.Content>
|
||||
<Card.Actions>
|
||||
<Button mode="contained" onPress={() => navigation.navigate("ProfileSettings")}>
|
||||
{i18n.t("message.updateProfile")}
|
||||
</Button>
|
||||
</Card.Actions>
|
||||
</Card>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
return (
|
||||
<SafeAreaView>
|
||||
<FlatList
|
||||
data={Posts}
|
||||
renderItem={renderPost}
|
||||
ListHeaderComponent={renderProfileNudge}
|
||||
keyExtractor={item => item.lastUpdated || item._id || item.createdAt} //This may refresh the component
|
||||
//ListHeaderComponent={<NewPost newPostCB={(newPost) => setPosts([newPost, ...Posts])} />}
|
||||
refreshing={Posts.length === 0}
|
||||
@@ -185,4 +214,22 @@ const styles = StyleSheet.create({
|
||||
container: {
|
||||
backgroundColor: "#edf2f7",
|
||||
},
|
||||
profileNudgeCard: {
|
||||
marginHorizontal: 10,
|
||||
marginTop: 10,
|
||||
marginBottom: 6,
|
||||
},
|
||||
profileNudgeTitle: {
|
||||
fontSize: 18,
|
||||
fontWeight: "700",
|
||||
marginBottom: 4,
|
||||
},
|
||||
profileNudgeBody: {
|
||||
color: "#4b5563",
|
||||
},
|
||||
profileNudgeHint: {
|
||||
marginTop: 8,
|
||||
color: "#6b7280",
|
||||
fontSize: 12,
|
||||
},
|
||||
});
|
||||
|
||||
@@ -124,6 +124,11 @@ const messages = {
|
||||
writeMessage: "Write a message...",
|
||||
send: "Send",
|
||||
aiTranslated: "AI Translated",
|
||||
completeProfileTitle: "Complete your profile",
|
||||
completeProfileBody: "Add a profile photo and short description so people can recognize you.",
|
||||
completeProfileMissingHint: "Looks like your profile is still missing some details.",
|
||||
completeProfileTestingHint: "This reminder is temporarily shown to everyone for testing.",
|
||||
updateProfile: "Update Profile",
|
||||
},
|
||||
},
|
||||
es: {
|
||||
@@ -243,6 +248,11 @@ const messages = {
|
||||
writeMessage: "Escribe un mensaje...",
|
||||
send: "Enviar",
|
||||
aiTranslated: "Traducido por IA",
|
||||
completeProfileTitle: "Completa tu perfil",
|
||||
completeProfileBody: "Agrega una foto de perfil y una breve descripción para que las personas puedan reconocerte.",
|
||||
completeProfileMissingHint: "Parece que a tu perfil todavía le faltan algunos detalles.",
|
||||
completeProfileTestingHint: "Este recordatorio se muestra temporalmente a todos para pruebas.",
|
||||
updateProfile: "Actualizar perfil",
|
||||
}
|
||||
},
|
||||
fr: {
|
||||
@@ -362,6 +372,11 @@ const messages = {
|
||||
writeMessage: "Écrire un message...",
|
||||
send: "Envoyer",
|
||||
aiTranslated: "Traduit par l'IA",
|
||||
completeProfileTitle: "Complétez votre profil",
|
||||
completeProfileBody: "Ajoutez une photo de profil et une courte description pour que les autres puissent vous reconnaître.",
|
||||
completeProfileMissingHint: "Il semble que votre profil manque encore de quelques informations.",
|
||||
completeProfileTestingHint: "Ce rappel est temporairement affiché à tout le monde pour les tests.",
|
||||
updateProfile: "Mettre à jour le profil",
|
||||
}
|
||||
},
|
||||
da: {
|
||||
@@ -481,6 +496,11 @@ const messages = {
|
||||
writeMessage: "Skriv en besked...",
|
||||
send: "Send",
|
||||
aiTranslated: "AI-oversat",
|
||||
completeProfileTitle: "Udfyld din profil",
|
||||
completeProfileBody: "Tilføj et profilbillede og en kort beskrivelse, så andre kan genkende dig.",
|
||||
completeProfileMissingHint: "Det ser ud til, at din profil stadig mangler nogle detaljer.",
|
||||
completeProfileTestingHint: "Denne påmindelse vises midlertidigt til alle for test.",
|
||||
updateProfile: "Opdater profil",
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user