fix navbar toggle button in mobile size

[ct-krisha]

Commit Checklist

• Remove UNUSED comment code
• Remove any logging like console.log
• Remove all warnings and errors while build
• Check vulnerabilities
• Make sure build for production is working. Try running command for prod build in local.
• Fix prettier: npx prettier --write .
• Fix eslint: npx eslint src\ --fix command
• Push package.lock only if you used npm, push yarn.lock only if you used yarn. NPM will udpate both lock file so make sure you dont push yarn.lock updated by NPM
• WCAG

General

• Follow import structure. module/third-party/files/component/style/types/asset
• Try to use theme for design like palette, typography, variant, components, etc. (don't use custom color code anyhow)
• Before adding custom style follow our pre-built components/elements

[phoenixcoded20]

{
"file": "src/app/theme/layout/admin/admin.component.ts",
"approved": false,

"issues": [
{
"type": "bug",
"severity": "medium",
"description": "The condition to dismiss the mobile navigation is not properly handled. The variable 'this.navCollapsedMob' is set to false, but the class 'mob-open' is not removed from the navigation element when closing the menu.",
"recommendedFix": "Ensure that the class 'mob-open' is removed when 'navCollapsedMob' is set to false in the closeMenu method.",
"codeFix": "document.querySelector('app-navigation.pcoded-navbar')?.classList.remove('mob-open');"
}
]
}

[phoenixcoded20]

{
"file": "src/app/theme/layout/admin/nav-bar/nav-bar.component.ts",
"approved": false,

"issues": [
{
"type": "bug",
"severity": "high",
"description": "The output import from '@angular/core' is incorrect. It should be Output with an uppercase 'O'.",
"recommendedFix": "Change output to Output in the import statement.",
"codeFix": "import { Component, Output, HostListener } from '@angular/core';"
}
]
}

[phoenixcoded20]

{
"file": "src/app/theme/layout/admin/navigation/nav-content/nav-item/nav-item.component.ts",
"approved": false,

"issues": [
{
"type": "best-practice",
"severity": "medium",
"description": "Directly manipulating the DOM and using query selectors can lead to issues with maintainability and performance in a React application. It's recommended to manage state and use refs instead.",
"recommendedFix": "Refactor to use React refs or state to handle active classes and mobile navigation toggling instead of directly manipulating the DOM.",
"codeFix": "jsx\nif (navRef.current?.classList.contains('mob-open')) {\n // Assuming you have a reference to mobile-collapse1\n mobileCollapseRef.current?.click();\n}\n"
}
]
}