diff --git a/examples/angular/optimistic-updates/src/app/components/optimistic-updates.component.ts b/examples/angular/optimistic-updates/src/app/components/optimistic-updates.component.ts
index a5ad0e2a0e..a00f647d47 100644
--- a/examples/angular/optimistic-updates/src/app/components/optimistic-updates.component.ts
+++ b/examples/angular/optimistic-updates/src/app/components/optimistic-updates.component.ts
@@ -1,71 +1,73 @@
-import { Component, inject } from '@angular/core';
-import { injectMutation, injectQuery } from '@tanstack/angular-query-experimental';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { DatePipe } from '@angular/common';
-import { TasksService } from '../services/tasks.service';
+import { Component, inject } from '@angular/core'
+import {
+  injectMutation,
+  injectQuery,
+} from '@tanstack/angular-query-experimental'
+import { FormsModule, ReactiveFormsModule } from '@angular/forms'
+import { DatePipe } from '@angular/common'
+import { TasksService } from '../services/tasks.service'
 
 @Component({
   selector: 'optimistic-updates',
-  imports: [
-    FormsModule,
-    DatePipe
-  ],
+  imports: [FormsModule, DatePipe],
   template: `
     <p>
-    In this example, new items can be created using a mutation. The new item will be optimistically added to the list in hopes that the server accepts the item. If it does, the list is refetched with the true items from the list. Every now and then, the mutation may fail though. When that happens, the previous list of items is restored and the list is again refetched from the server.
+      In this example, new items can be created using a mutation. The new item
+      will be optimistically added to the list in hopes that the server accepts
+      the item. If it does, the list is refetched with the true items from the
+      list. Every now and then, the mutation may fail though. When that happens,
+      the previous list of items is restored and the list is again refetched
+      from the server.
     </p>
 
-    <hr/>
-   @if(tasks.isLoading()){
-    <p>Loading...</p>
-  } 
-  
-  <div class="container">
-  <label>
-    <input type="checkbox" [(ngModel)]="failMutation" />
-    Fail Mutation
-  </label>
-
-  <div class="input-container">
-    <input type="text" [(ngModel)]="newItem" placeholder="Enter text" />
-    <button (click)="addItem()">Create</button>
-  <ul>
-      @for(task of tasks.data(); track task){
-        <li>{{task}}</li>
-      }
-    </ul>
+    <hr />
+    @if (tasks.isLoading()) {
+      <p>Loading...</p>
+    }
 
-    <div>
-        Updated At: {{tasks.dataUpdatedAt() | date:	'MMMM d, h:mm:ss a '}}
-    </div>
+    <div class="container">
+      <label>
+        <input type="checkbox" [(ngModel)]="failMutation" />
+        Fail Mutation
+      </label>
 
-    
-  </div>
-    @if(!tasks.isLoading() && tasks.isFetching()){
-      <p>Fetching in background</p>
-    }
+      <div class="input-container">
+        <input type="text" [(ngModel)]="newItem" placeholder="Enter text" />
+        <button (click)="addItem()">Create</button>
+        <ul>
+          @for (task of tasks.data(); track task) {
+            <li>{{ task }}</li>
+          }
+        </ul>
 
+        <div>
+          Updated At: {{ tasks.dataUpdatedAt() | date: 'MMMM d, h:mm:ss a ' }}
+        </div>
+      </div>
+      @if (!tasks.isLoading() && tasks.isFetching()) {
+        <p>Fetching in background</p>
+      }
+    </div>
   `,
-  styles: ``
+  styles: ``,
 })
 export class OptimisticUpdatesComponent {
+  #tasksService = inject(TasksService)
 
-  #tasksService = inject(TasksService);
-
-  tasks = (() => injectQuery(() => this.#tasksService.allTasks()))();
+  tasks = (() => injectQuery(() => this.#tasksService.allTasks()))()
   clearMutation = injectMutation(() => this.#tasksService.addTask())
   addMutation = injectMutation(() => this.#tasksService.addTask())
 
-
   newItem = ''
-  failMutation = false;
+  failMutation = false
 
   addItem() {
-    if (!this.newItem) return;
-
-    this.addMutation.mutate({ task: this.newItem, failMutation: this.failMutation });
-    this.newItem = '';
+    if (!this.newItem) return
 
+    this.addMutation.mutate({
+      task: this.newItem,
+      failMutation: this.failMutation,
+    })
+    this.newItem = ''
   }
-
 }
diff --git a/examples/angular/optimistic-updates/src/app/interceptor/mock-api.interceptor.ts b/examples/angular/optimistic-updates/src/app/interceptor/mock-api.interceptor.ts
index 468c92d14b..27ce51428f 100644
--- a/examples/angular/optimistic-updates/src/app/interceptor/mock-api.interceptor.ts
+++ b/examples/angular/optimistic-updates/src/app/interceptor/mock-api.interceptor.ts
@@ -26,12 +26,19 @@ export const mockInterceptor: HttpInterceptorFn = (
       case 'GET':
         return respondWith(
           200,
-          JSON.parse(sessionStorage.getItem('optimistic-updates-tasks') || '[]'),
+          JSON.parse(
+            sessionStorage.getItem('optimistic-updates-tasks') || '[]',
+          ),
         )
       case 'POST':
-        const tasks = JSON.parse(sessionStorage.getItem('optimistic-updates-tasks') || '[]')
+        const tasks = JSON.parse(
+          sessionStorage.getItem('optimistic-updates-tasks') || '[]',
+        )
         tasks.push(req.body)
-        sessionStorage.setItem('optimistic-updates-tasks', JSON.stringify(tasks))
+        sessionStorage.setItem(
+          'optimistic-updates-tasks',
+          JSON.stringify(tasks),
+        )
         return respondWith(201, {
           status: 'success',
           task: req.body,
@@ -42,7 +49,6 @@ export const mockInterceptor: HttpInterceptorFn = (
     return respondWith(500, {
       status: 'error',
     })
-
   }
 
   return next(req)
diff --git a/examples/angular/optimistic-updates/src/app/services/tasks.service.ts b/examples/angular/optimistic-updates/src/app/services/tasks.service.ts
index 840ee83525..d9a2d62428 100644
--- a/examples/angular/optimistic-updates/src/app/services/tasks.service.ts
+++ b/examples/angular/optimistic-updates/src/app/services/tasks.service.ts
@@ -33,27 +33,39 @@ export class TasksService {
    */
   addTask() {
     return mutationOptions({
-      mutationFn: ({ task, failMutation = false }: { task: string; failMutation: boolean }) =>
-        lastValueFrom(this.#http.post(`/api/tasks${failMutation ? '-wrong-url' : ''}`, task)),
+      mutationFn: ({
+        task,
+        failMutation = false,
+      }: {
+        task: string
+        failMutation: boolean
+      }) =>
+        lastValueFrom(
+          this.#http.post(
+            `/api/tasks${failMutation ? '-wrong-url' : ''}`,
+            task,
+          ),
+        ),
       mutationKey: ['tasks'],
       onSuccess: () => {
         this.#queryClient.invalidateQueries({ queryKey: ['tasks'] })
       },
       onMutate: async ({ task }) => {
-
         // Cancel any outgoing refetches
         // (so they don't overwrite our optimistic update)
         await this.#queryClient.cancelQueries({ queryKey: ['tasks'] })
 
         // Snapshot the previous value
-        const previousTodos = this.#queryClient.getQueryData<Array<string>>(['tasks'])
+        const previousTodos = this.#queryClient.getQueryData<Array<string>>([
+          'tasks',
+        ])
 
         // Optimistically update to the new value
         if (previousTodos) {
-          this.#queryClient.setQueryData<Array<string>>(['tasks'], [
-            ...previousTodos,
-            task,
-          ])
+          this.#queryClient.setQueryData<Array<string>>(
+            ['tasks'],
+            [...previousTodos, task],
+          )
         }
 
         return previousTodos
@@ -69,5 +81,4 @@ export class TasksService {
       },
     })
   }
-
 }
diff --git a/examples/angular/optimistic-updates/src/main.ts b/examples/angular/optimistic-updates/src/main.ts
index 76a137dffb..c3d8f9af99 100644
--- a/examples/angular/optimistic-updates/src/main.ts
+++ b/examples/angular/optimistic-updates/src/main.ts
@@ -2,5 +2,4 @@ import { bootstrapApplication } from '@angular/platform-browser'
 import { appConfig } from './app/app.config'
 import { AppComponent } from './app/app.component'
 
-bootstrapApplication(AppComponent, appConfig)
-  .catch((err) => console.error(err))
+bootstrapApplication(AppComponent, appConfig).catch((err) => console.error(err))
diff --git a/examples/react/playground/src/styles.css b/examples/react/playground/src/styles.css
index 56feea6223..d0879a6492 100644
--- a/examples/react/playground/src/styles.css
+++ b/examples/react/playground/src/styles.css
@@ -1,9 +1,9 @@
 body {
   margin: 0;
   padding: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
+    'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
+    'Helvetica Neue', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: white;
diff --git a/examples/react/react-router/src/index.css b/examples/react/react-router/src/index.css
index 76d737e30f..e4026144df 100644
--- a/examples/react/react-router/src/index.css
+++ b/examples/react/react-router/src/index.css
@@ -8,9 +8,9 @@ html {
 }
 
 body {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
+    'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
+    'Helvetica Neue', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
diff --git a/examples/svelte/playground/src/app.css b/examples/svelte/playground/src/app.css
index 56feea6223..d0879a6492 100644
--- a/examples/svelte/playground/src/app.css
+++ b/examples/svelte/playground/src/app.css
@@ -1,9 +1,9 @@
 body {
   margin: 0;
   padding: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
+    'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
+    'Helvetica Neue', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: white;
diff --git a/packages/query-devtools/src/Devtools.tsx b/packages/query-devtools/src/Devtools.tsx
index aac57a55b4..df1f4e64e3 100644
--- a/packages/query-devtools/src/Devtools.tsx
+++ b/packages/query-devtools/src/Devtools.tsx
@@ -1622,7 +1622,10 @@ const QueryStatus: Component<QueryStatusProps> = (props) => {
           css`
             cursor: pointer;
             &:hover {
-              background: ${t(colors.gray[200], colors.darkGray[400])}${alpha[80]};
+              background: ${t(
+                  colors.gray[200],
+                  colors.darkGray[400],
+                )}${alpha[80]};
             }
           `,
         'tsqd-query-status-tag',