chore: format templates

templates/angular-example/juno.dev.config.js

@@ -1,27 +1,27 @@
-import {defineDevConfig} from '@junobuild/config';
+import { defineDevConfig } from "@junobuild/config";
 
 /** @type {import('@junobuild/config').JunoDevConfig} */
 export default defineDevConfig(() => ({
   satellite: {
     collections: {
       datastore: [
         {
-          collection: 'notes',
-          read: 'managed',
-          write: 'managed',
-          memory: 'stable',
-          mutablePermissions: true
-        }
+          collection: "notes",
+          read: "managed",
+          write: "managed",
+          memory: "stable",
+          mutablePermissions: true,
+        },
       ],
       storage: [
         {
-          collection: 'images',
-          read: 'managed',
-          write: 'managed',
-          memory: 'stable',
-          mutablePermissions: true
-        }
-      ]
-    }
-  }
+          collection: "images",
+          read: "managed",
+          write: "managed",
+          memory: "stable",
+          mutablePermissions: true,
+        },
+      ],
+    },
+  },
 }));

templates/angular-example/src/app/app.component.ts

@@ -1,12 +1,12 @@
-import {Component} from '@angular/core';
-import {initSatellite} from '@junobuild/core';
-import {environment} from '../environments/environment';
-import {HomeComponent} from './components/home/home.component';
+import { Component } from '@angular/core';
+import { initSatellite } from '@junobuild/core';
+import { environment } from '../environments/environment';
+import { HomeComponent } from './components/home/home.component';
 
 @Component({
   selector: 'app-root',
   imports: [HomeComponent],
-  templateUrl: './app.component.html'
+  templateUrl: './app.component.html',
 })
 export class AppComponent {
   title = 'Juno / Angular Example';
@@ -16,8 +16,8 @@ export class AppComponent {
       satelliteId: environment.satelliteId,
       container: environment.container,
       workers: {
-        auth: './assets/workers/auth.worker.js'
-      }
+        auth: './assets/workers/auth.worker.js',
+      },
     });
   }
 }

templates/angular-example/src/app/app.config.ts

@@ -1,8 +1,8 @@
-import {ApplicationConfig} from '@angular/core';
-import {provideRouter} from '@angular/router';
+import { ApplicationConfig } from '@angular/core';
+import { provideRouter } from '@angular/router';
 
-import {routes} from './app.routes';
+import { routes } from './app.routes';
 
 export const appConfig: ApplicationConfig = {
-  providers: [provideRouter(routes)]
+  providers: [provideRouter(routes)],
 };

templates/angular-example/src/app/app.routes.ts

@@ -1,3 +1,3 @@
-import {Routes} from '@angular/router';
+import { Routes } from '@angular/router';
 
 export const routes: Routes = [];

templates/angular-example/src/app/components/auth/auth.component.ts

