style: Improve source formatting (#212)

* style: Add format script

Simplify formatting all files. Provide script for future automation.

* style: Disable formatting for generated translation files

* style: Format all project files

Improve source consistency.

.buildkite/pipeline.yml

@@ -13,8 +13,8 @@ steps:
   #################
   # Build and Test
   #################
-  - label: "🔨 Build"
-    key: "build"
+  - label: '🔨 Build'
+    key: 'build'
     command: |
       echo "--- :rubygems: Setting up Gems"
       install_gems
@@ -42,7 +42,7 @@ steps:
     env: *common_env
     plugins: *common_plugins
     agents:
-      queue: "mac"
+      queue: 'mac'
     artifact_paths:
-      - "out/*.app.zip"
+      - 'out/*.app.zip'
     if: "build.branch == 'trunk'"

.github/PULL_REQUEST_TEMPLATE.md

@@ -8,7 +8,7 @@ Related to #
 
 ## Proposed Changes
 
-*
+-
 
 ## Testing Instructions
 
@@ -17,7 +17,7 @@ Add as many details as possible to help others reproduce the issue and test the
 "Before / After" screenshots can also be very helpful when the change is visual.
 -->
 
-*
+-
 
 ## Pre-merge Checklist
 

.github/workflows/run-tests.yml

@@ -8,22 +8,22 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-    - name: Checkout Repository
-      uses: actions/checkout@v2
+      - name: Checkout Repository
+        uses: actions/checkout@v2
 
-    - name: Set up Node.js
-      uses: actions/setup-node@v3
-      with:
-        node-version: 20.9.0
+      - name: Set up Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20.9.0
 
-    - name: Install Dependencies
-      run: npm ci
+      - name: Install Dependencies
+        run: npm ci
 
-    - name: Run linter
-      run: npm run lint
+      - name: Run linter
+        run: npm run lint
 
-    - name: Run Unit Tests
-      run: npm run test
+      - name: Run Unit Tests
+        run: npm run test
 
   e2e:
     strategy:
@@ -35,28 +35,28 @@ jobs:
     runs-on: ${{ matrix.os }}
 
     steps:
-    - name: Checkout Repository
-      uses: actions/checkout@v2
-
-    - name: Set up Node.js
-      uses: actions/setup-node@v3
-      with:
-        node-version: 20.9.0
-
-    - name: Install Dependencies
-      run: npm ci
-
-    - name: Build App (without installer)
-      run: npm run package
-
-    - name: Run End-to-end Tests
-      uses: coactions/setup-xvfb@v1
-      continue-on-error: true
-      with:
-        run: npm run e2e
-
-    - name: Archive Trace
-      uses: actions/upload-artifact@v2
-      with:
-        path: trace.zip
-        if-no-files-found: ignore
+      - name: Checkout Repository
+        uses: actions/checkout@v2
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20.9.0
+
+      - name: Install Dependencies
+        run: npm ci
+
+      - name: Build App (without installer)
+        run: npm run package
+
+      - name: Run End-to-end Tests
+        uses: coactions/setup-xvfb@v1
+        continue-on-error: true
+        with:
+          run: npm run e2e
+
+      - name: Archive Trace
+        uses: actions/upload-artifact@v2
+        with:
+          path: trace.zip
+          if-no-files-found: ignore

.prettierignore

@@ -1,2 +1,4 @@
+src/translations
+
 # wp-now
-vendor/wp-now
+vendor/wp-now

docs/localization.md

@@ -18,6 +18,7 @@ If you want to add support for another language you will need to add it to the
    of all translatable strings in `out/pots/bundle-strings.pot`.
 
 2. **GlotPress Import**
+
    1. Open [our project in GlotPress](https://translate.wordpress.com/projects/local-environment/).
    2. Click the **Project actions** menu.
    3. Click **Import Originals**.
@@ -27,13 +28,14 @@ If you want to add support for another language you will need to add it to the
    We will export the translations as Jed-formatted JSON, which is a format
    `@wordpress/i18n` can understand. It's ok if some translations are missing,
    they will be left as English in the app.
+
    1. Open [our project in GlotPress](https://translate.wordpress.com/projects/local-environment/).
    2. Click the **Project actions** menu.
    3. Click **Bulk Export**.
    4. Click **Select WP.Com Priority Languages** to only the magnificent 16 languages.
-   4. Select **Polish** too.
-   5. Change the format to `Jed 1.x (.json)`.
-   6. Leave the other fields as default and click **Export**.
+   5. Select **Polish** too.
+   6. Change the format to `Jed 1.x (.json)`.
+   7. Leave the other fields as default and click **Export**.
 
 4. **Add to Project**
    Unzip the exported strings and add them to the `src/translations`. Overwrite

docs/versioning-and-updates.md

@@ -40,20 +40,20 @@ Studio checks for updates on launch and every hour after that.
 
 Release builds:
 
-* Check for updates on launch and every hour after that.
-* Ignore dev builds, will only update to another release build.
+- Check for updates on launch and every hour after that.
+- Ignore dev builds, will only update to another release build.
 
 Dev builds:
 
-* Do not automatically check for updates.
-* Check for updates if you use the “Check for Updates” menu item on Mac.
-* Ignore release builds, will only update to the latest dev build.
+- Do not automatically check for updates.
+- Check for updates if you use the “Check for Updates” menu item on Mac.
+- Ignore release builds, will only update to the latest dev build.
 
 ## Releases Manifest and CDN
 
 CI uses the `generate-releases-manifest.json` script to genreate a
 `releases.json` file which acts as an authoritative source of update info for
 the update server.
 
-When CI has finished building installers it uploads installers *and* the
+When CI has finished building installers it uploads installers _and_ the
 releases manifest to the CDN for distribution.

package.json

@@ -21,6 +21,7 @@
 		"make:macos": "SKIP_DMG=true electron-forge make --arch=universal --platform=darwin",
 		"publish": "electron-forge publish",
 		"lint": "eslint --ext .ts,.tsx,.js,.jsx,.mjs .",
+		"format": "prettier . --write",
 		"test": "jest",
 		"test:watch": "jest --watch",
 		"e2e": "npx playwright install && npx playwright test",

src/index.css

@@ -15,7 +15,14 @@ body {
 	-webkit-app-region: no-drag;
 }
 
-h1, h2, h3, h4, h5, h6, caption, figcaption {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+caption,
+figcaption {
 	text-wrap: balance;
 }
 
@@ -31,16 +38,16 @@ blockquote {
 	flex: 1;
 }
 .components-tab-panel__tabs {
-	margin: 0 calc(theme('spacing.8') * -1);
-	padding: 0 theme('spacing.4');
-	border-bottom: 1px solid theme('colors.a8c-gray.5');
+	margin: 0 calc( theme( 'spacing.8' ) * -1 );
+	padding: 0 theme( 'spacing.4' );
+	border-bottom: 1px solid theme( 'colors.a8c-gray.5' );
 }
 .components-tab-panel__tabs-item {
 	height: 40px;
 	margin-bottom: -1px;
 }
 .components-tab-panel__tabs-item.is-active::after {
-	background: theme('colors.black');
+	background: theme( 'colors.black' );
 }
 
 /* default cursor by default */
@@ -54,23 +61,23 @@ button:enabled.cursor-pointer {
 
 /* Customize scrollbar area for the sites sidebar */
 .sites-scrollbar::-webkit-scrollbar {
-    background: transparent;
+	background: transparent;
 	width: 10px;
 }
 
 /* Customize srollbar thumb appearance for the sites sidebar */
 .sites-scrollbar::-webkit-scrollbar-thumb {
-    background: #ffffff26;
-    border-radius: 10px; 
-	border: 2px solid rgba(30, 30, 30, 1);
+	background: #ffffff26;
+	border-radius: 10px;
+	border: 2px solid rgba( 30, 30, 30, 1 );
 }
 
 /* Add hover effect to thumb appearance on the scrollbar */
 .sites-scrollbar::-webkit-scrollbar-thumb:hover {
-	background:rgba(255, 255, 255, .5);
+	background: rgba( 255, 255, 255, 0.5 );
 }
 
 /* Avoid selecting text on dropdown menu, like preview links */
 .components-popover {
 	user-select: none;
-}
+}