chore: adds additional components

.github/workflows/test-build-publish.yaml

@@ -0,0 +1,23 @@
+name: Test build and publish library
+on:
+  push:
+    branches:
+    - main
+  pull_request:
+    branches:
+    - main
+jobs:
+  Explore-GitHub-Actions:
+    runs-on: ubuntu-latest
+    steps:
+      - run: echo "🎉 The job was automatically triggered by a ${{ github.event_name }} event."
+      - run: echo "🐧 This job is now running on a ${{ runner.os }} server hosted by GitHub!"
+      - run: echo "🔎 The name of your branch is ${{ github.ref }} and your repository is ${{ github.repository }}."
+      - name: Check out repository code
+        uses: actions/checkout@v4
+      - run: echo "💡 The ${{ github.repository }} repository has been cloned to the runner."
+      - run: echo "🖥️ The workflow is now ready to test your code on the runner."
+      - name: List files in the repository
+        run: |
+          ls ${{ github.workspace }}
+      - run: echo "🍏 This job's status is ${{ job.status }}."

README.md

@@ -1,4 +1,4 @@
-# NgSupabase
+# ng-supabase
 
 <a alt="Nx logo" href="https://nx.dev" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-logo.png" width="45"></a>
 

apps/demo/src/app/app.config.ts

@@ -10,6 +10,8 @@ import { LogLevel, ALL_SOCIAL_LOGINS } from '@ng-supabase/core';
 // Local.
 import { appRoutes } from './app.routes';
 