@@ -1,13 +1,13 @@
-import {NgIf} from '@angular/common';
-import {Component, inject} from '@angular/core';
-import {AuthService} from '../../services/auth.service';
-import {LoginComponent} from '../login/login.component';
-import {LogoutComponent} from '../logout/logout.component';
+import { NgIf } from '@angular/common';
+import { Component, inject } from '@angular/core';
+import { AuthService } from '../../services/auth.service';
+import { LoginComponent } from '../login/login.component';
+import { LogoutComponent } from '../logout/logout.component';
 
 @Component({
   selector: 'app-auth',
   imports: [LoginComponent, LogoutComponent, NgIf],
-  templateUrl: './auth.component.html'
+  templateUrl: './auth.component.html',
 })
 export class AuthComponent {
   private readonly authService = inject(AuthService);

templates/angular-example/src/app/components/backdrop/backdrop.component.html

@@ -1,6 +1,8 @@
 <div
-  class="fixed inset-0 z-40 bg-white/30 dark:bg-lavender-blue-200/40 flex items-center justify-center backdrop-blur-xl">
+  class="dark:bg-lavender-blue-200/40 fixed inset-0 z-40 flex items-center justify-center bg-white/30 backdrop-blur-xl"
+>
   <div
     *ngIf="spinner"
-    class="w-12 h-12 rounded-full animate-spin border-[3px] border-solid border-lavender-blue-600 border-t-transparent"></div>
+    class="border-lavender-blue-600 h-12 w-12 animate-spin rounded-full border-[3px] border-solid border-t-transparent"
+  ></div>
 </div>

templates/angular-example/src/app/components/backdrop/backdrop.component.ts

@@ -1,10 +1,10 @@
-import {NgClass, NgIf} from '@angular/common';
-import {Component, Input} from '@angular/core';
+import { NgClass, NgIf } from '@angular/common';
+import { Component, Input } from '@angular/core';
 
 @Component({
   selector: 'app-backdrop',
   imports: [NgIf, NgClass],
-  templateUrl: './backdrop.component.html'
+  templateUrl: './backdrop.component.html',
 })
 export class BackdropComponent {
   @Input() spinner = false;

templates/angular-example/src/app/components/background/background.component.html

@@ -1,8 +1,10 @@
 <div
-  class="hidden sm:block fixed top-[400px] [@media(min-height:800px)]:top-2/4 right-0 -z-10 translate-x-2/4 lg:translate-x-1/3 -translate-y-2/4 min-h-[800px] h-[100dvh] aspect-square">
+  class="fixed top-[400px] right-0 -z-10 hidden aspect-square h-[100dvh] min-h-[800px] -translate-y-2/4 translate-x-2/4 sm:block lg:translate-x-1/3 [@media(min-height:800px)]:top-2/4"
+>
   <img
     src="/assets/juno_illustration.svg"
     role="presentation"
     loading="lazy"
-    alt="An astronaut floating in space around planet Juno orbited by satellites, stars in the background." />
+    alt="An astronaut floating in space around planet Juno orbited by satellites, stars in the background."
+  />
 </div>

templates/angular-example/src/app/components/background/background.component.ts

@@ -1,8 +1,8 @@
-import {Component} from '@angular/core';
+import { Component } from '@angular/core';
 
 @Component({
   selector: 'app-background',
   imports: [],
-  templateUrl: './background.component.html'
+  templateUrl: './background.component.html',
 })
 export class BackgroundComponent {}

templates/angular-example/src/app/components/button/button.component.html

@@ -1,10 +1,11 @@
 <button
   [disabled]="disabled"
   [ngClass]="[
-    'flex items-center gap-2 border-black dark:border-lavender-blue-500 border-[3px] transition-all rounded-xs py-1 px-8 my-2 font-semibold text-white bg-lavender-blue-500 dark:bg-black shadow-[5px_5px_0px_rgba(0,0,0,1)] dark:shadow-[5px_5px_0px_#7888ff]',
+    'dark:border-lavender-blue-500 bg-lavender-blue-500 my-2 flex items-center gap-2 rounded-xs border-[3px] border-black px-8 py-1 font-semibold text-white shadow-[5px_5px_0px_rgba(0,0,0,1)] transition-all dark:bg-black dark:shadow-[5px_5px_0px_#7888ff]',
     disabled
       ? 'opacity-25'
-      : 'hover:bg-lavender-blue-600 dark:hover:bg-lavender-blue-300 dark:hover:text-black active:bg-lavender-blue-400 dark:active:bg-lavender-blue-500 active:shadow-none active:translate-x-[5px] active:translate-y-[5px]'
-  ]">
+      : 'hover:bg-lavender-blue-600 dark:hover:bg-lavender-blue-300 active:bg-lavender-blue-400 dark:active:bg-lavender-blue-500 active:translate-x-[5px] active:translate-y-[5px] active:shadow-none dark:hover:text-black',
+  ]"
+>
   <ng-content></ng-content>
 </button>

templates/angular-example/src/app/components/button/button.component.ts

