diff --git a/templates/angular-example/src/app/components/modal/modal.component.ts b/templates/angular-example/src/app/components/modal/modal.component.ts
index 88260bd..bfad1ae 100644
--- a/templates/angular-example/src/app/components/modal/modal.component.ts
+++ b/templates/angular-example/src/app/components/modal/modal.component.ts
@@ -1,17 +1,17 @@
-import {NgIf} from '@angular/common';
-import {Component, ElementRef, inject, ViewChild} from '@angular/core';
-import {FormBuilder, ReactiveFormsModule} from '@angular/forms';
-import {setDoc, uploadFile, User} from '@junobuild/core';
-import {nanoid} from 'nanoid';
-import {AuthService} from '../../services/auth.service';
-import {DocsService} from '../../services/docs.service';
-import {BackdropComponent} from '../backdrop/backdrop.component';
-import {ButtonComponent} from '../button/button.component';
+import { NgIf } from '@angular/common';
+import { Component, ElementRef, inject, ViewChild } from '@angular/core';
+import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
+import { setDoc, uploadFile, User } from '@junobuild/core';
+import { nanoid } from 'nanoid';
+import { AuthService } from '../../services/auth.service';
+import { DocsService } from '../../services/docs.service';
+import { BackdropComponent } from '../backdrop/backdrop.component';
+import { ButtonComponent } from '../button/button.component';
@Component({
selector: 'app-modal',
imports: [NgIf, BackdropComponent, ReactiveFormsModule, ButtonComponent],
- templateUrl: './modal.component.html'
+ templateUrl: './modal.component.html',
})
export class ModalComponent {
private readonly authService = inject(AuthService);
@@ -22,7 +22,7 @@ export class ModalComponent {
#formBuilder = inject(FormBuilder);
diaryForm = this.#formBuilder.group({
- entry: ''
+ entry: '',
});
showModal = false;
@@ -64,10 +64,10 @@ export class ModalComponent {
if (this.file !== undefined) {
const filename = `${user.key}-${this.file.name}`;
- const {downloadUrl} = await uploadFile({
+ const { downloadUrl } = await uploadFile({
collection: 'images',
data: this.file,
- filename
+ filename,
});
url = downloadUrl;
@@ -81,9 +81,9 @@ export class ModalComponent {
key,
data: {
text: this.diaryForm.value.entry,
- ...(url !== undefined && {url})
- }
- }
+ ...(url !== undefined && { url }),
+ },
+ },
});
}
diff --git a/templates/angular-example/src/app/components/table/table.component.html b/templates/angular-example/src/app/components/table/table.component.html
index cb0f321..d92a3dd 100644
--- a/templates/angular-example/src/app/components/table/table.component.html
+++ b/templates/angular-example/src/app/components/table/table.component.html
@@ -1,34 +1,44 @@
-
+
Entries
-
+ *ngFor="let item of docs(); index as i"
+ >
+
{{ i + 1 }}
- {{ item.data.text }}
-
+
+ {{ item.data.text }}
+
+
+ class="hover:text-lavender-blue-500 active:text-lavender-blue-400"
+ >
diff --git a/templates/angular-example/src/app/components/table/table.component.ts b/templates/angular-example/src/app/components/table/table.component.ts
index 640fcaa..24fe486 100644
--- a/templates/angular-example/src/app/components/table/table.component.ts
+++ b/templates/angular-example/src/app/components/table/table.component.ts
@@ -1,14 +1,14 @@
-import {NgForOf, NgIf} from '@angular/common';
-import {Component, Signal, inject} from '@angular/core';
-import {Doc} from '@junobuild/core';
-import {DocsService} from '../../services/docs.service';
-import {Note} from '../../types/note';
-import {DeleteComponent} from '../delete/delete.component';
+import { NgForOf, NgIf } from '@angular/common';
+import { Component, Signal, inject } from '@angular/core';
+import { Doc } from '@junobuild/core';
+import { DocsService } from '../../services/docs.service';
+import { Note } from '../../types/note';
+import { DeleteComponent } from '../delete/delete.component';
@Component({
selector: 'app-table',
imports: [NgForOf, NgIf, DeleteComponent],
- templateUrl: './table.component.html'
+ templateUrl: './table.component.html',
})
export class TableComponent {
private readonly docsService = inject(DocsService);
diff --git a/templates/angular-example/src/app/services/auth.service.ts b/templates/angular-example/src/app/services/auth.service.ts
index 7283103..6c04ddf 100644
--- a/templates/angular-example/src/app/services/auth.service.ts
+++ b/templates/angular-example/src/app/services/auth.service.ts
@@ -1,14 +1,20 @@
-import {computed, Injectable, Signal, signal, WritableSignal} from '@angular/core';
-import {authSubscribe, User} from '@junobuild/core';
+import {
+ computed,
+ Injectable,
+ Signal,
+ signal,
+ WritableSignal,
+} from '@angular/core';
+import { authSubscribe, User } from '@junobuild/core';
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class AuthService {
user: WritableSignal
= signal(undefined);
readonly signedIn: Signal = computed(
- () => this.user() !== null && this.user() !== undefined
+ () => this.user() !== null && this.user() !== undefined,
);
constructor() {
diff --git a/templates/angular-example/src/app/services/docs.service.ts b/templates/angular-example/src/app/services/docs.service.ts
index ab33756..063ccdf 100644
--- a/templates/angular-example/src/app/services/docs.service.ts
+++ b/templates/angular-example/src/app/services/docs.service.ts
@@ -1,11 +1,17 @@
-import {effect, inject, Injectable, signal, WritableSignal} from '@angular/core';
-import type {Doc} from '@junobuild/core';
-import {listDocs} from '@junobuild/core';
-import type {Note} from '../types/note';
-import {AuthService} from './auth.service';
+import {
+ effect,
+ inject,
+ Injectable,
+ signal,
+ WritableSignal,
+} from '@angular/core';
+import type { Doc } from '@junobuild/core';
+import { listDocs } from '@junobuild/core';
+import type { Note } from '../types/note';
+import { AuthService } from './auth.service';
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class DocsService {
private readonly authService = inject(AuthService);
@@ -14,7 +20,7 @@ export class DocsService {
constructor() {
effect(async () => await this.loadDocs(this.authService.signedIn()), {
- allowSignalWrites: true
+ allowSignalWrites: true,
});
}
@@ -28,8 +34,8 @@ export class DocsService {
return;
}
- const {items} = await listDocs({
- collection: 'notes'
+ const { items } = await listDocs({
+ collection: 'notes',
});
this.docs.set(items);
diff --git a/templates/angular-example/src/environments/environment.prod.ts b/templates/angular-example/src/environments/environment.prod.ts
index 81c7235..addc93b 100644
--- a/templates/angular-example/src/environments/environment.prod.ts
+++ b/templates/angular-example/src/environments/environment.prod.ts
@@ -1,4 +1,4 @@
export const environment = {
satelliteId: undefined,
- container: false
+ container: false,
};
diff --git a/templates/angular-example/src/environments/environment.ts b/templates/angular-example/src/environments/environment.ts
index 5f5c37b..a5e0745 100644
--- a/templates/angular-example/src/environments/environment.ts
+++ b/templates/angular-example/src/environments/environment.ts
@@ -1,4 +1,4 @@
-export const environment: {satelliteId: string; container: boolean} = {
+export const environment: { satelliteId: string; container: boolean } = {
satelliteId: 'jx5yt-yyaaa-aaaal-abzbq-cai',
- container: true
+ container: true,
};
diff --git a/templates/angular-example/src/index.html b/templates/angular-example/src/index.html
index 8afc88b..ce52638 100644
--- a/templates/angular-example/src/index.html
+++ b/templates/angular-example/src/index.html
@@ -15,13 +15,15 @@
href="/assets/fonts/jetbrainsmono-regular.woff2"
as="font"
type="font/woff"
- crossorigin />
+ crossorigin
+ />
+ crossorigin
+ />
diff --git a/templates/angular-example/src/main.ts b/templates/angular-example/src/main.ts
index c8f2cda..3fdb36e 100644
--- a/templates/angular-example/src/main.ts
+++ b/templates/angular-example/src/main.ts
@@ -1,10 +1,12 @@
-import {bootstrapApplication} from '@angular/platform-browser';
-import {AppComponent} from './app/app.component';
-import {appConfig} from './app/app.config';
+import { bootstrapApplication } from '@angular/platform-browser';
+import { AppComponent } from './app/app.component';
+import { appConfig } from './app/app.config';
// Agent-js requires a polyfill 😕
// I've reported this issue multiple times. Hopefully, it will be addressed in the future.
// ERROR ReferenceError: global is not defined
(window as any).global = window;
-bootstrapApplication(AppComponent, appConfig).catch((err) => console.error(err));
+bootstrapApplication(AppComponent, appConfig).catch((err) =>
+ console.error(err),
+);
diff --git a/templates/angular-example/src/styles.css b/templates/angular-example/src/styles.css
index 2537e07..ba53aec 100644
--- a/templates/angular-example/src/styles.css
+++ b/templates/angular-example/src/styles.css
@@ -1,21 +1,21 @@
-@import 'tailwindcss';
+@import "tailwindcss";
@font-face {
- font-family: 'JetBrains Mono';
+ font-family: "JetBrains Mono";
font-style: normal;
font-weight: 400;
- src: url('/assets/fonts/jetbrainsmono-regular.woff2') format('woff2');
+ src: url("/assets/fonts/jetbrainsmono-regular.woff2") format("woff2");
}
@font-face {
- font-family: 'JetBrains Mono';
+ font-family: "JetBrains Mono";
font-style: normal;
font-weight: 800;
- src: url('/assets/fonts/jetbrainsmono-bold.woff2') format('woff2');
+ src: url("/assets/fonts/jetbrainsmono-bold.woff2") format("woff2");
}
@theme {
- --font-display: 'JetBrains Mono', sans-serif;
+ --font-display: "JetBrains Mono", sans-serif;
--color-*: initial;
--color-inherit: inherit;
diff --git a/templates/angular-starter/juno.dev.config.js b/templates/angular-starter/juno.dev.config.js
index a985e4d..2de27da 100644
--- a/templates/angular-starter/juno.dev.config.js
+++ b/templates/angular-starter/juno.dev.config.js
@@ -1,11 +1,11 @@
-import {defineDevConfig} from '@junobuild/config';
+import { defineDevConfig } from "@junobuild/config";
/** @type {import('@junobuild/config').JunoDevConfig} */
export default defineDevConfig(() => ({
satellite: {
collections: {
datastore: [],
- storage: []
- }
- }
+ storage: [],
+ },
+ },
}));
diff --git a/templates/angular-starter/src/app/app.component.ts b/templates/angular-starter/src/app/app.component.ts
index 3a0ca9f..a9fa0c1 100644
--- a/templates/angular-starter/src/app/app.component.ts
+++ b/templates/angular-starter/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 Starter';
@@ -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',
+ },
});
}
}
diff --git a/templates/angular-starter/src/app/app.config.ts b/templates/angular-starter/src/app/app.config.ts
index baf3e0c..e7d665f 100644
--- a/templates/angular-starter/src/app/app.config.ts
+++ b/templates/angular-starter/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)],
};
diff --git a/templates/angular-starter/src/app/app.routes.ts b/templates/angular-starter/src/app/app.routes.ts
index 8b5e5fb..dc39edb 100644
--- a/templates/angular-starter/src/app/app.routes.ts
+++ b/templates/angular-starter/src/app/app.routes.ts
@@ -1,3 +1,3 @@
-import {Routes} from '@angular/router';
+import { Routes } from '@angular/router';
export const routes: Routes = [];
diff --git a/templates/angular-starter/src/app/components/article/article.component.html b/templates/angular-starter/src/app/components/article/article.component.html
index f1cd355..2d73c1c 100644
--- a/templates/angular-starter/src/app/components/article/article.component.html
+++ b/templates/angular-starter/src/app/components/article/article.component.html
@@ -3,9 +3,11 @@
rel="noreferrer noopener"
target="_blank"
[attr.aria-label]="ariaLabel"
- class="group flex flex-col py-3 px-4 border-black dark:border-lavender-blue-500 dark:hover:border-white border-[3px] rounded-sm bg-white dark:bg-black dark:text-white transition-all shadow-[8px_8px_0px_rgba(0,0,0,1)] dark:shadow-[8px_8px_0px_#7888FF] dark:hover:shadow-[8px_8px_0px_#fff] hover:bg-lavender-blue-200 dark:hover:bg-black active:bg-lavender-blue-400 dark:active:bg-black active:shadow-none active:translate-x-[8px] active:translate-y-[8px]">
+ class="group dark:border-lavender-blue-500 hover:bg-lavender-blue-200 active:bg-lavender-blue-400 flex flex-col rounded-sm border-[3px] border-black bg-white px-4 py-3 shadow-[8px_8px_0px_rgba(0,0,0,1)] transition-all active:translate-x-[8px] active:translate-y-[8px] active:shadow-none dark:bg-black dark:text-white dark:shadow-[8px_8px_0px_#7888FF] dark:hover:border-white dark:hover:bg-black dark:hover:shadow-[8px_8px_0px_#fff] dark:active:bg-black"
+>
diff --git a/templates/angular-starter/src/app/components/article/article.component.ts b/templates/angular-starter/src/app/components/article/article.component.ts
index 2dd9fd8..c41950b 100644
--- a/templates/angular-starter/src/app/components/article/article.component.ts
+++ b/templates/angular-starter/src/app/components/article/article.component.ts
@@ -1,9 +1,9 @@
-import {Component, Input} from '@angular/core';
+import { Component, Input } from '@angular/core';
@Component({
selector: 'app-article',
imports: [],
- templateUrl: './article.component.html'
+ templateUrl: './article.component.html',
})
export class ArticleComponent {
@Input() href!: string;
diff --git a/templates/angular-starter/src/app/components/background/background.component.html b/templates/angular-starter/src/app/components/background/background.component.html
index d1fcb63..20acd29 100644
--- a/templates/angular-starter/src/app/components/background/background.component.html
+++ b/templates/angular-starter/src/app/components/background/background.component.html
@@ -1,6 +1,7 @@
+ alt="An astronaut floating in space around planet Juno orbited by satellites, stars in the background."
+/>
diff --git a/templates/angular-starter/src/app/components/background/background.component.ts b/templates/angular-starter/src/app/components/background/background.component.ts
index fa46f48..5a48ef0 100644
--- a/templates/angular-starter/src/app/components/background/background.component.ts
+++ b/templates/angular-starter/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 {}
diff --git a/templates/angular-starter/src/app/components/footer/footer.component.html b/templates/angular-starter/src/app/components/footer/footer.component.html
index 8929724..3238928 100644
--- a/templates/angular-starter/src/app/components/footer/footer.component.html
+++ b/templates/angular-starter/src/app/components/footer/footer.component.html
@@ -1,21 +1,39 @@