diff --git a/.grit/patterns/enzyme_rtl.md b/.grit/patterns/enzyme_rtl.md
index cccc4ebf..6864a356 100644
--- a/.grit/patterns/enzyme_rtl.md
+++ b/.grit/patterns/enzyme_rtl.md
@@ -122,7 +122,8 @@ describe('Modal', () => {
 ```
 
 ```js
-import { render, screen } from '@testing-library/react';
+
+import { render, screen } from "@testing-library/react";
 
 import TestModel from './modal';
 
diff --git a/.grit/patterns/es6_exports.md b/.grit/patterns/es6_exports.md
index 5bff0d77..9168f094 100644
--- a/.grit/patterns/es6_exports.md
+++ b/.grit/patterns/es6_exports.md
@@ -58,6 +58,7 @@ module.exports.king = '9';
 
 ```js
 export const king = '9';
+
 ```
 
 ## Transform default exports
@@ -81,6 +82,8 @@ export async function createTeam() {
 }
 
 export const addTeamToOrgSubscription = () => console.log('cool');
+
+
 ```
 
 ### Keep inline values intact
diff --git a/.grit/patterns/es6_imports.md b/.grit/patterns/es6_imports.md
index 2e9be446..8d7c52e8 100644
--- a/.grit/patterns/es6_imports.md
+++ b/.grit/patterns/es6_imports.md
@@ -48,13 +48,13 @@ const starImport = require('star');
 ```
 
 ```ts
-import defaultImport from '../../shared/default';
-import { something, another } from './lib';
-import { value, original as renamed } from 'something';
-import { ogName as otherName } from 'chai';
-import { assert } from 'chai';
-import { config as conf } from 'chai';
-import starImport from 'star';
+import defaultImport from '../../shared/default'
+import { something, another } from './lib'
+import { value, original as renamed } from 'something'
+import { ogName as otherName } from 'chai'
+import { assert } from 'chai'
+import { config as conf } from 'chai'
+import starImport from 'star'
 ```
 
 ### Handle dotenv
diff --git a/.grit/patterns/es6_imports_to_require.md b/.grit/patterns/es6_imports_to_require.md
index 21ffa235..3129baac 100644
--- a/.grit/patterns/es6_imports_to_require.md
+++ b/.grit/patterns/es6_imports_to_require.md
@@ -45,12 +45,12 @@ import defaultImport from '../../shared/default';
 ```
 
 ```ts
-const { something, another } = require('./lib');
-const { assert } = require('chai');
-const { config: conf } = require('chai');
-const { mixed: mixie, foo } = require('life');
-const starImport = require('star');
+const { something, another } = require("./lib")
+const { assert } = require("chai")
+const { config: conf } = require("chai")
+const { mixed: mixie, foo } = require("life")
+const starImport = require("star")
 
 // no special handling for default. Also, comments get removed.
-const defaultImport = require('../../shared/default');
+const defaultImport = require("../../shared/default")
 ```
diff --git a/.grit/patterns/importing.md b/.grit/patterns/importing.md
index 6c338faf..d3a13b03 100644
--- a/.grit/patterns/importing.md
+++ b/.grit/patterns/importing.md
@@ -53,12 +53,15 @@ fetch();
 
 ```js
 import { keep } from 'keepable';
-import { orderBy } from 'lodash';
-import { v4 } from 'uuid';
+import { orderBy } from "lodash";
+ import { v4 } from "uuid";
+
+
 
 import fetch from 'elsewhere';
 
-import { more } from 'node-fetch';
+import {  more } from 'node-fetch';
+
 
 console.log(orderBy([1, 2, 3]));
 
@@ -87,12 +90,15 @@ fetch();
 
 ```js
 #!/usr/bin/env node
-import { orderBy } from 'lodash';
-import { v4 } from 'uuid';
+import { orderBy } from "lodash";
+ import { v4 } from "uuid";
+
+
 
 import fetch from 'elsewhere';
 
-import { more } from 'node-fetch';
+import {  more } from 'node-fetch';
+
 
 console.log(orderBy([1, 2, 3]));
 
@@ -115,7 +121,8 @@ class Button extends Component {
 
 ```typescript
 import _ from 'lodash';
-import { Component } from 'React';
+import { Component } from "React";
+
 
 class Button extends Component {
   // ...
@@ -141,7 +148,7 @@ class Button extends Component {
 ```
 
 ```typescript
-import { Component } from 'React';
+import { Component } from "React";
 
 console.log('this is a test');
 
diff --git a/.grit/patterns/index_of_to_includes.md b/.grit/patterns/index_of_to_includes.md
index 51c37a28..8049bc83 100644
--- a/.grit/patterns/index_of_to_includes.md
+++ b/.grit/patterns/index_of_to_includes.md
@@ -52,15 +52,15 @@ foo.indexOf("a") != -1;
 ```typescript
 !foo.includes("a");
 
-!foo.includes("a")
+!foo.includes("a");
 
-!foo.includes("a")
+!foo.includes("a");
 
-foo.includes("a")
+foo.includes("a");
 
-foo.includes("a")
+foo.includes("a");
 
-foo.includes("a")
+foo.includes("a");
 ```
 
 ## Transforms lastIndexOf
@@ -82,15 +82,15 @@ foo.lastIndexOf("a") != -1;
 ```typescript
 !foo.includes("a");
 
-!foo.includes("a")
+!foo.includes("a");
 
-!foo.includes("a")
+!foo.includes("a");
 
-foo.includes("a")
+foo.includes("a");
 
-foo.includes("a")
+foo.includes("a");
 
-foo.includes("a")
+foo.includes("a");
 ```
 
 ## Does not change lastIndexOf or indexOf if it checks for a real index
diff --git a/.grit/patterns/jest_array_containing.md b/.grit/patterns/jest_array_containing.md
index dd40209c..7427f3ed 100644
--- a/.grit/patterns/jest_array_containing.md
+++ b/.grit/patterns/jest_array_containing.md
@@ -55,16 +55,12 @@ describe('test', () => {
   it('consolidates', async () => {
     const values = ['console.log($9o)', 'console.log($x)', 'PatternWithArgs($arg)'];
     const anotherValues = ['nine'];
-
+    
     expect(anotherValues).toEqual(expect.arrayContaining([expect.stringContaining('nine')]));
     
-    expect(values).toEqual(
-      expect.arrayContaining([
-        expect.stringContaining('console.log($9o)'),
+    expect(values).toEqual(expect.arrayContaining([expect.stringContaining('console.log($9o)'),
         expect.stringContaining('console.log($x)'),
-        expect.stringContaining('PatternWithArgs($arg)'),
-      ]),
-    );
+        expect.stringContaining('PatternWithArgs($arg)')]));
   });
 });
 ```
diff --git a/.grit/patterns/jest_to_vitest.md b/.grit/patterns/jest_to_vitest.md
index f950d58c..5ddab3a5 100644
--- a/.grit/patterns/jest_to_vitest.md
+++ b/.grit/patterns/jest_to_vitest.md
@@ -197,11 +197,13 @@ afterEach(function () {
 ```
 
 ```javascript
+
+
 import { vi, test, expect, it, beforeAll, beforeEach, afterAll, afterEach } from 'vitest';
 
 vi.mock('./some-path', () => ({
-  default: 'hello',
-}));
+              default: 'hello'
+            }));
 vi.mock('./some-path', function () {
   doSomeSetups();
   return { default: 'hello' };
@@ -227,36 +229,30 @@ const currentWorkerId = VITEST_POOL_ID;
 test.skip('test.skip should be processed', () => {
   expect('value').toBe('value');
 });
-it('should complete asynchronously', () =>
-  new Promise((done) => {
-    expect('value').toBe('value');
-    done();
-  }));
-it('should complete asynchronously', () =>
-  new Promise((finish) => {
-    expect('value').toBe('value');
-    finish();
-  }));
-it('should complete asynchronously', () =>
-  new Promise((done) => {
-    expect('value').toBe('value');
-    done();
-  }));
-it('should complete asynchronously', () =>
-  new Promise(function (done) {
-    expect('value').toBe('value');
-    done();
-  }));
-it('should complete asynchronously', () =>
-  new Promise(function (finish) {
-    expect('value').toBe('value');
-    finish();
-  }));
-test.skip('test.skip with done should be processed', () =>
-  new Promise((done) => {
-    expect('value').toBe('value');
-    done();
-  }));
+it('should complete asynchronously', () => new Promise((done) => {
+  expect('value').toBe('value');
+  done();
+}));
+it('should complete asynchronously', () => new Promise((finish) => {
+  expect('value').toBe('value');
+  finish();
+}));
+it('should complete asynchronously', () => new Promise((done) => {
+  expect('value').toBe('value');
+  done();
+}));
+it('should complete asynchronously', () => new Promise(function (done) {
+  expect('value').toBe('value');
+  done();
+}));
+it('should complete asynchronously', () => new Promise(function (finish) {
+  expect('value').toBe('value');
+  finish();
+}));
+test.skip('test.skip with done should be processed', () => new Promise((done) => {
+  expect('value').toBe('value');
+  done();
+}));
 it('should be ignored', () => {
   expect('value').toBe('value');
 });
@@ -264,18 +260,10 @@ it('should be ignored', function () {
   expect('value').toBe('value');
 });
 
-beforeAll(() => {
-  setActivePinia(createTestingPinia());
-});
-beforeEach(() => {
-  setActivePinia(createTestingPinia());
-});
-afterAll(() => {
-  setActivePinia(createTestingPinia());
-});
-afterEach(() => {
-  setActivePinia(createTestingPinia());
-});
+beforeAll(() => { setActivePinia(createTestingPinia()) });
+beforeEach(() => { setActivePinia(createTestingPinia()) });
+afterAll(() => { setActivePinia(createTestingPinia()) });
+afterEach(() => { setActivePinia(createTestingPinia()) });
 beforeAll(async () => {
   await expect('1').toBe('1');
   await expect('2').toBe('2');
diff --git a/.grit/patterns/knockout_to_react.md b/.grit/patterns/knockout_to_react.md
index 135caed9..72cd910a 100644
--- a/.grit/patterns/knockout_to_react.md
+++ b/.grit/patterns/knockout_to_react.md
@@ -44,7 +44,7 @@ var ViewModel = function (first, last) {
 ```
 
 ```typescript
-import { useState } from 'react';
+import { useState } from "react";
 
 var ViewComponent = function (props) {
   const [firstName, setFirstName] = useState(props.firstName);
diff --git a/.grit/patterns/moment_to_datefns.md b/.grit/patterns/moment_to_datefns.md
index 92734a56..f76a4c7f 100644
--- a/.grit/patterns/moment_to_datefns.md
+++ b/.grit/patterns/moment_to_datefns.md
@@ -30,7 +30,7 @@ const date = moment();
 ```
 
 ```typescript
-let date = new Date();
+let date = new Date()
 ```
 
 ## Arithmetic operations where specifier is a literal
@@ -49,14 +49,14 @@ foo(now.subtract(12, "month"))
 ```ts
 import durationfns from "duration-fns";
 import { add } from "date-fns/add";
-import { sub } from "date-fns/sub";
+ import { sub } from "date-fns/sub";
 
 let now = new Date()
 let then = new Date("2001-01-01")
 
 now = addDate(now, { days: 10 })
 then = subDate(then, { years: 12 })
-now = subDate(now, { milliseconds: 10 }) 
+now = subDate(now, { milliseconds: 10 })
 
 foo((now = subDate(now, { months: 12 })))
 
@@ -90,14 +90,14 @@ now.subtract(then.days(), unit)
 import durationfns from "duration-fns";
 import datefns from "date-fns";
 import { add } from "date-fns/add";
-import { sub } from "date-fns/sub";
+ import { sub } from "date-fns/sub";
 
-let now = (new Date())
-let then = (new Date("2001-01-02"))
+let now = new Date()
+let then = new Date("2001-01-02")
 const unit = Math.random() > 0.5 ? "d" : "y"
 
 now = addDate(now, { [normalizeMomentJSUnit(unit) + 's']: 10 })
-now = subDate(now, { [normalizeMomentJSUnit(unit) + 's']: (then instanceof Date) ? datefns.getDay(then) : (then.days ?? 0) })
+now = subDate(now, { [normalizeMomentJSUnit(unit) + 's']: ((then instanceof Date) ? datefns.getDay(then) : (then.days ?? 0)) })
 
 function normalizeMomentJSUnit(fmt) {
   const unitRegexs = [
@@ -109,7 +109,7 @@ function normalizeMomentJSUnit(fmt) {
     [/\b(?:h|hours?)\b/, 'hour'],
     [/\b(?:m|minutes?)\b/, 'minute'],
     [/\b(?:s|seconds?)\b/, 'second'],
-    [/\b(?:ms|millisecond?)\b/, 'millisecond']
+    [/\b(?:ms|millisecond?)\b/, 'millisecond'],
   ];
 
 
@@ -151,10 +151,11 @@ console.log(moment().startOf('s'))
 import datefns from "date-fns";
 date = datefns.setWeek(date, datefns.startOfWeek(date))
 date = datefns.setWeek(date, datefns.startOfWeek(date))
-date = datefns.setSeconds(date, datefns.endOfSecond(date));
+date = datefns.setSeconds(date, datefns.endOfSecond(date))
+;
 /* TODO: date-fns objects are immutable, propagate this value appropriately */
-((date) => datefns.setYear(date, datefns.endOfYear(date)))(new Date());
-console.log(((date) => datefns.setSeconds(date, datefns.startOfSecond(date)))(new Date()))
+((date => datefns.setYear(date, datefns.endOfYear(date)))((new Date())));
+console.log(((date => datefns.setSeconds(date, datefns.startOfSecond(date)))(new Date())))
 ```
 
 ## Constructing and serializing durations (JSON)
@@ -191,25 +192,25 @@ date.toArray()
 ```ts
 import durationfns from "duration-fns";
 let date = new Date()
-dateOrDuration2Array(date);
+dateOrDuration2Array(date)
 
 function dateOrDuration2Array(d) {
-  if (d instanceof Date) {
-    return [
-      d.getFullYear(),
-      d.getMonth(),
-      d.getDate(),
-      d.getHours(),
-      d.getMinutes(),
-      d.getSeconds(),
-      d.getMilliseconds(),
-    ];
-  } else if (durationfns.UNITS.some((u) => Object.hasOwnProperty.call(d, u))) {
-    return durationfns.UNITS.map((u) => d[u] ?? 0);
-  }
+      if (d instanceof Date) {
+        return [
+          d.getFullYear(),
+          d.getMonth(), 
+          d.getDate(),
+          d.getHours(),
+          d.getMinutes(),
+          d.getSeconds(),
+          d.getMilliseconds()
+        ]
+      } else if (durationfns.UNITS.some(u => Object.hasOwnProperty.call(d, u))) {
+        return durationfns.UNITS.map(u => d[u] ?? 0)
+      }
 
-  return d.toArray();
-}
+      return d.toArray()
+    }
 ```
 
 ## `toJSON` and `toArray` calls on non-moment objects
@@ -232,28 +233,25 @@ y.toArray()
 import durationfns from "duration-fns";
 import datefns from "date-fns";
 // moment-js objects
-let date = new Date(),
-  duration = { days: 1 };
+let date = new Date(), duration = ({ days: 1 })
 
 // non-moment objects
 const x = f(), y = g()
 
-dateOrDuration2JSON(date);
-dateOrDuration2JSON(duration);
-/* if "x" is a moment-js object, replace with date.toJSON() call */ x.toJSON();
-/* if "y" is a moment-js object, replace with date.toJSON() call */ y.toJSON();
-/* if "y" is a moment-js object, convert it to an array */ y.toArray();
+dateOrDuration2JSON(date)
+dateOrDuration2JSON(duration)
+/* if "x" is a moment-js object, replace with date.toJSON() call */ x.toJSON()
+/* if "y" is a moment-js object, replace with date.toJSON() call */ y.toJSON()
+/* if "y" is a moment-js object, convert it to an array */ y.toArray()
 
 function dateOrDuration2JSON(d) {
   if (d instanceof Date) {
     return datefns.formatISO(d);
-  } else if (
-    durationfns.UNITS.some((unit) => Object.hasOwnProperty.call(d, unit))
-  ) {
-    return durationfns.toJSON(d);
+  } else if (durationfns.UNITS.some((unit) => Object.hasOwnProperty.call(d, unit))) {
+    return durationfns.toJSON(d)
   }
 
-  return d.toJSON();
+  return d.toJSON()
 }
 ```
 
@@ -278,20 +276,23 @@ f().days(a.days())
 ```ts
 import datefns from "date-fns";
 let a = new Date()
-let b = new Date();
-(a instanceof Date ? (a = a.setSeconds(30)) : (a.seconds = 30)).valueOf() === new Date().setSeconds(30);
+let b = new Date()
+;
+((a instanceof Date) ? (a = a.setSeconds(30)) : (a.seconds = 30)).valueOf() === new Date().setSeconds(30);
 
-(b instanceof Date ? datefns.getSeconds(b) : (b.seconds ?? 0)) === new Date().getSeconds()
+
+((b instanceof Date) ? datefns.getSeconds(b) : (b.seconds ?? 0)) === new Date().getSeconds();
 
 /*TODO: date-fns objects are immutable, feed this value back through properly*/
-datefns.setMonth(new Date(), 10)
+datefns.setMonth((new Date()), 10)
 
 function f() {
   return new Date()
 }
 
-((d, val) => (d instanceof Date ? d.setDay(val) : (d.days = val)))
-  (f(), (a instanceof Date ? datefns.getDay(a) : (a.days ?? 0)))
+
+
+(((d, val) => (d instanceof Date) ? d.setDay(val) : (d.days = val))(f(), ((a instanceof Date) ? datefns.getDay(a) : (a.days ?? 0))))
 ```
 
 ## Get/Set when specifier is a literal
@@ -305,10 +306,13 @@ d.get('ms')
 
 ```ts
 import datefns from "date-fns";
-let d = new Date();
-d instanceof Date ? datefns.getYear(d) : d.years ?? 0;
-d = datefns.setMonth(d, d instanceof Date ? datefns.getYear(d) : d.years ?? 0);
-d instanceof Date ? datefns.getMilliseconds(d) : d.milliseconds ?? 0;
+let d = new Date()
+;
+((d instanceof Date) ? datefns.getYear(d) : (d.years ?? 0))
+;
+(d = datefns.setMonth(d, ((d instanceof Date) ? datefns.getYear(d) : (d.years ?? 0))))
+;
+((d instanceof Date) ? datefns.getMilliseconds(d) : (d.milliseconds ?? 0))
 ```
 
 ## Get/Set when specifier is a non-literal
@@ -322,7 +326,8 @@ moment.normalizeUnits("m")
 ```
 
 ```ts
-import datefns from "date-fns";let date = new Date() 
+import datefns from "date-fns";
+let date = new Date()
 const unit = Math.random() > 0.5 ? "year" : "month"
 getUnitFromDate(date, unit)
 setUnitOnDate(date, unit, 10)
@@ -338,7 +343,7 @@ function normalizeMomentJSUnit(fmt) {
     [/\b(?:h|hours?)\b/, 'hour'],
     [/\b(?:m|minutes?)\b/, 'minute'],
     [/\b(?:s|seconds?)\b/, 'second'],
-    [/\b(?:ms|millisecond?)\b/, 'millisecond']
+    [/\b(?:ms|millisecond?)\b/, 'millisecond'],
   ];
 
 
@@ -451,27 +456,27 @@ let date = new Date()
 console.log(dateOrDuration2JSON(date))
 console.log(((date instanceof Date) ? new Date(date.getTime()) : structuredClone(date)))
 
-let duration = { days: 10 };
+let duration = ({ days: 10 })
 const humanized = datefns.formatDuration(duration)
-console.log(datefns.isValid(date));
-((d => (d instanceof Date ? {
-  years: d.getFullYear(),
-  months: d.getMonth(),
-  date: d.getDate(),
-  hours: d.getHours(),
-  minutes: d.getMinutes(),
-  seconds: d.getSeconds(),
-  milliseconds: d.getMilliseconds(),
-} : d.toObject()))(date))
+console.log(datefns.isValid(date))
+;
+((d => ((d instanceof Date) ? {
+        years: d.getFullYear(),
+        months: d.getMonth(), 
+        date: d.getDate(),
+        hours: d.getHours(),
+        minutes: d.getMinutes(),
+        seconds: d.getSeconds(),
+        milliseconds: d.getMilliseconds()} : d.toObject()))(date))
 
 function dateOrDuration2JSON(d) {
   if (d instanceof Date) {
-    return datefns.formatISO(d)
+    return datefns.formatISO(d);
   } else if (durationfns.UNITS.some((unit) => Object.hasOwnProperty.call(d, unit))) {
     return durationfns.toJSON(d)
   }
 
-  return d.toJSON();
+  return d.toJSON()
 }
 ```
 
@@ -486,7 +491,7 @@ date.utc()
 
 ```ts
 let date = new Date()
-/* (Moment#utc) is not supported in date-fns. Prefer using local state when displaying dates */ date;
+/* (Moment#utc) is not supported in date-fns. Prefer using local state when displaying dates */ date
 ```
 
 ## Queries
@@ -511,8 +516,10 @@ let now = new Date()
 console.log(datefns.isBefore(then, now))
 console.log(datefns.isAfter(then, now))
 console.log((datefns.isEqual(then, now) || datefns.isAfter(then, now)))
-console.log((datefns.isEqual(then, now) || datefns.isBefore(then, now)));
-(((a, b) => datefns.isEqual(a, b) || datefns.isBefore(a, b))(new Date(), new Date()))
+console.log((datefns.isEqual(then, now) || datefns.isBefore(then, now)))
+
+;
+(((a, b) => datefns.isEqual(a, b) || datefns.isBefore(a, b))((new Date()), new Date()))
 ```
 
 ## toArray works even when called on non-date objects
@@ -528,11 +535,11 @@ o.toArray()
 ```
 
 ```ts
-const o =  { 
+const o =  {
   toArray() { 
     return [1, 2, 3]
   }
-};
+}
 
 /* if "o" is a moment-js object, convert it to an array */ o.toArray()
 ```
@@ -558,6 +565,5 @@ moment().format(fmt)
 
 ```ts
 const fmt = "[Today is] YYYY-MM-DD A"
-/* TODO: format specifiers aren't compatible between moment.js and date-fns. Re-write this.*/moment(
-  new Date()).format(new Date(), fmt);
+/* TODO: format specifiers aren't compatible between moment.js and date-fns. Re-write this.*/ moment((new Date())).format((new Date()), fmt)
 ```
diff --git a/.grit/patterns/mux_v8.md b/.grit/patterns/mux_v8.md
index d6fa25b1..cb8ffd13 100644
--- a/.grit/patterns/mux_v8.md
+++ b/.grit/patterns/mux_v8.md
@@ -163,33 +163,33 @@ const Mux = require('@mux/mux-node');
 const mux = new Mux({
   baseURL: 'test.com',
   fetch: (url, opts) => {
-    let opts = opts ?? { headers: {} };
+                    let opts = opts ?? { headers: {} };
 
-    opts.headers['x-source-platform'] = 'Test | 0.0.1';
+                    opts.headers['x-source-platform'] = 'Test | 0.0.1';
 
-    return fetch(url, opts);
-  },
+                    return fetch(url, opts)
+                },
 });
 
 const mux = new Mux({
-  tokenId: accessToken,
-  tokenSecret: secret,
-});
+                tokenId: accessToken,
+                tokenSecret: secret,
+            });
 
 const mux = new Mux();
 
 const mux = new Mux({
-  tokenId: accessToken,
-  tokenSecret: secret,
-  baseURL: 'test.com',
+                        tokenId: accessToken,
+                        tokenSecret: secret,
+                        baseURL: 'test.com',
   fetch: (url, opts) => {
-    let opts = opts ?? { headers: {} };
+                    let opts = opts ?? { headers: {} };
 
-    opts.headers['x-source-platform'] = 'Test | 0.0.1';
+                    opts.headers['x-source-platform'] = 'Test | 0.0.1';
 
-    return fetch(url, opts);
-  },
-});
+                    return fetch(url, opts)
+                },
+                    });
 ```
 
 ## Replace destructured properties with field access
@@ -265,12 +265,8 @@ Mux.Webhooks.verifyHeader(rawBody, req.headers['mux-signature'] as string, webho
 ```
 
 ```ts
-const mux = new Mux();
-mux.webhooks.verifyHeader(
-  Buffer.isBuffer(rawBody) ? rawBody.toString('utf8') : rawBody,
-  req.headers,
-  webhookSignatureSecret,
-);
+const mux = new Mux()
+mux.webhooks.verifyHeader(Buffer.isBuffer(rawBody) ? rawBody.toString('utf8') : rawBody, req.headers, webhookSignatureSecret);
 ```
 
 ## Verify webhooks with existing Mux instance
