Merge pull request #1107 from brave/master

Production Release 2024-02-29

.eslintrc.js

@@ -60,6 +60,7 @@ module.exports = {
           "transform",
           "format",
           "name",
+          "padding",
         ],
       },
     ],

.github/workflows/codeql-analysis.yml

@@ -42,7 +42,7 @@ jobs:
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@379614612a29c9e28f31f39a59013eb8012a51f0 # v3.24.3
+        uses: github/codeql-action/init@47b3d888fe66b639e431abf22ebca059152f1eea # v3.24.5
         with:
           languages: ${{ matrix.language }}
           # If you wish to specify custom queries, you can do so here or in a config file.
@@ -53,7 +53,7 @@ jobs:
       # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
       # If this step fails, then you should remove it and run the build manually (see below)
       - name: Autobuild
-        uses: github/codeql-action/autobuild@379614612a29c9e28f31f39a59013eb8012a51f0 # v3.24.3
+        uses: github/codeql-action/autobuild@47b3d888fe66b639e431abf22ebca059152f1eea # v3.24.5
 
       # ℹ️ Command-line programs to run using the OS shell.
       # 📚 https://git.io/JvXDl
@@ -67,4 +67,4 @@ jobs:
       #   make release
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@379614612a29c9e28f31f39a59013eb8012a51f0 # v3.24.3
+        uses: github/codeql-action/analyze@47b3d888fe66b639e431abf22ebca059152f1eea # v3.24.5

README.md

@@ -5,7 +5,7 @@
 
 Brave Ads Manager is a key component of the ads infrastructure. From the ads manager, advertisers are able to define unique ad campaigns and creatives. Additionally, advertisers can review delivery and engagement metrics on their ad campaigns.
 
-### Tech Stack & Philosophy
+## Tech Stack & Philosophy
 
 `ads-manager` is built with [TypeScript](https://www.typescriptlang.org/) and [React.js](https://reactjs.org/).
 
@@ -17,7 +17,7 @@ Our application bundle is created with [webpack](https://webpack.js.org/) and st
 
 This bundle is then served to users as a static asset by [AWS CloudFront CDN](https://aws.amazon.com/cloudfront/).
 
-### Local Development
+## Local Development
 
 - Create a `.env.local` file, or update `.env` file provided
 - Set `BACKEND_URL=<>` to the endpoint you wish to pull data from.
@@ -26,8 +26,40 @@ This bundle is then served to users as a static asset by [AWS CloudFront CDN](ht
 We are using HTTPS in developer mode so that cookie based authentication works properly.
 You may need to proceed through a certificate warning in order to develop locally.
 
-#### Generating GraphQL Types:
+### Generating GraphQL Types:
 
 ```
 > npm run codegen
 ```
+
+## Localization
+After changing text, o adding new translated text you need to run:
+```
+❯ npm run extract
+```
+
+THe output should look something like:
+```
+> ads-ui@0.1.0 extract
+> lingui extract
+
+✔
+Catalog statistics for src/locales/{locale}:
+┌──────────┬─────────────┬─────────┐
+│ Language │ Total count │ Missing │
+├──────────┼─────────────┼─────────┤
+│ en       │     488     │    0    │
+│ es       │     491     │   491   │
+│ pt       │     491     │   491   │
+└──────────┴─────────────┴─────────┘
+
+(use "npm run extract" to update catalogs with new messages)
+```
+
+This extracts all new messages, and gives a brief glimpse of what you have translated so far.
+Once translations are complete, they should be added to the `msgstr` portion of their respective language.
+
+To add more locales, edit the `locales` array in `lingui.config.js` and run `npm run extract` again.
+Make sure you also update `i18n.ts` with the new locale.
+
+