refactor(GoogleSignInButton): Convert to standalone (#1823)

WISE-Community · Jun 5, 2024 · c58cd47 · c58cd47
1 parent 68b3c4e
commit c58cd47
Show file tree

Hide file tree

Showing 10 changed files with 16 additions and 29 deletions.
diff --git a/src/app/login/login.module.ts b/src/app/login/login.module.ts
@@ -12,7 +12,6 @@ import { MatDividerModule } from '@angular/material/divider';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
-import { GoogleSignInModule } from '../modules/google-sign-in/google-sign-in.module';
 
 const materialModules = [
   MatButtonModule,
@@ -28,7 +27,6 @@ const materialModules = [
     CommonModule,
     FlexLayoutModule,
     FormsModule,
-    GoogleSignInModule,
     LoginRoutingModule,
     ReactiveFormsModule,
     materialModules,

diff --git a/src/app/modules/google-sign-in/google-sign-in-button/google-sign-in-button.component.html b/src/app/modules/google-sign-in/google-sign-in-button/google-sign-in-button.component.html
diff --git a/src/app/modules/google-sign-in/google-sign-in-button/google-sign-in-button.component.ts b/src/app/modules/google-sign-in/google-sign-in-button/google-sign-in-button.component.ts
@@ -15,15 +15,16 @@ import { ConfigService } from '../../../services/config.service';
 import { GoogleUser } from '../GoogleUser';
 
 @Component({
+  encapsulation: ViewEncapsulation.None,
   selector: 'google-sign-in-button',
-  styleUrls: ['google-sign-in-button.component.scss'],
-  templateUrl: 'google-sign-in-button.component.html',
-  encapsulation: ViewEncapsulation.None
+  standalone: true,
+  styleUrl: 'google-sign-in-button.component.scss',
+  template: '<div #googleButton class="googleButton center"></div>'
 })
 export class GoogleSignInButtonComponent implements AfterViewInit {
+  @ViewChild('googleButton') private googleButton: ElementRef;
   @Output() signedIn = new EventEmitter<GoogleUser>();
   @Input() text: string = 'signin_with';
-  @ViewChild('googleButton') private googleButton: ElementRef;
 
   constructor(private configService: ConfigService, private ngZone: NgZone) {}
 

diff --git a/src/app/modules/google-sign-in/google-sign-in.module.ts b/src/app/modules/google-sign-in/google-sign-in.module.ts
diff --git a/src/app/register/register-student/register-student.component.html b/src/app/register/register-student/register-student.component.html
@@ -25,8 +25,7 @@ <h2 class="standalone__title accent" i18n>Create Student Account</h2>
           *ngIf="googleAuthenticationEnabled"
           (signedIn)="googleSignIn($event)"
           text="signup_with"
-        >
-        </google-sign-in-button>
+        />
       </p>
       <p class="center">
         <button

diff --git a/src/app/register/register-teacher/register-teacher.component.html b/src/app/register/register-teacher/register-teacher.component.html
@@ -19,8 +19,7 @@ <h2 class="standalone__title accent" i18n>Create Teacher Account</h2>
           *ngIf="googleAuthenticationEnabled"
           (signedIn)="googleSignIn($event)"
           text="signup_with"
-        >
-        </google-sign-in-button>
+        />
       </p>
       <p class="center">
         <button

diff --git a/src/app/register/register.module.ts b/src/app/register/register.module.ts
@@ -20,7 +20,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { MatSelectModule } from '@angular/material/select';
-import { GoogleSignInModule } from '../modules/google-sign-in/google-sign-in.module';
+import { GoogleSignInButtonComponent } from '../modules/google-sign-in/google-sign-in-button/google-sign-in-button.component';
 import { PasswordModule } from '../password/password.module';
 import { RegisterMicrosoftUserAlreadyExistsComponent } from './register-microsoft-user-already-exists/register-microsoft-user-already-exists.component';
 import { CallToActionComponent } from '../modules/shared/call-to-action/call-to-action.component';
@@ -41,7 +41,7 @@ const materialModules = [
     CallToActionComponent,
     CommonModule,
     FormsModule,
-    GoogleSignInModule,
+    GoogleSignInButtonComponent,
     SharedModule,
     PasswordModule,
     RegisterRoutingModule,

diff --git a/src/app/student/student.module.ts b/src/app/student/student.module.ts
@@ -36,15 +36,15 @@ import { EditComponent } from './account/edit/edit.component';
 import { StudentEditProfileComponent } from './account/edit-profile/edit-profile.component';
 import { TimelineModule } from '../modules/timeline/timeline.module';
 import { TeamSignInDialogComponent } from './team-sign-in-dialog/team-sign-in-dialog.component';
-import { GoogleSignInModule } from '../modules/google-sign-in/google-sign-in.module';
+import { GoogleSignInButtonComponent } from '../modules/google-sign-in/google-sign-in-button/google-sign-in-button.component';
 import { SearchBarComponent } from '../modules/shared/search-bar/search-bar.component';
 
 @NgModule({
   imports: [
     CommonModule,
     FlexLayoutModule,
     FormsModule,
-    GoogleSignInModule,
+    GoogleSignInButtonComponent,
     ReactiveFormsModule,
     materialModules,
     SearchBarComponent,

diff --git a/src/app/student/team-sign-in-dialog/team-sign-in-dialog.component.html b/src/app/student/team-sign-in-dialog/team-sign-in-dialog.component.html
@@ -65,8 +65,7 @@ <h2 mat-dialog-title i18n>Team Sign In</h2>
           [class.center]="!isExistingStudent(teamMember)"
         >
           <p *ngIf="!isExistingStudent(teamMember)" class="mat-subtitle-2">- OR -</p>
-          <google-sign-in-button (signedIn)="googleSignIn($event, teamMember)">
-          </google-sign-in-button>
+          <google-sign-in-button (signedIn)="googleSignIn($event, teamMember)"/>
         </div>
       </ng-container>
     </ng-container>

diff --git a/src/messages.xlf b/src/messages.xlf
@@ -421,7 +421,7 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/student/team-sign-in-dialog/team-sign-in-dialog.component.html</context>
-          <context context-type="linenumber">76</context>
+          <context context-type="linenumber">75</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/teacher/create-run-dialog/create-run-dialog.component.html</context>
@@ -7191,11 +7191,11 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
         <source>Sign up with Microsoft</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/register/register-student/register-student.component.html</context>
-          <context context-type="linenumber">40</context>
+          <context context-type="linenumber">39</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/register/register-teacher/register-teacher.component.html</context>
-          <context context-type="linenumber">34</context>
+          <context context-type="linenumber">33</context>
         </context-group>
       </trans-unit>
       <trans-unit id="b6c571f49a9876275382c366aabd8aac85dbbd8f" datatype="html">
@@ -7828,7 +7828,7 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
         <source> Launch Unit </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/student/team-sign-in-dialog/team-sign-in-dialog.component.html</context>
-          <context context-type="linenumber">77,79</context>
+          <context context-type="linenumber">76,78</context>
         </context-group>
       </trans-unit>
       <trans-unit id="3975065711327151501" datatype="html">