@@ -300,11 +296,7 @@ const mux = new Mux({
 
 export const verifyWebhookSignature = (rawBody: string | Buffer, req: NextApiRequest) => {
   if (webhookSignatureSecret) {
-    mux.webhooks.verifyHeader(
-      Buffer.isBuffer(rawBody) ? rawBody.toString('utf8') : rawBody,
-      req.headers,
-      webhookSignatureSecret,
-    );
+    mux.webhooks.verifyHeader(Buffer.isBuffer(rawBody) ? rawBody.toString('utf8') : rawBody, req.headers, webhookSignatureSecret);
   }
 };
 ```
diff --git a/.grit/patterns/next13_links.md b/.grit/patterns/next13_links.md
index 28fdca63..dc422c33 100644
--- a/.grit/patterns/next13_links.md
+++ b/.grit/patterns/next13_links.md
@@ -24,5 +24,7 @@ language js
 ```
 
 ```typescript
-<Link href='https://leerob.io'>https://leerob.io</Link>
+<Link href='https://leerob.io'>
+  https://leerob.io
+</Link>
 ```
diff --git a/.grit/patterns/no_anonymous_default_export.md b/.grit/patterns/no_anonymous_default_export.md
index e8d187e4..15586dff 100644
--- a/.grit/patterns/no_anonymous_default_export.md
+++ b/.grit/patterns/no_anonymous_default_export.md
@@ -28,9 +28,7 @@ export default function () {
 ```
 
 ```typescript
-export default function main() {
-  console.log('test');
-}
+export default function main() { console.log('test'); }
 ```
 
 ## Name asynchronous function declaration main
@@ -42,9 +40,7 @@ export default async function (test) {
 ```
 
 ```typescript
-export default async function main(test) {
-  console.log(test);
-}
+export default async function main(test) { console.log(test); }
 ```
 
 ## Name arrow function main
@@ -59,5 +55,5 @@ export default async (test) => {
 const main = async (test) => {
   console.log('test');
 };
-export default main;
+export default main
 ```
diff --git a/.grit/patterns/no_array_constructor.md b/.grit/patterns/no_array_constructor.md
index 1b9b4b7b..892f5b88 100644
--- a/.grit/patterns/no_array_constructor.md
+++ b/.grit/patterns/no_array_constructor.md
@@ -31,7 +31,7 @@ Array(0, 1, 2);
 ```
 
 ```typescript
-[0, 1, 2]
+[0, 1, 2];
 ```
 
 ## Transform Array constructor using `new` to Array object.
@@ -41,7 +41,7 @@ new Array(0, 1, 2);
 ```
 
 ```typescript
-[0, 1, 2]
+[0, 1, 2];
 ```
 
 ## Don't transform Array constructor.
diff --git a/.grit/patterns/no_console_log.md b/.grit/patterns/no_console_log.md
index c755a66d..b804295c 100644
--- a/.grit/patterns/no_console_log.md
+++ b/.grit/patterns/no_console_log.md
@@ -29,6 +29,7 @@ console.log('foo');
 ```javascript
 // Do not remove this
 console.error('foo');
+
 ```
 
 ## Removes the statement in a function
@@ -40,7 +41,9 @@ function f() {
 ```
 
 ```typescript
-function f() {}
+function f() {
+  
+}
 ```
 
 ## Works in a list as well
@@ -50,7 +53,7 @@ server.listen(PORT, console.log(`Server started on port ${PORT}`));
 ```
 
 ```typescript
-server.listen(PORT);
+server.listen(PORT );
 ```
 
 ## Doesn't remove `console.log` in a catch clause
@@ -74,4 +77,6 @@ console.log('bar');
 ```javascript
 // Do not remove this
 console.error('foo');
+
+
 ```
diff --git a/.grit/patterns/no_dead_code.md b/.grit/patterns/no_dead_code.md
index 777e43c5..55c23109 100644
--- a/.grit/patterns/no_dead_code.md
+++ b/.grit/patterns/no_dead_code.md
@@ -37,6 +37,7 @@ function f() {
 ```typescript
 function f() {
   return 3;
+  
 }
 ```
 
@@ -54,6 +55,7 @@ function f() {
 function f() {
   foo();
   return 3;
+  
 }
 ```
 
diff --git a/.grit/patterns/no_debugger.md b/.grit/patterns/no_debugger.md
index 54624b0a..490a43d2 100644
--- a/.grit/patterns/no_debugger.md
+++ b/.grit/patterns/no_debugger.md
@@ -28,6 +28,7 @@ function isTruthy(x) {
 
 ```typescript
 function isTruthy(x) {
+  
   return Boolean(x);
 }
 ```
diff --git a/.grit/patterns/no_throw_literal.md b/.grit/patterns/no_throw_literal.md
index f20c2b6e..235cb58f 100644
--- a/.grit/patterns/no_throw_literal.md
+++ b/.grit/patterns/no_throw_literal.md
@@ -23,7 +23,7 @@ throw "error";
 ```
 
 ```
-throw new Error("error");
+throw new Error("error")
 ```
 
 ## String concatenation ⇒ `new Error('...')`
@@ -33,7 +33,7 @@ throw "next " + "error";
 ```
 
 ```
-throw new Error("next " + "error");
+throw new Error("next " + "error")
 ```
 
 ## String variable ⇒ `new Error('...')`
@@ -54,7 +54,7 @@ throw 0;
 ```
 
 ```typescript
-throw new Error(0);
+throw new Error(0)
 ```
 
 ## `undefined` ⇒ `new Error(undefined)`
@@ -64,7 +64,7 @@ throw undefined;
 ```
 
 ```typescript
-throw new Error(undefined);
+throw new Error(undefined)
 ```
 
 ## `null` ⇒ `new Error(null)`
@@ -74,7 +74,7 @@ throw null;
 ```
 
 ```typescript
-throw new Error(null);
+throw new Error(null)
 ```
 
 ## Do not change `Error` object without arguments
diff --git a/.grit/patterns/openai_v4.md b/.grit/patterns/openai_v4.md
index 99e8e5b0..9dec26da 100644
--- a/.grit/patterns/openai_v4.md
+++ b/.grit/patterns/openai_v4.md
@@ -297,6 +297,7 @@ const openai = new OpenAIApi(myConfig);
 ```ts
 import OpenAI from 'openai';
 
+
 const openai = new OpenAI({
   apiKey: process.env.OPENAI_API_KEY,
 });
@@ -318,6 +319,7 @@ const openai = new OpenAIApi(myConfig);
 ```ts
 const OpenAI = require('openai');
 
+
 const openai = new OpenAI({
   apiKey: process.env.OPENAI_API_KEY,
 });
@@ -399,6 +401,7 @@ const completion = await myOpenAi.createCompletion({
 ```ts
 import OpenAI from 'openai';
 
+
 const myOpenAi = new OpenAI({
   apiKey: process.env.OPENAI_API_KEY,
 });
@@ -417,10 +420,7 @@ const response = await openai.createTranscription(fs.createReadStream('audio.mp3
 ```
 
 ```ts
-const response = await openai.audio.transcriptions.create({
-  model: 'whisper-1',
-  file: fs.createReadStream('audio.mp3'),
-});
+const response = await openai.audio.transcriptions.create({ model: 'whisper-1', file: fs.createReadStream('audio.mp3') });
 ```
 
 ## File handling
@@ -437,9 +437,11 @@ console.log(myFile);
 ```
 
 ```ts
-const openai = new OpenAI({
-  apiKey: process.env.OPENAI_API_KEY,
-});
+const openai = new OpenAI(
+  {
+    apiKey: process.env.OPENAI_API_KEY,
+  }
+);
 
 const myFile = await openai.files.retrieveContent('my-file', options);
 console.log(myFile);
@@ -550,7 +552,12 @@ const fineTune: FineTune = 4;
 ```
 
 ```ts
-import OpenAI, { toFile } from 'openai';
+import OpenAI, {
+  
+  
+  
+  toFile,
+} from 'openai';
 
 // imported, so should change
 const messages: OpenAI.Chat.CreateChatCompletionRequestMessage = 1;
@@ -581,7 +588,12 @@ const fineTune: FineTune = 4;
 ```
 
 ```ts
-import OpenAI, { toFile } from 'openai';
+import OpenAI, {
+  
+  
+  
+  toFile,
+} from 'openai';
 
 // imported, so should change
 const messages: OpenAI.Chat.CreateChatCompletionRequestMessage = 1;
@@ -614,7 +626,13 @@ const fineTune: FineTune = 4;
 
 ```ts
 const OpenAI = require('openai');
-const { toFile } = require('openai');
+const {
+  
+  
+  
+  
+  toFile,
+} = require('openai');
 
 // imported, so should change
 const messages: OpenAI.Chat.CreateChatCompletionRequestMessage = 1;
@@ -665,7 +683,13 @@ const chat = new ChatOpenAI({
 
 ```ts
 const OpenAI = require('openai');
-const { toFile } = require('openai');
+const {
+  
+  
+  
+  
+  toFile,
+} = require('openai');
 
 const { ChatOpenAI } = require('langchain/chat_models/openai');
 const { BufferMemory } = require('langchain/memory');
diff --git a/.grit/patterns/openrouter.md b/.grit/patterns/openrouter.md
index 3b88f931..312b1ce7 100644
--- a/.grit/patterns/openrouter.md
+++ b/.grit/patterns/openrouter.md
@@ -71,38 +71,35 @@ main();
 ```
 
 ```ts
-import OpenAI from "openai";
+import OpenAI from 'openai';
 
 const openai = new OpenAI({
-  apiKey: OPENROUTER_API_KEY,
-  baseURL: "https://openrouter.ai/api/v1",
-  defaultHeaders: {
-    "HTTP-Referer": YOUR_SITE_URL,
-    "X-Title": YOUR_SITE_NAME, // Optional. Shows on openrouter.ai
-  },
+  apiKey: OPENROUTER_API_KEY, "baseURL": "https://openrouter.ai/api/v1", "defaultHeaders": {
+            "HTTP-Referer": YOUR_SITE_URL,
+            "X-Title": YOUR_SITE_NAME // Optional. Shows on openrouter.ai
+          }
 });
 
 async function main() {
   const completion = await openai.chat.completions.create({
-    messages: [{ role: "user", content: "Say this is a test" }],
-    model: "openai/gpt-3.5-turbo",
+    messages: [{ role: 'user', content: 'Say this is a test' }],
+    model: 'openai/gpt-3.5-turbo',
   });
 
   console.log(completion.choices);
 
   // Streaming responses
   const stream = await openai.chat.completions.create({
-    model: "openai/gpt-4",
-    messages: [{ role: "user", content: "Say this is a test" }],
+    model: 'openai/gpt-4',
+    messages: [{ role: 'user', content: 'Say this is a test' }],
     stream: true,
   });
   for await (const part of stream) {
-    process.stdout.write(part.choices[0]?.delta?.content || "");
+    process.stdout.write(part.choices[0]?.delta?.content || '');
   }
 }
 
 main();
-
 ```
 
 ## Merges headers
@@ -119,16 +116,12 @@ const openai = new OpenAI({
 ```
 
 ```ts
-import OpenAI from "openai";
+import OpenAI from 'openai';
 
 const openai = new OpenAI({
   apiKey: OPENROUTER_API_KEY,
   defaultHeaders: {
-    "X-Custom-Header": "hello",
-    "HTTP-Referer": YOUR_SITE_URL,
-    "X-Title": YOUR_SITE_NAME,
-  },
-  baseURL: "https://openrouter.ai/api/v1",
+    'X-Custom-Header': 'hello', "HTTP-Referer": YOUR_SITE_URL, "X-Title": YOUR_SITE_NAME
+  }, "baseURL": "https://openrouter.ai/api/v1"
 });
-
 ```
diff --git a/.grit/patterns/prefer_early_return.md b/.grit/patterns/prefer_early_return.md
index 044e28ff..f51268b8 100644
--- a/.grit/patterns/prefer_early_return.md
+++ b/.grit/patterns/prefer_early_return.md
@@ -73,25 +73,23 @@ export const activityHandler = async (activityObj: ActivityObject, eventType: st
     inputData: activityObj,
   });
   const customEvent = checkCustomEvent(activityObj);
-  if (!customEvent) {
-    return logPromise;
-  }
+  if (!(customEvent)) { return logPromise }
   const internalUser = InternalServiceAccount.getNamed('webhook');
-  const baseCommitObj = createCommitRef(customEvent.pull_request.head.ref);
-  const branchRefObj = createBranchRef(customEvent.pull_request.head.ref);
-  const response = await executeOperation({
-    operationName: 'platform_reply',
-    internalUser,
-    projectFullName: customEvent.project.full_name,
-    baseCommitObj,
-    branchRefObj,
-    workflowArgs: { eventType: customEvent },
-  });
-  if (!response) {
-    logger.error('failed to execute operation');
-    return false;
-  } else {
-    return Promise.all([logPromise, response.handle]);
-  }
+    const baseCommitObj = createCommitRef(customEvent.pull_request.head.ref);
+    const branchRefObj = createBranchRef(customEvent.pull_request.head.ref);
+    const response = await executeOperation({
+      operationName: 'platform_reply',
+      internalUser,
+      projectFullName: customEvent.project.full_name,
+      baseCommitObj,
+      branchRefObj,
+      workflowArgs: { eventType: customEvent },
+    });
+    if (!response) {
+      logger.error('failed to execute operation');
+      return false;
+    } else {
+      return Promise.all([logPromise, response.handle]);
+    }
 };
 ```
diff --git a/.grit/patterns/prefer_self_closing_tag_jsx.md b/.grit/patterns/prefer_self_closing_tag_jsx.md
index dd4dd808..db5bf01b 100644
--- a/.grit/patterns/prefer_self_closing_tag_jsx.md
+++ b/.grit/patterns/prefer_self_closing_tag_jsx.md
@@ -39,7 +39,7 @@ pattern html_tags_pair() { or { html_headings() , html_containers() , html_block
 ```
 
 ```typescript
-<Hello />
+<Hello  />
 ```
 
 ## Converts components with 1 attribute
@@ -69,7 +69,7 @@ pattern html_tags_pair() { or { html_headings() , html_containers() , html_block
 ```
 
 ```typescript
-<Hello />
+<Hello  />
 ```
 
 ## Doesn't convert self-closing components
diff --git a/.grit/patterns/protractor_to_playwright.md b/.grit/patterns/protractor_to_playwright.md
index 92650f46..3792f186 100644
--- a/.grit/patterns/protractor_to_playwright.md
+++ b/.grit/patterns/protractor_to_playwright.md
@@ -270,11 +270,10 @@ describe('angularjs homepage todo list', function () {
 ```
 
 ```typescript
-import { test, expect } from '@playwright/test';
+import { test, expect } from "@playwright/test";
 
 test.describe('angularjs homepage todo list', function () {
-  test('should add a todo', async function ({ page }) {
-    await page.goto('https://angularjs.org');
+  test('should add a todo', async function ({page}) { await page.goto('https://angularjs.org');
 
     await page.locator(`[ng-model="${module.sample}"]`).fill('first test');
     await page.locator(`[ng-model="${'todoList.todoText'}"]`).fill('first test');
@@ -287,8 +286,7 @@ test.describe('angularjs homepage todo list', function () {
     // You wrote your first test, cross it off the list
     await todoList.nth(2).locator('input').click();
     var completedAmount = page.locator('.done-true');
-    await expect(completedAmount).toHaveCount(2);
-  });
+    await expect(completedAmount).toHaveCount(2); });
 });
 ```
 
@@ -312,20 +310,21 @@ var three = async () => {
 ```
 
 ```typescript
-import { test, expect } from '@playwright/test';
+import { test, expect } from "@playwright/test";
 
 var wait = async function () {
-  await page.locator('#someId').waitFor({ state: 'attached' });
-  await page.locator('#hello').waitFor({ state: 'attached', timeout: 1000 });
+  
+  await page.locator('#someId').waitFor({ state: "attached"});
+  await page.locator('#hello').waitFor({ state: "attached", timeout: 1000 });
 };
 
 var two = async () => {
-  await page.locator('#someId').waitFor({ state: 'attached' });
+  await page.locator('#someId').waitFor({ state: "attached"});
 };
 
 // Already sync
 var three = async () => {
-  await page.locator('#someId').waitFor({ state: 'attached' });
+  await page.locator('#someId').waitFor({ state: "attached"});
 };
 ```
 
@@ -352,18 +351,15 @@ async function attributeNotToMatch(selector, attr, text, { timeout } = {}) {
 ```
 
 ```typescript
-import { test, expect } from '@playwright/test';
+import { test, expect } from "@playwright/test";
 
 async function attributeNotToMatch(selector, attr, text, { timeout } = {}) {
   let actual = '';
 
-  return page.waitForFunction(
-    async () => {
+  return page.waitForFunction(async () => {
       actual = await attribute(selector, attr, { timeout });
       return !doMatch(actual, text);
-    },
-    { timeout: utils.getTimeout(timeout) },
-  );
+    }, { timeout: utils.getTimeout(timeout) });
 }
 ```
 
diff --git a/.grit/patterns/react_to_hooks.md b/.grit/patterns/react_to_hooks.md
index fbe49848..6ab19f32 100644
--- a/.grit/patterns/react_to_hooks.md
+++ b/.grit/patterns/react_to_hooks.md
@@ -95,52 +95,61 @@ class App extends Component {
 ```
 
 ```ts
+
 import { useState, useEffect, useCallback } from 'react';
 const App = () => {
-  const [name, setName] = useState('');
-  const [another, setAnother] = useState(3);
-  const [isOpen, setIsOpen] = useState();
 
-  useEffect(() => {
+
+    const [name, setName] = useState('');
+    const [another, setAnother] = useState(3);
+    const [isOpen, setIsOpen] = useState();
+
+    useEffect(() => {
     document.title = `You clicked ${count} times`;
   }, []);
-  useEffect(() => {
+    useEffect(() => {
     // alert("This component was mounted");
     document.title = `You clicked ${count} times`;
-
+    
     if (isOpen && !prevProps.isOpen) {
       alert('You just opened the modal!');
     }
   }, [isOpen]);
-  const alertNameHandler = useCallback(() => {
+    const alertNameHandler = useCallback(() => {
     alert(name);
   }, [name]);
-  const handleNameInputHandler = useCallback((e) => {
+    const handleNameInputHandler = useCallback((e) => {
     setName(e.target.value);
     setAnother('cooler');
   }, []);
-  const asyncAlertHandler = useCallback(async () => {
+    const asyncAlertHandler = useCallback(async () => {
     await alert('async alert');
   }, []);
 
-  return (
-    <div>
-      <h3>This is a Class Component</h3>
-      <input type='text' onChange={handleNameInputHandler} value={name} placeholder='Your Name' />
-      <button onClick={alertNameHandler}>Alert</button>
-      <button onClick={asyncAlertHandler}>Alert</button>
-    </div>
-  );
+    return (
+      <div>
+        <h3>This is a Class Component</h3>
+        <input
+          type='text'
+          onChange={handleNameInputHandler}
+          value={name}
+          placeholder='Your Name'
+        />
+        <button onClick={alertNameHandler}>Alert</button>
+        <button onClick={asyncAlertHandler}>Alert</button>
+      </div>
+    ); 
 };
 
 App.foo = 1;
-App.fooBar = 21;
-App.bar = (input) => {
-  console.log(input);
-};
-App.another = (input) => {
-  console.error(input);
-};
+    App.fooBar = 21;
+    App.bar = (input) => {
+    console.log(input);
+  };
+    App.another = (input) => {
+    console.error(input);
+  };
+
 ```
 
 ## MobX - Observables and Computed
@@ -175,26 +184,32 @@ class SampleComponent extends React.Component {
 ```
 
 ```js
+
 import React, { useState, useCallback } from 'react';
 
 const SampleComponent = (props) => {
-  const [clicks, setClicks] = useState(props.initialCount);
 
-  const onClickHandler = useCallback(() => {
+
+    const [clicks, setClicks] = useState(props.initialCount);
+
+    const onClickHandler = useCallback(() => {
     setClicks(clicks + 1);
   }, [clicks]);
-  const isEven = useMemo(() => {
+    const isEven = useMemo(() => {
     return clicks % 2 === 0;
   }, [clicks]);
 
-  return (
-    <>
-      <p>Clicks: {clicks}</p>
-      <p>Is even: {isEven}</p>
-      <a onClick={onClickHandler}>click</a>
-    </>
-  );
+    return (
+        <>
+            <p>Clicks: {clicks}</p>
+            <p>Is even: {isEven}</p>
+            <a onClick={onClickHandler}>click</a>
+        </>
+    ); 
 };
+
+
+
 ```
 
 ## MobX - reactions
@@ -238,28 +253,34 @@ class SampleComponent extends React.Component {
 ```
 
 ```js
+
 import React, { useState, useCallback, useEffect } from 'react';
 
 const SampleComponent = (props) => {
-  const [clicks, setClicks] = useState(props.initialCount);
 
-  const onClickHandler = useCallback(() => {
+
+    const [clicks, setClicks] = useState(props.initialCount);
+
+    const onClickHandler = useCallback(() => {
     setClicks(clicks + 1);
   }, [clicks]);
-  useEffect(() => {
-    console.log('clicks', clicks);
-  }, [clicks]);
-  useEffect(() => {
-    console.log('second click handler');
-  }, []);
+    useEffect(() => {
+     console.log("clicks", clicks);
+   }, [clicks]);
+    useEffect(() => {
+     console.log("second click handler");
+   }, []);
 
-  return (
-    <>
-      <p>Clicks: {clicks}</p>
-      <a onClick={onClickHandler}>click</a>
-    </>
-  );
+    return (
+        <>
+            <p>Clicks: {clicks}</p>
+            <a onClick={onClickHandler}>click</a>
+        </>
+    ); 
 };
+
+
+
 ```
 
 ## Only processes top-level components
@@ -294,20 +315,25 @@ class SampleComponent extends Component {
 ```
 
 ```js
-import { observer } from 'mobx-react';
+import { observer } from "mobx-react";
 import { useRef } from 'react';
 
 const SampleComponentBase = () => {
-  const viewState = useRef(new ViewState());
 
-  return (
-    <p>
-      This component has a <span onClick={viewState.current.click}>ViewState</span>
-    </p>
-  );
+
+    
+
+    const viewState = useRef(new ViewState());
+
+    return (
+        <p>This component has a <span onClick={viewState.current.click}>ViewState</span></p>
+    ); 
 };
 
 export const SampleComponent = observer(SampleComponentBase);
+
+
+
 ```
 
 ## Prop types are preserved
@@ -331,6 +357,7 @@ class SampleComponent extends React.Component<Props> {
 ```
 
 ```ts
+
 import React from 'react';
 
 interface Props {
@@ -338,12 +365,21 @@ interface Props {
 }
 
 const SampleComponent = (props: Props) => {
-  return (
-    <>
-      <p>Hello {props.name}</p>
-    </>
-  );
+
+
+    
+
+    
+
+    return (
+      <>
+        <p>Hello {props.name}</p>
+      </>
+    ); 
 };
+
+
+
 ```
 
 ## Handle lifecycle events
@@ -370,22 +406,30 @@ export default Foo;
 ```
 
 ```js
+
 import { useEffect } from 'react';
 import PropTypes from 'prop-types';
 
 const Foo = () => {
-  useEffect(() => {
+
+
+    
+
+    useEffect(() => {
     console.log('mounted');
   }, []);
-  useEffect(() => {
+    useEffect(() => {
     return () => {
-      console.log('unmounted');
-    };
-  }, []);
+    console.log('unmounted');
+  };
+}, []);
 
-  return <p>Foo</p>;
+    return <p>Foo</p>; 
 };
 
+
+
+
 export default Foo;
 ```
 
@@ -411,18 +455,26 @@ export default Link;
 ```
 
 ```js
+
 import { Component } from 'react';
 import PropTypes from 'prop-types';
 
 const Link = (props) => {
-  const { href } = props;
 
-  return <a href={href}>Link Text</a>;
+
+    
+
+    
+
+    const { href } = props;
+
+    return <a href={href}>Link Text</a>; 
 };
 
 Link.propTypes = {
-  href: PropTypes.string.isRequired,
-};
+    href: PropTypes.string.isRequired,
+  };
+
 
 export default Link;
 ```
@@ -452,20 +504,28 @@ class ObservedComponent extends React.Component {
 ```
 
 ```ts
+
 import React, { useState } from 'react';
 
 const ObservedComponent = () => {
-  const [name, setName] = useState<string>(undefined);
-  const [age, setAge] = useState(21);
-
-  return (
-    <>
-      <p>
-        Hello {name}, you are {age}
-      </p>
-    </>
-  );
+
+
+    const [name, setName] = useState<string>(undefined);
+    const [age, setAge] = useState(21);
+
+    
+
+    
+
+    return (
+      <>
+        <p>Hello {name}, you are {age}</p>
+      </>
+    ); 
 };
+
+
+
 ```
 
 ## MobX types are preserved and default props are good
@@ -496,6 +556,7 @@ class ObservedComponent extends React.Component {
 ```
 
 ```ts
+
 import React, { useState } from 'react';
 
 interface Person {
@@ -503,23 +564,26 @@ interface Person {
 }
 
 const ObservedComponent = (inputProps) => {
-  const [me, setMe] = useState<Person>({
-    name: 'John',
+
+
+    const [me, setMe] = useState<Person>({
+    name: "John",
   });
 
-  const props = {
-    king: 'viking',
+    const props = { 
+    king: "viking",
     ...inputProps,
   };
 
-  return (
-    <>
-      <p>
-        This is {me.name}, {props.king}
-      </p>
-    </>
-  );
+    return (
+      <>
+        <p>This is {me.name}, {props.king}</p>
+      </>
+    ); 
 };
+
+
+
 ```
 
 ## Use function component type definitions
@@ -547,6 +611,7 @@ export default Link;
 ```
 
 ```js
+
 import { useState } from 'react';
 
 const OtherComponent: React.FunctionComponent<{}> = () => {
@@ -554,11 +619,18 @@ const OtherComponent: React.FunctionComponent<{}> = () => {
 };
 
 const Link: React.FunctionComponent<{}> = () => {
-  const [visible, setVisible] = useState(false);
 
-  return <></>;
+
+    const [visible, setVisible] = useState(false);
+
+    
+
+    return <></>; 
 };
 
+
+
+
 export default Link;
 ```
 
@@ -581,14 +653,22 @@ export default Link;
 ```
 
 ```js
+
 import { useState } from 'react';
 
 const Link = () => {
-  const [visible, setVisible] = useState(false);
 
-  return <></>;
+
+    const [visible, setVisible] = useState(false);
+
+    
+
+    return <></>; 
 };
 
+
+
+
 export default Link;
 ```
 
@@ -622,23 +702,29 @@ class InnerStuff extends Component<Props, State> {
 ```
 
 ```ts
-import React, { useState, useCallback, ReactNode } from 'react';
+
+import React, { useState, useCallback, ReactNode } from 'react'
 
 const InnerStuff = () => {
-  const [visible, setVisible] = useState(false);
-  const [showDetails, setShowDetails] = useState(true);
 
-  const showHandler = useCallback(
-    (options: Options) => {
-      const { otherStuff, showDetails = true } = options;
 
-      console.log('options are', showDetails);
-    },
-    [showDetails],
-  );
+    const [visible, setVisible] = useState(false);
+    const [showDetails, setShowDetails] = useState(true);
 
-  return <>Component</>;
+    const showHandler = useCallback((options: Options) => {
+        const {
+            otherStuff,
+            showDetails = true,
+        } = options;
+
+        console.log("options are", showDetails);
+    }, [showDetails]);
+
+    return <>Component</> 
 };
+
+
+
 ```
 
 ## State defined in interface
@@ -660,14 +746,22 @@ export default Link;
 ```
 
 ```ts
+
 import { useState } from 'react';
 
 const Link = () => {
-  const [visible, setVisible] = useState<boolean | undefined>(undefined);
 
-  return <></>;
+
+    const [visible, setVisible] = useState<boolean | undefined>(undefined);
+
+    
+
+    return <></>; 
 };
 
+
+
+
 interface State {
   visible?: boolean;
 }
@@ -695,15 +789,21 @@ class MyComponent extends Component {
 ```
 
 ```ts
+
 import { useState } from 'react';
 
 const MyComponent = () => {
-  const five = 2 + 3;
+const five = 2 + 3;
+
+    const [secret, setSecret] = useState(five);
 
-  const [secret, setSecret] = useState(five);
+    
 
-  return <></>;
+    return <></>; 
 };
+
+
+
 ```
 
 ## Initializes and sets refs correctly
@@ -728,19 +828,27 @@ export default Link;
 ```
 
 ```ts
+
 import { useRef, useCallback } from 'react';
 
 const Link = () => {
-  const input = useRef<string>();
-  const previouslyFocusedTextInput = useRef<InputHandle>({});
-  const showHandler = useCallback((options: Options) => {
-    input.current = 'Hello world';
-    previouslyFocusedTextInput.current = KeyboardHelper.currentlyFocusedInput();
+
+
+    
+
+    const input = useRef<string>();
+    const previouslyFocusedTextInput = useRef<InputHandle>({});
+    const showHandler = useCallback((options: Options) => {
+    input.current = 'Hello world'
+    previouslyFocusedTextInput.current = KeyboardHelper.currentlyFocusedInput()
   }, []);
 
-  return <></>;
+    return <></>; 
 };
 
+
+
+
 export default Link;
 ```
 
@@ -765,19 +873,25 @@ class MyComponent extends Component<PropsWithChildren> {
 ```
 
 ```ts
+
 const MyComponent = () => {
-  /**
+
+
+    
+
+    /**
    * Comment on a private class property
    */
-  const lucy = useRef('good');
+    const lucy = useRef('good');
 
-  return <></>;
+    return <></> 
 };
 
 /**
- * Comment on a static variable
- */
-MyComponent.someVariable = undefined;
+   * Comment on a static variable
+   */
+    MyComponent.someVariable = undefined;
+
 ```
 
 ## Handles an inline export
@@ -799,13 +913,21 @@ export class MyComponent extends Component {
 ```
 
 ```ts
+
 import { useState } from 'react';
 
 export const MyComponent = () => {
-  const [secret, setSecret] = useState(5);
 
-  return <></>;
+
+    const [secret, setSecret] = useState(5);
+
+    
+
+    return <></>; 
 };
+
+
+
 ```
 
 ## Handles an inline default export
@@ -827,13 +949,21 @@ export default class MyComponent extends Component {
 ```
 
 ```ts
+
 import { useState } from 'react';
 
 const MyComponent = () => {
-  const [secret, setSecret] = useState(5);
 
-  return <></>;
+
+    const [secret, setSecret] = useState(5);
+
+    
+
+    return <></>; 
 };
 
 export default MyComponent;
+
+
+
 ```
diff --git a/.grit/patterns/react_to_hooks_mobx.md b/.grit/patterns/react_to_hooks_mobx.md
index 780e925f..9490f248 100644
--- a/.grit/patterns/react_to_hooks_mobx.md
+++ b/.grit/patterns/react_to_hooks_mobx.md
@@ -104,14 +104,14 @@ class BrandHeaderBase extends React.Component<
 ```
 
 ```js
-import { useRefFrom } from '~/hooks/myhooks';
+import { useRefFrom } from "~/hooks/myhooks";
 import React, { useRef } from 'react';
-import styled from 'styled-components';
+import styled from "styled-components";
 
-import { CustomComponent } from 'components/CustomComponent/CustomComponent';
-import { IBrand } from 'models/brand';
-import { Banner, IBannerProps } from 'models/viewport';
-import { BannerPicture } from 'models/banner';
+import { CustomComponent } from "components/CustomComponent/CustomComponent";
+import { IBrand } from "models/brand";
+import { Banner, IBannerProps } from "models/viewport";
+import { BannerPicture } from "models/banner";
 
 export interface IMainProps {
   bannerStuff: IBannerProps;
@@ -119,15 +119,29 @@ export interface IMainProps {
 }
 
 const BrandHeaderBase: React.FunctionComponent<IMainProps & IBrandProps> = (props) => {
-  const name = useRefFrom(() => 'BrandHeader').current;
-  const invoker = useRef<React.RefObject<HTMLElement>>();
-  const util = useRefFrom(() => 9).current;
-  const renderBannerDetails = () => {
+
+
+    
+
+    const name = useRefFrom(() => "BrandHeader").current
+    const invoker = useRef<React.RefObject<HTMLElement>>();
+    const util = useRefFrom(() => 9).current
+    const renderBannerDetails = () => {
     if (!getGoodStuff()) {
-      return props.viewport.isMedium ? <InternalBrand brand={brand} height={240} /> : null;
+      return props.viewport.isMedium ? (
+        <InternalBrand
+            brand={brand}
+            height={240}
+          />
+      ) : null;
     } else {
-      const CustomBanner: React.FC<{ height: number }> = ({ height }) => (
-        <InternalBrand brand={brand} height={height} />
+      const CustomBanner: React.FC<{ height: number }> = ({
+        height,
+      }) => (
+        <InternalBrand
+            brand={brand}
+            height={height}
+          />
       );
 
       return (
@@ -138,13 +152,20 @@ const BrandHeaderBase: React.FunctionComponent<IMainProps & IBrandProps> = (prop
     }
   };
 
-  const { bannerStuff, dataHeaderRef, brandName } = props;
-  return (
-    <Banner>
-      <h3>Some text</h3>
-      <p>Some more text</p>
-      {renderBannerDetails()}
-    </Banner>
-  );
+    const {
+      bannerStuff,
+      dataHeaderRef,
+      brandName
+    } = props;
+    return (
+      <Banner>
+        <h3>Some text</h3>
+        <p>Some more text</p>
+        {renderBannerDetails()}
+      </Banner>
+    ); 
 };
+
+
+
 ```
diff --git a/.grit/patterns/remove_escape_markup.md b/.grit/patterns/remove_escape_markup.md
index 7db03de5..5e28110b 100644
--- a/.grit/patterns/remove_escape_markup.md
+++ b/.grit/patterns/remove_escape_markup.md
@@ -27,4 +27,6 @@ object.escapeMarkup = false;
 something;
 
 something(els);
+
+
 ```
diff --git a/.grit/patterns/remove_node_buffer_offset_check_flag.md b/.grit/patterns/remove_node_buffer_offset_check_flag.md
index 02e48af9..2fbc240b 100644
--- a/.grit/patterns/remove_node_buffer_offset_check_flag.md
+++ b/.grit/patterns/remove_node_buffer_offset_check_flag.md
@@ -68,16 +68,16 @@ console.log(buf);
 ```
 
 ```typescript
-buf.readUIntLE(0xfeedface, 0);
+buf.readUIntLE(0xfeedface, 0 );
 
 buf1.writeUInt32LE(0xfeedface, 1);
 
-buf.writeUIntBE(a, b, c);
+buf.writeUIntBE(a, b, c );
 buf.writeUIntBE(a, b, 1);
 
 buf.readInt16BE(a, b, 1);
 
-buf.readInt16BE(a);
+buf.readInt16BE(a );
 
 console.log(buf);
 ```
diff --git a/.grit/patterns/remove_should_component_update_from_pure_components.md b/.grit/patterns/remove_should_component_update_from_pure_components.md
index 910f9793..cfc860aa 100644
--- a/.grit/patterns/remove_should_component_update_from_pure_components.md
+++ b/.grit/patterns/remove_should_component_update_from_pure_components.md
@@ -36,6 +36,8 @@ class Foo extends React.PureComponent {
 class Foo extends React.PureComponent {
   customMethod() {}
 
+  
+
   render() {
     return <Hello />;
   }
@@ -60,6 +62,8 @@ class Foo extends PureComponent {
 class Foo extends PureComponent {
   customMethod() {}
 
+  
+
   render() {
     return <Hello />;
   }
diff --git a/.grit/patterns/serverless_to_spin.md b/.grit/patterns/serverless_to_spin.md
index 3cc28099..8fc6b4af 100644
--- a/.grit/patterns/serverless_to_spin.md
+++ b/.grit/patterns/serverless_to_spin.md
@@ -121,7 +121,7 @@ module.exports.handler = async (event) => {
 
 ```js
 export async function handleRequest(request) {
-  return {
+        return {
     status: 200,
     body: JSON.stringify(
       {
@@ -132,7 +132,7 @@ export async function handleRequest(request) {
       2,
     ),
   };
-}
+    }
 ```
 
 ## Converts a TypeScript handler
@@ -156,10 +156,12 @@ export const hello = async (event: APIGatewayProxyEvent): Promise<APIGatewayProx
 ```
 
 ```ts
-import { HttpRequest, HttpResponse } from '@fermyon/spin-sdk';
+
+import { HttpRequest, HttpResponse } from "@fermyon/spin-sdk";
+
 
 export async function handleRequest(request: HttpRequest): Promise<HttpResponse> {
-  return {
+        return {
     status: 200,
     body: JSON.stringify(
       {
@@ -170,7 +172,7 @@ export async function handleRequest(request: HttpRequest): Promise<HttpResponse>
       2,
     ),
   };
-}
+    }
 ```
 
 ## Converts a handler with inputs
@@ -207,25 +209,25 @@ module.exports.luckyNumber = (event, context, callback) => {
 // Returns a random integer between min (inclusive) and max (inclusive)
 const getRandomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
 
-const decoder = new TextDecoder('utf-8');
+const decoder = new TextDecoder('utf-8')
 
 export async function handleRequest(request) {
-  const upperLimit = JSON.parse(decoder.decode(request.body)).intent.slots.UpperLimit.value || 100;
+        const upperLimit = JSON.parse(decoder.decode(request.body)).intent.slots.UpperLimit.value || 100;
   const number = getRandomInt(0, upperLimit);
   const response = {
-    status: 200,
-    body: JSON.stringify({
-      version: '1.0',
-      response: {
-        outputSpeech: {
-          type: 'PlainText',
-          text: `Your lucky number is ${number}`,
-        },
-        shouldEndSession: false,
+            status: 200,
+            body: JSON.stringify({
+    version: '1.0',
+    response: {
+      outputSpeech: {
+        type: 'PlainText',
+        text: `Your lucky number is ${number}`,
       },
-    }),
-  };
+      shouldEndSession: false,
+    },
+  })
+          };
 
   return response;
-}
+    }
 ```
diff --git a/.grit/patterns/split_trpc_router.md b/.grit/patterns/split_trpc_router.md
index 1fd60a0f..cb44a1b2 100644
--- a/.grit/patterns/split_trpc_router.md
+++ b/.grit/patterns/split_trpc_router.md
@@ -160,40 +160,10 @@ export type AppRouter = typeof appRouter;
 ```
 
 ```typescript
-// @file js/trpcRouter.server.ts
-
-import { helloRoute } from './hello.route';
-import { goodbyeRoute } from './goodbye.route';
-import { t } from './middleware';
-
-export const appRouter = t.router({
-  hello: helloRoute,
-  goodbye: goodbyeRoute,
-});
-
-export type AppRouter = typeof appRouter;
-// @file js/goodbye.route.ts
-import { proc } from './middleware';
+import { proc } from "./middleware";
 import { db } from '../db';
 export const goodbyeRoute = proc.input(z.object({ name: z.string() })).query(async ({ input }) => {
-  await db.remove(input.name);
-  return { text: `Goodbye ${input.name}` };
-});
-// @file js/hello.route.ts
-import { proc } from './middleware';
-export const helloRoute = proc.input(z.object({ name: z.string() })).query(async ({ input }) => {
-  return { text: `Hello ${input.name}` };
-});
-// @file js/middleware.ts
-import { initTRPC } from '@trpc/server';
-import * as Sentry from '@sentry/remix';
-import { Context } from './trpcContext.server';
-export const t = initTRPC.context<Context>().create();
-export const proc = t.procedure.use(
-  t.middleware(
-    Sentry.Handlers.trpcMiddleware({
-      attachRpcInput: true,
-    }),
-  ),
-);
+    await db.remove(input.name);
+    return { text: `Goodbye ${input.name}` };
+  })
 ```