@@ -1,10 +1,10 @@
-import {NgClass} from '@angular/common';
-import {Component, Input} from '@angular/core';
+import { NgClass } from '@angular/common';
+import { Component, Input } from '@angular/core';
 
 @Component({
   selector: 'app-button',
   imports: [NgClass],
-  templateUrl: './button.component.html'
+  templateUrl: './button.component.html',
 })
 export class ButtonComponent {
   @Input() disabled!: boolean;

templates/angular-example/src/app/components/delete/delete.component.html

@@ -1,21 +1,31 @@
 <button
   role="cell"
   class="hover:text-lavender-blue-500 active:text-lavender-blue-400"
-  (click)="delItem()">
-  <svg width="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 29 29" fill="currentColor">
+  (click)="delItem()"
+>
+  <svg
+    width="16"
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 29 29"
+    fill="currentColor"
+  >
     <g>
       <rect fill="none" class="opacity-25" width="29" height="29" />
       <path
         fill="none"
-        d="M14.5,6.26H5.19l1.26,17.82c.09,1.21,1.09,2.14,2.3,2.14h11.49c1.21,0,2.22-.94,2.3-2.14l1.26-17.82h-9.31Z" />
+        d="M14.5,6.26H5.19l1.26,17.82c.09,1.21,1.09,2.14,2.3,2.14h11.49c1.21,0,2.22-.94,2.3-2.14l1.26-17.82h-9.31Z"
+      />
       <path
-        d="M26.17,5.26h-6.88v-1.26c0-1.35-1.09-2.44-2.44-2.44h-4.7c-1.35,0-2.44,1.1-2.44,2.44v1.26H2.83c-.55,0-1,.45-1,1s.45,1,1,1h1.43l1.2,16.89c.12,1.72,1.57,3.07,3.3,3.07h11.49c1.73,0,3.18-1.35,3.3-3.07l1.2-16.89h1.43c.55,0,1-.45,1-1s-.45-1-1-1ZM11.71,4c0-.24.2-.44.44-.44h4.7c.24,0,.44.2.44.44v1.26h-5.58v-1.26ZM21.55,24.01c-.05.68-.62,1.21-1.3,1.21h-11.49c-.68,0-1.25-.53-1.3-1.21l-1.18-16.75h16.47l-1.18,16.75Z" />
+        d="M26.17,5.26h-6.88v-1.26c0-1.35-1.09-2.44-2.44-2.44h-4.7c-1.35,0-2.44,1.1-2.44,2.44v1.26H2.83c-.55,0-1,.45-1,1s.45,1,1,1h1.43l1.2,16.89c.12,1.72,1.57,3.07,3.3,3.07h11.49c1.73,0,3.18-1.35,3.3-3.07l1.2-16.89h1.43c.55,0,1-.45,1-1s-.45-1-1-1ZM11.71,4c0-.24.2-.44.44-.44h4.7c.24,0,.44.2.44.44v1.26h-5.58v-1.26ZM21.55,24.01c-.05.68-.62,1.21-1.3,1.21h-11.49c-.68,0-1.25-.53-1.3-1.21l-1.18-16.75h16.47l-1.18,16.75Z"
+      />
       <path
         class="dark:text-black"
-        d="M11.29,8.71c-.55,0-1,.45-1,1v12.81c0,.55.45,1,1,1s1-.45,1-1v-12.81c0-.55-.45-1-1-1Z" />
+        d="M11.29,8.71c-.55,0-1,.45-1,1v12.81c0,.55.45,1,1,1s1-.45,1-1v-12.81c0-.55-.45-1-1-1Z"
+      />
       <path
         class="dark:text-black"
-        d="M17.71,8.71c-.55,0-1,.45-1,1v12.81c0,.55.45,1,1,1s1-.45,1-1v-12.81c0-.55-.45-1-1-1Z" />
+        d="M17.71,8.71c-.55,0-1,.45-1,1v12.81c0,.55.45,1,1,1s1-.45,1-1v-12.81c0-.55-.45-1-1-1Z"
+      />
     </g>
   </svg>
 </button>

templates/angular-example/src/app/components/delete/delete.component.ts

@@ -1,14 +1,14 @@
-import {NgIf} from '@angular/common';
-import {Component, inject, Input} from '@angular/core';
-import {deleteAsset, deleteDoc, Doc} from '@junobuild/core';
-import {DocsService} from '../../services/docs.service';
-import {Note} from '../../types/note';
-import {BackdropComponent} from '../backdrop/backdrop.component';
+import { NgIf } from '@angular/common';
+import { Component, inject, Input } from '@angular/core';
+import { deleteAsset, deleteDoc, Doc } from '@junobuild/core';
+import { DocsService } from '../../services/docs.service';
+import { Note } from '../../types/note';
+import { BackdropComponent } from '../backdrop/backdrop.component';
 
 @Component({
   selector: 'app-delete',
   imports: [BackdropComponent, NgIf],
-  templateUrl: './delete.component.html'
+  templateUrl: './delete.component.html',
 })
 export class DeleteComponent {
   private readonly docsServices = inject(DocsService);
@@ -22,21 +22,21 @@ export class DeleteComponent {
 
     try {
       const {
-        data: {url}
+        data: { url },
       } = this.doc;
 
       if (url !== undefined) {
-        const {pathname: fullPath} = new URL(url);
+        const { pathname: fullPath } = new URL(url);
 
         await deleteAsset({
           collection: 'images',
-          fullPath
+          fullPath,
         });
       }
 
       await deleteDoc({
         collection: 'notes',
-        doc: this.doc
+        doc: this.doc,
       });
 
       await this.docsServices.reload();