yarn upgrade prettier@^3.0.3

- The default value of trailingComma has been changed to "all".

- Ignore .gitignored files by default (prettier/prettier#14731)

.prettierignore

@@ -1,6 +1 @@
-# Ignore artifacts generated by Gatsby
-.cache
-public
-
-# Ignore the TypeScript definitions file that is autogenerated by Gatsby
-src/gatsby-types.d.ts
+*.scd

gatsby-node.ts

@@ -69,7 +69,7 @@ export const createPages: GatsbyNode<
     const nodes = data.allMdx.nodes;
 
     const activity = reporter.activityTimer(
-        `Creating pages from MDX files [${nodes.length}]`
+        `Creating pages from MDX files [${nodes.length}]`,
     );
     activity.start();
 

package.json

@@ -52,7 +52,7 @@
         "gatsby-plugin-root-import": "^2.0.9",
         "patch-package": "^7.0.0",
         "postinstall-postinstall": "^2.1.0",
-        "prettier": "^2.8.7",
+        "prettier": "^3.0.3",
         "prettier-plugin-organize-imports": "^3.2.2",
         "typescript": "^5.1.6"
     }

pages/b1/sketch.tsx

@@ -14,7 +14,7 @@ export const draw = (p5: p5Types, env: P5DrawEnv) => {
 
     // Pulse the colors to the beat
     const strokeDots = color(
-        Math.max(235 + audio.nearOnBeat * 20, 235 + audio.nearOffBeat * 20)
+        Math.max(235 + audio.nearOnBeat * 20, 235 + audio.nearOffBeat * 20),
     );
     const strokeStar = color(237 + audio.nearOnBeat * 11);
     // Link to the pre-offbeat kick (the kick at the 6/16-th note).
@@ -62,7 +62,7 @@ const bassNoteForBar = (bar: number) =>
             0,
             0,
             0,
-        ][bar]
+        ][bar],
     );
 
 interface DotsDrawOpts {
@@ -95,7 +95,7 @@ interface CirclesAndStarsDrawOpts {
 
 const gridCirclesAndStars = (
     p5: p5Types,
-    o = {} as CirclesAndStarsDrawOpts
+    o = {} as CirclesAndStarsDrawOpts,
 ) => {
     const { gap, strokeCircle, strokeStar, rotateStar } = o;
 
@@ -156,7 +156,7 @@ const curvedStar = (
     h: number,
     stroke: Color,
     rotateBy: number,
-    showOutlines = false
+    showOutlines = false,
 ) => {
     // The coordinates below were laid out for a 240 x 240 sized shape. We scale
     // them appropriately depending on the actual width and height passed to us.
@@ -186,7 +186,7 @@ const curvedStar = (
         a: p5Types.Vector,
         b: p5Types.Vector,
         c: p5Types.Vector,
-        d: p5Types.Vector
+        d: p5Types.Vector,
     ) => {
         if (showOutlines) {
             p5.stroke(p5c(setAlpha(stroke, 0.6)));

pages/become/sketch.tsx

@@ -21,15 +21,15 @@ export const draw = (p5: p5Types, env: P5DrawEnv) => {
             ? 235
             : Math.max(
                   235 + audio.nearOnBeat * 20,
-                  235 + audio.nearOffBeat * 20
-              )
+                  235 + audio.nearOffBeat * 20,
+              ),
     );
     const strokeStar = color(
-        237 + (isBeforeIntroDrums ? 0 : audio.nearOnBeat * 11)
+        237 + (isBeforeIntroDrums ? 0 : audio.nearOnBeat * 11),
     );
     // Link to the pre-offbeat kick (the kick at the 6/16-th note).
     const strokeCircle = color(
-        237 + (isBeforeIntroDrums ? 0 : audio.nearBeat(6 / 16) * 11)
+        237 + (isBeforeIntroDrums ? 0 : audio.nearBeat(6 / 16) * 11),
     );
 
     // Offset the grid by a bit so that the initial row and column of dots is
@@ -84,7 +84,7 @@ const bassNoteForBar = (bar: number) =>
             0,
             0,
             0,
-        ][bar]
+        ][bar],
     );
 
 interface DotsDrawOpts {
@@ -117,7 +117,7 @@ interface CirclesAndStarsDrawOpts {
 
 const gridCirclesAndStars = (
     p5: p5Types,
-    o = {} as CirclesAndStarsDrawOpts
+    o = {} as CirclesAndStarsDrawOpts,
 ) => {
     const { gap, strokeCircle, strokeStar, rotateStar } = o;
 
@@ -178,7 +178,7 @@ const curvedStar = (
     h: number,
     stroke: Color,
     rotateBy: number,
-    showOutlines = false
+    showOutlines = false,
 ) => {
     // The coordinates below were laid out for a 240 x 240 sized shape. We scale
     // them appropriately depending on the actual width and height passed to us.
@@ -208,7 +208,7 @@ const curvedStar = (
         a: p5Types.Vector,
         b: p5Types.Vector,
         c: p5Types.Vector,
-        d: p5Types.Vector
+        d: p5Types.Vector,
     ) => {
         if (showOutlines) {
             p5.stroke(p5c(setAlpha(stroke, 0.6)));

pages/come/song.ts

@@ -7,7 +7,7 @@ export const song: StrudelSong = () => {
     const { note } = controls;
 
     const p1 = note(
-        m`[c d f a]!7 [g!6 f g] [c d [f@2 f] a]!6 [c d [f@2 f] a] [g g g@2 g@2 f g]`
+        m`[c d f a]!7 [g!6 f g] [c d [f@2 f] a]!6 [c d [f@2 f] a] [g g g@2 g@2 f g]`,
     ).slow(16);
 
     const p2 = note(m`[c d f a]!7 [g f d c]`)
@@ -33,6 +33,6 @@ export const song: StrudelSong = () => {
         p1.velocity(0.5),
         p2.velocity(fadeIn(2)),
         p3.velocity(0.8).gain(fadeIn(5, 5)),
-        p4.gain(fadeIn(0, 16 * 8))
+        p4.gain(fadeIn(0, 16 * 8)),
     );
 };

pages/s1/sketch.tsx

@@ -186,7 +186,7 @@ const aliveNeighbourCount = (
     rows: number,
     cols: number,
     j: number,
-    i: number
+    i: number,
 ) => {
     // Neighbouring indices. Initializing this separately so that we can provide
     // a type annotation and make the TypeScript compiler happy about the [j, i]

pages/s1/song.ts

@@ -30,7 +30,7 @@ export const song: StrudelSong = () => {
         .release(0.5);
 
     const p4 = note(
-        m`<[a3 c4 a3 f#3 f3 f#3]!3 [a3!6] [f#3 a3 c4 d4!3]!3 [c4 d4!5]>/2`
+        m`<[a3 c4 a3 f#3 f3 f#3]!3 [a3!6] [f#3 a3 c4 d4!3]!3 [c4 d4!5]>/2`,
     )
         .s("sine")
         .cutoff(sine.slow(12).range(120, 160));
@@ -39,6 +39,6 @@ export const song: StrudelSong = () => {
         p1.velocity(0.6),
         p2.velocity(0.2),
         p3.velocity(0.2),
-        p4.velocity(0.4)
+        p4.velocity(0.4),
     );
 };

pages/s2/song.ts

@@ -29,7 +29,7 @@ export const song: StrudelSong = () => {
 [[a5!2] c6 d6 d6 c6 a5 a5 c6 [d6!2]!2 d6 ~]/4
 
     ]/1
-        `
+        `,
     )
         .slow(1.1)
         .attack(0.01)

src/components/PageColorStyle.tsx

@@ -81,7 +81,7 @@ export const basicColorPalettes = {
             "hsl(0, 0%, 40%)",
             "hsl(0, 0%, 13%)",
             "hsl(0, 0%, 60%)",
-        ])
+        ]),
     ),
     darkColors: parseColorPalette([
         "hsl(0, 0%, 4%)",

src/components/PlayerP5WebAudio.tsx

@@ -128,7 +128,7 @@ export const PlayerP5WebAudio: React.FC<
         if (!(isSafari || isMobileSafari)) return;
         setTimeout(() => {
             const el = ensure(
-                window.document.getElementById("sketch-container")
+                window.document.getElementById("sketch-container"),
             );
             el.style.display = "table";
             el.offsetHeight;

src/hooks/use-share.ts

@@ -10,7 +10,7 @@ import * as React from "react";
  * the passed in `shareData`.
  */
 export const useShare = (
-    shareData: ShareData
+    shareData: ShareData,
 ): [canShare: boolean, handleShareClick: React.MouseEventHandler] => {
     const [canShare, setCanShare] = React.useState(true);
 

src/hooks/use-strudel-playback.ts

@@ -12,7 +12,7 @@ type UseStrudelPlaybackReturn = [
     /** Toggle playback */
     toggleIsPlaying: () => void,
     /** Has user started playback at least once */
-    wasPlayingOnce: boolean
+    wasPlayingOnce: boolean,
 ];
 
 /**
@@ -28,7 +28,7 @@ type UseStrudelPlaybackReturn = [
  * wasPlayingOnce]`
  */
 export const useStrudelPlayback = (
-    song: StrudelSong
+    song: StrudelSong,
 ): UseStrudelPlaybackReturn => {
     const [isPlaying, setIsPlaying] = React.useState(false);
     const schedulerRef = React.useRef<Scheduler | null>(null);
@@ -37,7 +37,7 @@ export const useStrudelPlayback = (
     // to successfully play. We will reset back to this if a new one cannot be
     // loaded (say due to syntax errors during live reload editing).
     const [lastPattern, setLastPattern] = React.useState<Pattern | undefined>(
-        undefined
+        undefined,
     );
 
     // Keep the canvas hidden until the first playback

src/hooks/use-web-audio-playback.ts

@@ -58,7 +58,7 @@ type DidPlay = (isPlaying: boolean) => void;
  */
 export const useWebAudioPlayback = (
     sequencer: Sequencer,
-    didPlay: DidPlay | undefined
+    didPlay: DidPlay | undefined,
 ): UseWebAudioPlaybackReturn => {
     // Track the user's intent (whether or not they've pressed the play button).
     // Whether or not we're actually playing right now (`isPlaying` below)

src/hydra-synth-types.d.ts

@@ -412,6 +412,6 @@ declare module "hydra-synth" {
      * {@link osc} source function.
      */
     type GLSLSource = (
-        st: [number, number]
+        st: [number, number],
     ) => [r: number, g: number, b: number, a: number];
 }

src/p5/audio.ts

@@ -122,7 +122,7 @@ export interface AudioMarkers {
  */
 export const extractAudioMarkersAtTime = (
     track: TrackInfo,
-    audioTime: number
+    audioTime: number,
 ): AudioMarkers => {
     // Time, in seconds
     const time = audioTime % track.duration;

src/pages/404.tsx

@@ -26,7 +26,7 @@ export const Head: HeadFC = () => {
 
 const colorPalettes = {
     colors: ensure(
-        parseColorPalette(["hsl(0, 0%, 100%)", "hsl(0, 0%, 33.3%)"])
+        parseColorPalette(["hsl(0, 0%, 100%)", "hsl(0, 0%, 33.3%)"]),
     ),
     darkColors: parseColorPalette(["hsl(0, 0%, 26.6%)", "hsl(0, 0%, 93.3%)"]),
 };

src/pages/index.tsx

@@ -47,7 +47,7 @@ const indexColorPalettes = {
             "hsl(0, 0%, 0%)",
             "hsl(0, 0%, 33%)",
             "hsl(0, 0%, 30%)",
-        ])
+        ]),
     ),
     darkColors: parseColorPalette([
         "hsl(240, 6%, 20%)",

src/parsers/colors.ts

@@ -129,14 +129,14 @@ export interface ColorPaletteSet {
  * mish-mash.
  */
 export const parseColorPalette = (
-    colors: readonly (string | undefined)[] | undefined
+    colors: readonly (string | undefined)[] | undefined,
 ) => {
     if (!colors) return;
 
     const all = colors.filter(isDefined);
     if (all.length < 2) {
         throw new Error(
-            "At least 2 colors are required to construct a palette"
+            "At least 2 colors are required to construct a palette",
         );
     }
 

src/strudel-types.d.ts

@@ -710,7 +710,7 @@ declare module "@strudel.cycles/core" {
      */
     export const register = (
         name: string,
-        f: (...args: Pattern[]) => Patternable
+        f: (...args: Pattern[]) => Patternable,
     ) => PatternTransform;
 
     /**

src/strudel/util.ts

@@ -15,7 +15,10 @@ import {
  */
 export const fadeIn = (n: number, wait: number = 0) =>
     signal((t) =>
-        Math.min(n === 0 ? Math.max(0, t - wait) : Math.max(0, t - wait) / n, 1)
+        Math.min(
+            n === 0 ? Math.max(0, t - wait) : Math.max(0, t - wait) / n,
+            1,
+        ),
     );
 
 /**

src/templates/page.tsx

@@ -213,7 +213,7 @@ export const parsePageIgnoringTypeSafety = (data: Record<string, unknown>) =>
  * within your components.
  */
 export const BuildTimePageContext = React.createContext<Page | undefined>(
-    undefined
+    undefined,
 );
 
 interface LayoutProps {

src/types/gatsby.ts

@@ -28,7 +28,7 @@ export type PageTemplateContext = {
  * in the future we add more contexts that have these fields as a subset.
  */
 export const isPageTemplateContext = (
-    c: Record<string, unknown>
+    c: Record<string, unknown>,
 ): c is PageTemplateContext => {
     const pageID = c["pageID"];
     if (typeof pageID === "string") return true;

src/utils/replace-nulls.ts

@@ -22,7 +22,7 @@ type RecursivelyReplaceNullWithUndefined<T> = T extends null
  * If nulls were a billion dollar mistake, Javascript made two of them.
  */
 export const replaceNullsWithUndefineds = <T>(
-    obj: T
+    obj: T,
 ): RecursivelyReplaceNullWithUndefined<T> => {
     const newObj: any = {};
     Object.keys(obj as any).forEach((k) => {

src/utils/url.ts

@@ -20,12 +20,12 @@ export const fullURLForSlug = (slug: string) => {
 
     if (!slug.startsWith("/"))
         throw new Error(
-            `Specify a leading slash when providing the slug (was "${slug}")`
+            `Specify a leading slash when providing the slug (was "${slug}")`,
         );
 
     if (slug.endsWith("/"))
         throw new Error(
-            `Do not specify a trailing slash when providing the canonicalPath (was "${slug}")`
+            `Do not specify a trailing slash when providing the canonicalPath (was "${slug}")`,
         );
 
     return `${siteURL}${slug}`;

src/webaudio/audio.ts

@@ -74,7 +74,7 @@ export interface SequencerHelpers {
  */
 export const createHelpers = (
     mp3s: Record<string, string>,
-    ctx: AudioContext
+    ctx: AudioContext,
 ): SequencerHelpers => {
     const load = (name: string) => loadAudioBuffer(ctx, ensure(mp3s[name]));
 
@@ -135,7 +135,7 @@ export const createHelpers = (
  */
 export const loadAudioBuffer = async (
     audioContext: AudioContext,
-    url: string
+    url: string,
 ) => {
     const response = await fetch(url);
     const arrayBuffer = await response.arrayBuffer();
@@ -159,7 +159,7 @@ export const loadAudioBuffer = async (
  */
 export const loopAudioBuffer = (
     audioContext: AudioContext,
-    audioBuffer: AudioBuffer
+    audioBuffer: AudioBuffer,
 ) => {
     const bufferSource = new AudioBufferSourceNode(audioContext, {
         buffer: audioBuffer,

yarn.lock

@@ -8881,10 +8881,10 @@ prettier-plugin-organize-imports@^3.2.2:
   resolved "https://registry.yarnpkg.com/prettier-plugin-organize-imports/-/prettier-plugin-organize-imports-3.2.2.tgz#91993365e017daa5d0d28d8183179834224d8dd1"
   integrity sha512-e97lE6odGSiHonHJMTYC0q0iLXQyw0u5z/PJpvP/3vRy6/Zi9kLBwFAbEGjDzIowpjQv8b+J04PDamoUSQbzGA==
 
-prettier@^2.8.7:
-  version "2.8.8"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.8.tgz#e8c5d7e98a4305ffe3de2e1fc4aca1a71c28b1da"
-  integrity sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==
+prettier@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.0.3.tgz#432a51f7ba422d1469096c0fdc28e235db8f9643"
+  integrity sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==
 
 pretty-bytes@^5.6.0:
   version "5.6.0"