Run Prettier across projects

Problem:
Prettier was not running when I saved Emacs buffers.

Why?
- prettier-js-mode needs needs node; lorri exposes node to direnv; direnv
  exposes node to Emacs; lorri was not working as expected.

Solution:
Now that I'm using nix-buffer, I can properly expose node (and other
dependencies) to my Emacs buffers. Now Prettier is working.

Commentary:
Since prettier hadn't worked for so long, I stopped thinking about it. As such,
I did not include it as a dependency in boilerplate/typescript. I added it
now. I retroactively ran prettier across a few of my frontend projects to unify
the code styling.

I may need to run...
```shell
$ cd ~/briefcase
$ nix-shell
$ npx prettier --list-different "**/*.{js,ts,jsx,tsx,html,css,json}"
```
...to see which files I should have formatted.

7 files changed, 24 insertions, 27 deletions

diff --git a/website/sandbox/contentful/postcss.config.js b/website/sandbox/contentful/postcss.config.js
index d68fa618664e..a23795075b11 100644
--- a/website/sandbox/contentful/postcss.config.js
+++ b/website/sandbox/contentful/postcss.config.js
@@ -1,7 +1,5 @@
-const tailwindcss = require('tailwindcss')
+const tailwindcss = require("tailwindcss");
 
 module.exports = {
-  plugins: [
-    tailwindcss('./tailwind.config.js')
-  ]
-}
+  plugins: [tailwindcss("./tailwind.config.js")],
+};
diff --git a/website/sandbox/contentful/src/App.tsx b/website/sandbox/contentful/src/App.tsx
index 6342bfc98dd6..288f03321804 100644
--- a/website/sandbox/contentful/src/App.tsx
+++ b/website/sandbox/contentful/src/App.tsx
@@ -8,7 +8,7 @@ import type { Book } from "./store";
 
 const App: React.FC = () => {
   const dispatch = useDispatch();
-  const { isLoading, books } = useTypedSelector(state => ({
+  const { isLoading, books } = useTypedSelector((state) => ({
     isLoading: state.isLoading,
     books: state.books,
   }));
@@ -16,7 +16,7 @@ const App: React.FC = () => {
   useEffect(() => {
     async function fetchData() {
       const entries = await getClient().getEntries();
-      const books = entries.items.map(x => x.fields) as Book[];
+      const books = entries.items.map((x) => x.fields) as Book[];
 
       dispatch(actions.setBooks(books));
     }
@@ -30,9 +30,12 @@ const App: React.FC = () => {
           <div className="container mx-auto">
             <h1 className="py-6 text-2xl">Books</h1>
             <ul>
-              {books.map(book => (
+              {books.map((book) => (
                 <li key={book.title} className="py-3">
-                  <p><span className="font-bold pr-3">{book.title}</span><span className="text-gray-600">{book.author}</span></p>
+                  <p>
+                    <span className="font-bold pr-3">{book.title}</span>
+                    <span className="text-gray-600">{book.author}</span>
+                  </p>
                 </li>
               ))}
             </ul>
diff --git a/website/sandbox/contentful/src/contentful.ts b/website/sandbox/contentful/src/contentful.ts
index e09cd8fc4ad3..02ebc92b68df 100644
--- a/website/sandbox/contentful/src/contentful.ts
+++ b/website/sandbox/contentful/src/contentful.ts
@@ -8,10 +8,10 @@ let client: ContentfulClientApi;
 
 // Idempotent way to get a reference to the Contentful client.
 export const getClient = (): ContentfulClientApi => {
-  if (typeof client !== 'undefined') {
+  if (typeof client !== "undefined") {
     return client;
   } else {
-    if (typeof space === 'string' && typeof accessToken === 'string') {
+    if (typeof space === "string" && typeof accessToken === "string") {
       let client = createClient({
         space,
         accessToken,
@@ -19,7 +19,9 @@ export const getClient = (): ContentfulClientApi => {
 
       return client;
     } else {
-      throw new Error('Please set CONTENTFUL_SPACE_ID and CONTENTFUL_ACCESS_TOKEN');
+      throw new Error(
+        "Please set CONTENTFUL_SPACE_ID and CONTENTFUL_ACCESS_TOKEN"
+      );
     }
   }
-}
+};
diff --git a/website/sandbox/contentful/src/index.html b/website/sandbox/contentful/src/index.html
index 05dd7ad95e79..91752af916a4 100644
--- a/website/sandbox/contentful/src/index.html
+++ b/website/sandbox/contentful/src/index.html
@@ -1,8 +1,8 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="UTF-8">
-    <link rel="stylesheet" href="./index.css">
+    <meta charset="UTF-8" />
+    <link rel="stylesheet" href="./index.css" />
   </head>
   <body>
     <div id="mount"></div>
diff --git a/website/sandbox/contentful/src/store.ts b/website/sandbox/contentful/src/store.ts
index c4396d681a17..b02053d302b6 100644
--- a/website/sandbox/contentful/src/store.ts
+++ b/website/sandbox/contentful/src/store.ts
@@ -22,9 +22,9 @@ export const { actions, reducer } = createSlice({
   name: "application",
   initialState,
   reducers: {
-    toggleIsLoading: state => ({ ...state, isLoading: !state.isLoading }),
-    setBooks: (state, action) => ({ ... state, books: action.payload }),
-  }
+    toggleIsLoading: (state) => ({ ...state, isLoading: !state.isLoading }),
+    setBooks: (state, action) => ({ ...state, books: action.payload }),
+  },
 });
 
 /**
diff --git a/website/sandbox/contentful/tailwind.config.js b/website/sandbox/contentful/tailwind.config.js
index af829e20f9cb..3da6fa0dc7b7 100644
--- a/website/sandbox/contentful/tailwind.config.js
+++ b/website/sandbox/contentful/tailwind.config.js
@@ -4,4 +4,4 @@ module.exports = {
   },
   variants: {},
   plugins: [],
-}
+};
diff --git a/website/sandbox/contentful/tsconfig.json b/website/sandbox/contentful/tsconfig.json
index 013f34fdf0b1..fe07ec1da4d4 100644
--- a/website/sandbox/contentful/tsconfig.json
+++ b/website/sandbox/contentful/tsconfig.json
@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
@@ -19,7 +15,5 @@
     "noEmit": true,
     "jsx": "react"
   },
-  "include": [
-    "src/**/*"
-  ]
+  "include": ["src/**/*"]
 }