From 07da9ef243954ddf1e7ca62749a89bb658118e48 Mon Sep 17 00:00:00 2001
From: Ahmad Ansori Palembani <palembani+github@gmail.com>
Date: Sat, 28 Oct 2023 03:26:33 +0000
Subject: [PATCH] chore(l10n): Migrated login

---
 src/locales/en-US/app.ftl                           |  1 +
 src/soapbox/features/ui/components/cta-banner.tsx   |  9 ++++++---
 .../ui/components/modals/unauthorized-modal.tsx     | 13 +++++++++++--
 src/soapbox/features/ui/components/navbar.tsx       |  9 ++++++---
 src/soapbox/locales/en.json                         |  1 -
 5 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/src/locales/en-US/app.ftl b/src/locales/en-US/app.ftl
index 5c5e92a55..c4c6b63f7 100644
--- a/src/locales/en-US/app.ftl
+++ b/src/locales/en-US/app.ftl
@@ -67,6 +67,7 @@ about-Page--available = Available in:
 # Components that related to Account such as profile, hover card.
 
 -edit-profile = Edit profile
+account-Action--login = Sign in
 account-Badge--admin = Admin
 account-Badge--bot = Bot
 account-Badge--moderator = Moderator
diff --git a/src/soapbox/features/ui/components/cta-banner.tsx b/src/soapbox/features/ui/components/cta-banner.tsx
index cecd4fbbd..f27733546 100644
--- a/src/soapbox/features/ui/components/cta-banner.tsx
+++ b/src/soapbox/features/ui/components/cta-banner.tsx
@@ -1,3 +1,4 @@
+import { Localized } from '@fluent/react';
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
 
@@ -27,9 +28,11 @@ const CtaBanner = () => {
           </Stack>
 
           <HStack space={2} alignItems='center'>
-            <Button theme='secondary' to='/login'>
-              <FormattedMessage id='account.login' defaultMessage='Log in' />
-            </Button>
+            <Localized id='account-Action--login'>
+              <Button theme='secondary' to='/login'>
+                Sign in
+              </Button>
+            </Localized>
 
             <Button theme='accent' to='/signup'>
               <FormattedMessage id='account.register' defaultMessage='Sign up' />
diff --git a/src/soapbox/features/ui/components/modals/unauthorized-modal.tsx b/src/soapbox/features/ui/components/modals/unauthorized-modal.tsx
index c2e5f7965..66cc66948 100644
--- a/src/soapbox/features/ui/components/modals/unauthorized-modal.tsx
+++ b/src/soapbox/features/ui/components/modals/unauthorized-modal.tsx
@@ -1,3 +1,4 @@
+import { Localized } from '@fluent/react';
 import React, { useState } from 'react';
 import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
 import { useHistory } from 'react-router-dom';
@@ -103,7 +104,11 @@ const UnauthorizedModal: React.FC<IUnauthorizedModal> = ({ action, onClose, acco
         title={header}
         onClose={onClickClose}
         confirmationAction={onLogin}
-        confirmationText={<FormattedMessage id='account.login' defaultMessage='Log in' />}
+        confirmationText={
+          <Localized id='account-Action--login'>
+            <span>Sign in</span>
+          </Localized>
+        }
         secondaryAction={isOpen ? onRegister : undefined}
         secondaryText={isOpen ? <FormattedMessage id='account.register' defaultMessage='Sign up' /> : undefined}
       >
@@ -144,7 +149,11 @@ const UnauthorizedModal: React.FC<IUnauthorizedModal> = ({ action, onClose, acco
       title={<FormattedMessage id='unauthorized_modal.title' defaultMessage='Sign up for {site_title}' values={{ site_title: instance.title }} />}
       onClose={onClickClose}
       confirmationAction={onLogin}
-      confirmationText={<FormattedMessage id='account.login' defaultMessage='Log in' />}
+      confirmationText={
+        <Localized id='account-Action--login'>
+          <span>Sign in</span>
+        </Localized>
+      }
       secondaryAction={isOpen ? onRegister : undefined}
       secondaryText={isOpen ? <FormattedMessage id='account.register' defaultMessage='Sign up' /> : undefined}
     >
diff --git a/src/soapbox/features/ui/components/navbar.tsx b/src/soapbox/features/ui/components/navbar.tsx
index 84bab5516..d8d78eb9e 100644
--- a/src/soapbox/features/ui/components/navbar.tsx
+++ b/src/soapbox/features/ui/components/navbar.tsx
@@ -1,3 +1,4 @@
+import { Localized } from '@fluent/react';
 import clsx from 'clsx';
 import React, { useRef, useState } from 'react';
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
@@ -146,9 +147,11 @@ const Navbar = () => {
                 </Form>
 
                 <div className='space-x-1.5 lg:hidden'>
-                  <Button theme='tertiary' to='/login' size='sm'>
-                    <FormattedMessage id='account.login' defaultMessage='Log In' />
-                  </Button>
+                  <Localized id='account-Action--login'>
+                    <Button theme='tertiary' to='/login' size='sm'>
+                      Sign in
+                    </Button>
+                  </Localized>
 
                   {isOpen && (
                     <Button theme='primary' to='/signup' size='sm'>
diff --git a/src/soapbox/locales/en.json b/src/soapbox/locales/en.json
index aacc7b732..8e1008e6b 100644
--- a/src/soapbox/locales/en.json
+++ b/src/soapbox/locales/en.json
@@ -1,5 +1,4 @@
 {
-  "account.login": "Log in",
   "account.media": "Media",
   "account.member_since": "Joined {date}",
   "account.mention": "Mention",