stream.place / streamplace
Live video on the AT Protocol
fork atom

i18nize

Natalie B. 6044f2b4 b5a737c9

+59 -40
+46 -39
js/app/components/login/pds-host-selector-modal.tsx
··· 4 4 Checkbox, 5 5 Input, 6 6 ResponsiveDialog, 7 + Trans as T, 7 8 Text, 8 9 useTheme, 10 + useTranslation, 9 11 zero, 10 12 } from "@streamplace/components"; 11 13 import { Check, ExternalLink } from "lucide-react-native"; ··· 93 95 const [handlePolicyChecked, hasCheckedHandlePolicy] = useState(false); 94 96 95 97 const { theme } = useTheme(); 98 + const { t } = useTranslation(); 96 99 97 100 const selectedHostObj = 98 101 SHUFFLED_PDS_HOSTS.find((host) => host.value === selectedHost) || ··· 145 148 <View style={[{ maxWidth: 500 }]}> 146 149 <View style={[zero.my[4]]}> 147 150 <Text size="2xl" style={[zero.mb[2]]}> 148 - New to the Atmosphere? 151 + {t("pds-selector-title")} 149 152 </Text> 150 153 <Text style={[{ color: theme.colors.textMuted }]}> 151 - You'll need to select a PDS (Personal Data Server) to access apps on 152 - the Atmosphere, such as Bluesky, Tangled, and Spark. 154 + {t("pds-selector-description")} 153 155 </Text> 154 156 </View> 155 157 <View style={[zero.pb[2]]}> ··· 226 228 ]} 227 229 > 228 230 <View style={[zero.flex[1]]}> 229 - <Text>Another PDS</Text> 231 + <Text>{t("pds-selector-custom-label")}</Text> 230 232 <Text 231 233 style={[ 232 234 zero.mt[1], 233 235 { fontSize: 14, color: theme.colors.textMuted }, 234 236 ]} 235 237 > 236 - Enter your own PDS host URL 238 + {t("pds-selector-custom-description")} 237 239 </Text> 238 240 </View> 239 241 {useCustom && <Check size={20} color={theme.colors.primary} />} ··· 250 252 ]} 251 253 > 252 254 <Text style={[{ color: theme.colors.ring, fontSize: 14 }]}> 253 - Learn more about self-hosting 255 + {t("pds-selector-learn-more")} 254 256 </Text> 255 257 <ExternalLink size={16} color={theme.colors.ring} /> 256 258 </Pressable> ··· 259 261 {useCustom && ( 260 262 <View style={[zero.mt[3]]}> 261 263 <Text style={[zero.mb[2], { color: theme.colors.textMuted }]}> 262 - PDS URL 264 + {t("pds-selector-custom-url-label")} 263 265 </Text> 264 266 <Input 265 267 value={customHost} 266 268 onChangeText={setCustomHost} 267 - placeholder="https://pds.example.com" 269 + placeholder={t("pds-selector-custom-url-placeholder")} 268 270 autoCapitalize="none" 269 271 autoCorrect={false} 270 272 keyboardType="url" ··· 272 274 </View> 273 275 )} 274 276 <Admonition variant="info" style={[zero.my[4]] as any}> 275 - <Text style={[zero.mb[2]]}> 276 - Each host has their own policies and reliability standards. Your 277 - ATProto data lives on the host you choose and you can migrate 278 - later. 279 - </Text> 277 + <Text style={[zero.mb[2]]}>{t("pds-selector-info")}</Text> 280 278 {!useCustom && ( 281 279 <Text style={[zero.mb[2]]}> 282 - Read {selectedHostObj?.label}'s{" "} 283 - <Text 284 - onPress={handleTOS} 285 - style={[{ color: theme.colors.ring }]} 286 - > 287 - Terms of Service 288 - </Text>{" "} 289 - and{" "} 290 - <Text 291 - onPress={handlePrivacy} 292 - style={[{ color: theme.colors.ring }]} 293 - > 294 - Privacy Policy 295 - </Text>{" "} 296 - before continuing. 280 + <T 281 + i18nKey="pds-selector-read-policies" 282 + values={{ label: selectedHostObj?.label }} 283 + components={{ 284 + tosLink: ( 285 + <Text 286 + onPress={handleTOS} 287 + style={[{ color: theme.colors.ring }]} 288 + /> 289 + ), 290 + privacyLink: ( 291 + <Text 292 + onPress={handlePrivacy} 293 + style={[{ color: theme.colors.ring }]} 294 + /> 295 + ), 296 + }} 297 + /> 297 298 </Text> 298 299 )} 299 300 </Admonition> ··· 313 314 onCheckedChange={hasCheckedHandlePolicy} 314 315 /> 315 316 <Text style={[zero.flex[1]]}> 316 - I have read and agree to the{" "} 317 - <Text 318 - onPress={() => 319 - Linking.openURL(selectedHostObj.handlePolicyDocs!) 320 - } 321 - style={[{ color: theme.colors.ring }]} 322 - > 323 - {selectedHostObj.label} guidelines and handle policy 324 - </Text> 317 + <T 318 + i18nKey="pds-selector-handle-policy-checkbox" 319 + components={{ 320 + policyLink: ( 321 + <Text 322 + onPress={() => 323 + Linking.openURL(selectedHostObj.handlePolicyDocs!) 324 + } 325 + style={[{ color: theme.colors.ring }]} 326 + > 327 + {selectedHostObj.label} guidelines and handle policy 328 + </Text> 329 + ), 330 + }} 331 + /> 325 332 </Text> 326 333 </View> 327 334 )} ··· 335 342 ]} 336 343 > 337 344 <Button width="min" variant="secondary" onPress={handleCancel}> 338 - <Text>Cancel</Text> 345 + <Text>{t("cancel")}</Text> 339 346 </Button> 340 347 <Button 341 348 width="min" ··· 346 353 (!handlePolicyChecked && !!selectedHostObj.handlePolicyDocs) 347 354 } 348 355 > 349 - <Text>Continue</Text> 356 + <Text>{t("continue")}</Text> 350 357 </Button> 351 358 </View> 352 359 </View>
+13 -1
js/components/locales/en-US/common.ftl
··· 51 51 [streamer] Looks like <1>@{ $handle } is offline</1>, but they recommend checking out: 52 52 *[default] Looks like <1>@{ $handle } is offline</1>, but we recommend checking out: 53 53 } 54 - user-offline-no-recommendations = 54 + user-offline-no-recommendations = 55 55 Looks like <1>@{ $handle } is offline</1> right now. 56 56 Check back later. 57 57 streaming-title = streaming { $title } ··· 60 60 [1] 1 viewer 61 61 *[other] { $count } viewers 62 62 } 63 + 64 + ## PDS Host Selector 65 + pds-selector-title = New to the Atmosphere? 66 + pds-selector-description = You'll need to select a PDS (Personal Data Server) to access apps on the Atmosphere, such as Bluesky, Tangled, and Spark. 67 + pds-selector-custom-label = Another PDS 68 + pds-selector-custom-description = Enter your own PDS host URL 69 + pds-selector-custom-url-label = Custom PDS URL 70 + pds-selector-custom-url-placeholder = https://pds.example.com 71 + pds-selector-learn-more = Learn more about self-hosting 72 + pds-selector-info = Each host has their own policies and reliability standards. Your ATProto data lives on the host you choose and you can migrate later. Note: Streamplace has its own moderation rules - you can be banned from Streamplace regardless of which host you choose. 73 + pds-selector-read-policies = Read { $label }'s <tosLink>Terms of Service</tosLink> and <privacyLink>Privacy Policy</privacyLink> before continuing. 74 + pds-selector-handle-policy-checkbox = I have read and agree to the <policyLink>handle policy</policyLink>