+// const ALERT_SOCIAL_LOGIN
+
 export const appConfig: ApplicationConfig = {
   providers: [
     provideRouter(appRoutes),
@@ -18,9 +20,13 @@ export const appConfig: ApplicationConfig = {
       apiUrl: 'https://dzyrspsuxgieqnvgvryp.supabase.co',
       apiKey:
         'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImR6eXJzcHN1eGdpZXFudmd2cnlwIiwicm9sZSI6ImFub24iLCJpYXQiOjE2OTQyMjQ5MDEsImV4cCI6MjAwOTgwMDkwMX0.d8Qqa07RrjW3OSAjSnlubYCXSiHJWW55y9sLN-Rjc6w',
-      mainRoute: '/',
+      routes: {
+        main: '/',
+        setPassword: '/set-password',
+      },
       login: {
         socials: ALL_SOCIAL_LOGINS,
+        // onSocialLogin: ()=>
       },
       logging: {
         logLevel: LogLevel.Debug,

apps/demo/src/app/app.routes.ts

@@ -12,26 +12,38 @@ import { RegisterComponent as BootstrapRegisterComponent } from './bootstrap/reg
 import { SetPasswordComponent as PrimeNgSetPasswordComponent } from './primeng/set-password/set-password.component';
 import { SetPasswordComponent as MaterialSetPasswordComponent } from './material/set-password/set-password.component';
 import { SetPasswordComponent as BootstrapSetPasswordComponent } from './bootstrap/set-password/set-password.component';
+import { ResetPasswordComponent as PrimeNgResetPasswordComponent } from './primeng/reset-password/reset-password.component';
+import { ResetPasswordComponent as MaterialResetPasswordComponent } from './material/reset-password/reset-password.component';
+import { ResetPasswordComponent as BootstrapResetPasswordComponent } from './bootstrap/reset-password/reset-password.component';
 
 export const appRoutes: Routes = [
   { path: '', component: MainComponent },
   { path: 'login', redirectTo: 'primeng/login' },
 
   // PrimeNG routes.
   { path: 'primeng/login', component: PrimeNgLoginComponent },
-  { path: 'primeng/set-password', component: PrimeNgSetPasswordComponent },
   { path: 'primeng/register', component: PrimeNgRegisterComponent },
+  { path: 'primeng/set-password', component: PrimeNgSetPasswordComponent },
+  { path: 'primeng/reset-password', component: PrimeNgResetPasswordComponent },
   // Bootstrap routes.
   { path: 'bootstrap/login', component: BootstrapLoginComponent },
+  { path: 'bootstrap/register', component: BootstrapRegisterComponent },
   {
     path: 'bootstrap/set-password',
     component: BootstrapSetPasswordComponent,
   },
-  { path: 'bootstrap/register', component: BootstrapRegisterComponent },
+  {
+    path: 'bootstrap/reset-password',
+    component: BootstrapResetPasswordComponent,
+  },
   // Material routes.
   { path: 'material/login', component: MaterialLoginComponent },
-  { path: 'material/set-password', component: MaterialSetPasswordComponent },
   { path: 'material/register', component: MaterialRegisterComponent },
+  { path: 'material/set-password', component: MaterialSetPasswordComponent },
+  {
+    path: 'material/reset-password',
+    component: MaterialResetPasswordComponent,
+  },
 
   { path: '**', redirectTo: '' },
 ];

apps/demo/src/app/bootstrap/reset-password/reset-password.component.html

@@ -0,0 +1 @@
+<p>reset-password works!</p>

apps/demo/src/app/bootstrap/reset-password/reset-password.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ResetPasswordComponent } from './reset-password.component';
+
+describe('ResetPasswordComponent', () => {
+  let component: ResetPasswordComponent;
+  let fixture: ComponentFixture<ResetPasswordComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ResetPasswordComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ResetPasswordComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

libs/material/src/lib/material/material.component.ts → apps/demo/src/app/bootstrap/reset-password/reset-password.component.ts

@@ -2,11 +2,11 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 @Component({
-  selector: 'supabase-material',
+  selector: 'ng-supabase-reset-password',
   standalone: true,
   imports: [CommonModule],
-  templateUrl: './material.component.html',
-  styleUrl: './material.component.scss',
+  templateUrl: './reset-password.component.html',
+  styleUrl: './reset-password.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class MaterialComponent {}
+export class ResetPasswordComponent {}

apps/demo/src/app/main/main.component.html

@@ -93,25 +93,34 @@ <h1>
     ></p-button>
 
     <p-button
-      label="Login (via route change)"
+      label="Login"
       class="ml-3"
       routerLink="/primeng/login"
       icon="pi pi-sign-in"
     ></p-button>
 
     <p-button
       class="ml-3"
-      label="Login with popup window"
+      label="Login (popup window)"
       severity="secondary"
       icon="pi pi-external-link"
       [disabled]="true"
     ></p-button>
+
+    <p-button
+      label="Reset password"
+      class="ml-3"
+      routerLink="/primeng/reset-password"
+      severity="warning"
+      icon="pi pi-replay"
+    ></p-button>
   </div>
 
   <h1>
     <i class="pi pi-google text-2xl text-400"></i>
     Material Components
   </h1>
+  <h3 class="text-400">Coming soon...</h3>
   <div class="mb-3">
     <p-button
       label="Sign up for account"
@@ -122,7 +131,7 @@ <h1>
     ></p-button>
 
     <p-button
-      label="Login (via route change)"
+      label="Login"
       class="ml-3"
       routerLink="/material/login"
       icon="pi pi-sign-in"
@@ -131,17 +140,26 @@ <h1>
 
     <p-button
       class="ml-3"
-      label="Login with popup window"
+      label="Login (popup window)"
       severity="secondary"
       icon="pi pi-external-link"
       [disabled]="true"
     ></p-button>
+
+    <p-button
+      label="Reset password"
+      class="ml-3"
+      routerLink="/material/reset-password"
+      severity="warning"
+      icon="pi pi-replay"
+    ></p-button>
   </div>
 
   <h1>
     <i class="pi pi-twitter text-2xl text-400"></i>
     Bootstrap Components
   </h1>
+  <h3 class="text-400">Coming soon...</h3>
   <div class="mb-3">
     <p-button
       label="Sign up for account"
@@ -152,7 +170,7 @@ <h1>
     ></p-button>
 
     <p-button
-      label="Login (via route change)"
+      label="Login"
       class="ml-3"
       routerLink="/bootstrap/login"
       icon="pi pi-sign-in"
@@ -161,11 +179,19 @@ <h1>
 
     <p-button
       class="ml-3"
-      label="Login with popup window"
+      label="Login (popup window)"
       severity="secondary"
       icon="pi pi-external-link"
       [disabled]="true"
     ></p-button>
+
+    <p-button
+      label="Reset password"
+      class="ml-3"
+      routerLink="/bootstrap/reset-password"
+      severity="warning"
+      icon="pi pi-replay"
+    ></p-button>
   </div>
   }
 </main>

apps/demo/src/app/material/reset-password/reset-password.component.html

@@ -0,0 +1 @@
+<p>reset-password works!</p>

apps/demo/src/app/material/reset-password/reset-password.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ResetPasswordComponent } from './reset-password.component';
+
+describe('ResetPasswordComponent', () => {
+  let component: ResetPasswordComponent;
+  let fixture: ComponentFixture<ResetPasswordComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ResetPasswordComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ResetPasswordComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/demo/src/app/material/reset-password/reset-password.component.ts

@@ -0,0 +1,12 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+@Component({
+  selector: 'ng-supabase-reset-password',
+  standalone: true,
+  imports: [CommonModule],
+  templateUrl: './reset-password.component.html',
+  styleUrl: './reset-password.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ResetPasswordComponent {}

apps/demo/src/app/primeng/register/register.component.html

@@ -1 +1 @@
-<p>register works!</p>
+<supabase-register redirectToPath="/primeng/set-password"></supabase-register>

apps/demo/src/app/primeng/register/register.component.scss

@@ -0,0 +1,6 @@
+:host {
+  display: flex;
+  flex: 1;
+  justify-content: center;
+  align-items: center;
+}

apps/demo/src/app/primeng/register/register.component.ts

@@ -1,10 +1,14 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
+// Angular.
 import { CommonModule } from '@angular/common';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+// Supabase.
+import { RegisterComponent as PrimeNgRegisterComponent } from '@ng-supabase/primeng';
 
 @Component({
   selector: 'ng-supabase-register',
   standalone: true,
-  imports: [CommonModule],
+  imports: [CommonModule, PrimeNgRegisterComponent],
   templateUrl: './register.component.html',
   styleUrl: './register.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,

apps/demo/src/app/primeng/reset-password/reset-password.component.html

@@ -0,0 +1,3 @@
+<supabase-reset-password
+  redirectToPath="/primeng/set-password"
+></supabase-reset-password>

apps/demo/src/app/primeng/reset-password/reset-password.component.scss

@@ -0,0 +1,6 @@
+:host {
+  display: flex;
+  flex: 1;
+  justify-content: center;
+  align-items: center;
+}

apps/demo/src/app/primeng/reset-password/reset-password.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ResetPasswordComponent } from './reset-password.component';
+
+describe('ResetPasswordComponent', () => {
+  let component: ResetPasswordComponent;
+  let fixture: ComponentFixture<ResetPasswordComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ResetPasswordComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ResetPasswordComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/demo/src/app/primeng/reset-password/reset-password.component.ts

@@ -0,0 +1,16 @@
+// Angular.
+import { CommonModule } from '@angular/common';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+// Supabase.
+import { ResetPasswordComponent as PrimeNgResetPasswordComponent } from '@ng-supabase/primeng';
+
+@Component({
+  selector: 'ng-supabase-reset-password',
+  standalone: true,
+  imports: [CommonModule, PrimeNgResetPasswordComponent],
+  templateUrl: './reset-password.component.html',
+  styleUrl: './reset-password.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ResetPasswordComponent {}

apps/demo/src/app/toolbar/toolbar.component.html

@@ -5,6 +5,20 @@ <h1 class="m-0 mr-2">ng-supabase</h1>
   </div>
 
   <div class="p-toolbar-group-end">
+    <p-button
+      icon="pi pi-github"
+      [rounded]="true"
+      [text]="true"
+      severity="secondary"
+      [link]="true"
+      (click)="openGitHub()"
+    >
+    </p-button>
+
+    <!-- <a href="https://angular.dev/" target="_blank" rel="noopener noreferrer">
+      <i class="pi pi-github"></i>
+    </a> -->
+
     <p-button
       icon="pi pi-cog"
       [rounded]="true"

apps/demo/src/app/toolbar/toolbar.component.ts

@@ -20,4 +20,8 @@ import { ToolbarModule } from 'primeng/toolbar';
 })
 export class ToolbarComponent {
   @Output() showSettings = new EventEmitter<void>();
+
+  openGitHub(): void {
+    window.open('https://github.com/rustygreen/ng-supabase');
+  }
 }