fix: correct Angular lifecycle hook naming in login component

[aditikshetty]

Description

Fixed Angular lifecycle hook naming issue in login component.

Changes Made

• Replaced incorrect AfterViewInit method with proper Angular lifecycle hook ngAfterViewInit
• Added AfterViewInit interface implementation

Why

Angular lifecycle hooks must follow Angular naming conventions to execute correctly.

Summary by CodeRabbit

• Bug Fixes
  • Improved focus handling on the login form to ensure the input field is properly focused when the page loads.

[coderabbitai]

📝 Walkthrough

Walkthrough

LoginComponent now properly implements the Angular AfterViewInit lifecycle hook to focus the login input element after view initialization. The class signature is updated to declare the interface implementation, the core import is adjusted for consistency, and the ngAfterViewInit() method replaces a previous non-standard approach to handle post-view-init logic.

Changes

Angular Lifecycle Hook Integration

Layer / File(s)	Summary
Interface Contract & Import src/app/app-modules/login/login.component.ts	@angular/core import formatting adjusted; LoginComponent class signature updated to implement AfterViewInit in addition to OnInit.
Lifecycle Method Implementation src/app/app-modules/login/login.component.ts	Standard ngAfterViewInit(): void lifecycle hook implemented to call .focus() on the referenced @ViewChild element.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 A focus so keen, a hook so divine,
The lifecycle flows with precision so fine,
AfterViewInit takes the stage with grace,
The input now glows in its proper place!

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: correcting Angular lifecycle hook naming from 'AfterViewInit' to 'ngAfterViewInit' in the login component.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

Tip

💬 Introducing Slack Agent: The best way for teams to turn conversations into code.

Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.

• Generate code and open pull requests
• Plan features and break down work
• Investigate incidents and troubleshoot customer tickets together
• Automate recurring tasks and respond to alerts with triggers
• Summarize progress and report instantly

Built for teams:

• Shared memory across your entire org—no repeating context
• Per-thread sandboxes to safely plan and execute work
• Governance built-in—scoped access, auditability, and budget controls

One agent for your entire SDLC. Right inside Slack.

👉 Get started

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/app/app-modules/login/login.component.ts`:
- Line 23: The Angular core import is misformatted for Prettier; update the
import of Component, OnInit, AfterViewInit, ViewChild, and ElementRef so it
follows project Prettier rules (single quotes, semicolon, consistent spacing
inside braces and line length) — i.e., make the import statement for these
symbols from '@angular/core' use a single well-formatted line like: import {
Component, OnInit, AfterViewInit, ViewChild, ElementRef } from '@angular/core';
ensuring spacing, single quotes, and trailing semicolon conform to the repo
Prettier settings.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: e82a39aa-b4cb-4485-b5f7-20de809de49b

📥 Commits

Reviewing files that changed from the base of the PR and between c3f1230 and 1704a12.

📒 Files selected for processing (1)

• src/app/app-modules/login/login.component.ts

[coderabbitai]

⚠️ Potential issue | 🟡 Minor | ⚡ Quick win

Fix Prettier formatting for Angular core import (currently lint-failing).

This import style is failing prettier/prettier and may block CI.

Suggested fix

-import {Component,OnInit,AfterViewInit,ViewChild,ElementRef} from '@angular/core';
+import {
+  Component,
+  OnInit,
+  AfterViewInit,
+  ViewChild,
+  ElementRef,
+} from '@angular/core';

As per coding guidelines, src/**/*.{ts,html,scss,css,json}: Use Prettier formatting with 2-space tabs, single quotes, semicolons, 80 character width, and ES5 trailing commas.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	import {Component,OnInit,AfterViewInit,ViewChild,ElementRef} from '@angular/core';
	import {
	Component,
	OnInit,
	AfterViewInit,
	ViewChild,
	ElementRef,
	} from '@angular/core';

🧰 Tools

🪛 ESLint

[error] 23-23: Replace Component,OnInit,AfterViewInit,ViewChild,ElementRef with ⏎··Component,⏎··OnInit,⏎··AfterViewInit,⏎··ViewChild,⏎··ElementRef,⏎

(prettier/prettier)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/app/app-modules/login/login.component.ts` at line 23, The Angular core
import is misformatted for Prettier; update the import of Component, OnInit,
AfterViewInit, ViewChild, and ElementRef so it follows project Prettier rules
(single quotes, semicolon, consistent spacing inside braces and line length) —
i.e., make the import statement for these symbols from '@angular/core' use a
single well-formatted line like: import { Component, OnInit, AfterViewInit,
ViewChild, ElementRef } from '@angular/core'; ensuring spacing, single quotes,
and trailing semicolon conform to the repo Prettier settings.