refactor: remove flex-layout dependency

EdricChan03 · EdricChan03 · commit 276948908736 · 2026-01-13T13:52:02.000+08:00
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -19,7 +19,6 @@
     "@angular/compiler": "^15.2.10",
     "@angular/core": "^15.2.10",
     "@angular/fire": "^7.6.1",
-    "@angular/flex-layout": "^15.0.0-beta.42",
     "@angular/forms": "^15.2.10",
     "@angular/material": "^15.2.9",
     "@angular/platform-browser": "^15.2.10",
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -18,7 +18,6 @@ import {
   provideRemoteConfig,
 } from '@angular/fire/remote-config';
 
-import { FlexLayoutModule } from '@angular/flex-layout';
 import {
   UntypedFormControl,
   FormsModule,
@@ -106,7 +105,6 @@ function minItemsValidationMessage(err, field: FormlyFieldConfig) {
     MaterialModule,
     AppRoutingModule,
     HttpClientModule,
-    FlexLayoutModule,
     provideFirebaseApp(() => initializeApp(environment.firebase)),
     provideAnalytics(() => {
       const analytics = getAnalytics();
diff --git a/src/app/components/empty-state/empty-state.module.ts b/src/app/components/empty-state/empty-state.module.ts
@@ -1,6 +1,5 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { FlexModule } from '@angular/flex-layout';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { RouterModule } from '@angular/router';
@@ -16,7 +15,6 @@ const MATERIAL_MODULES = [
   exports: [EmptyStateComponent],
   imports: [
     CommonModule,
-    FlexModule,
     RouterModule,
     MATERIAL_MODULES
   ]
diff --git a/src/app/components/toolbar/toolbar.module.ts b/src/app/components/toolbar/toolbar.module.ts
@@ -1,6 +1,5 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatMenuModule } from '@angular/material/menu';
@@ -24,7 +23,6 @@ const MATERIAL_MODULES = [
   exports: [ToolbarComponent],
   imports: [
     CommonModule,
-    FlexLayoutModule,
     SharedModule,
     RouterModule,
     MATERIAL_MODULES
diff --git a/src/app/core/dialogs/dialogs.module.ts b/src/app/core/dialogs/dialogs.module.ts
@@ -1,7 +1,6 @@
 import { PortalModule } from '@angular/cdk/portal';
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { FlexModule } from '@angular/flex-layout';
 import { FormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatDialogModule } from '@angular/material/dialog';
@@ -34,7 +33,6 @@ const MATERIAL_MODULES = [
   imports: [
     CommonModule,
     FormsModule,
-    FlexModule,
     PortalModule,
     MATERIAL_MODULES
   ]
diff --git a/src/app/dialogs/dialogs.module.ts b/src/app/dialogs/dialogs.module.ts
@@ -1,6 +1,5 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCheckboxModule } from '@angular/material/checkbox';
@@ -47,7 +46,6 @@ const DIALOGS = [
 @NgModule({
   imports: [
     CommonModule,
-    FlexLayoutModule,
     FormsModule,
     ReactiveFormsModule,
     MATERIAL_MODULES,
diff --git a/src/app/pages/auth/login/login.module.ts b/src/app/pages/auth/login/login.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCardModule } from '@angular/material/card';
@@ -27,7 +26,6 @@ const MATERIAL_MODULES = [
     CommonModule,
     FormsModule,
     ReactiveFormsModule,
-    FlexLayoutModule,
     MATERIAL_MODULES,
     LoginRoutingModule
   ]
diff --git a/src/app/pages/auth/register/register.module.ts b/src/app/pages/auth/register/register.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { FlexModule } from '@angular/flex-layout/flex';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCardModule } from '@angular/material/card';
@@ -18,7 +17,6 @@ import { RegisterRoutingModule } from './register-routing.module';
     CommonModule,
     FormsModule,
     ReactiveFormsModule,
-    FlexModule,
     MatButtonModule,
     MatCardModule,
     MatFormFieldModule,
diff --git a/src/app/pages/auth/reset-password/reset-password.module.ts b/src/app/pages/auth/reset-password/reset-password.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { FlexModule } from '@angular/flex-layout/flex';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCardModule } from '@angular/material/card';
@@ -18,7 +17,6 @@ import { ResetPasswordComponent } from './reset-password.component';
     CommonModule,
     FormsModule,
     ReactiveFormsModule,
-    FlexModule,
     MatButtonModule,
     MatCardModule,
     MatFormFieldModule,
diff --git a/src/app/pages/develop/develop.module.ts b/src/app/pages/develop/develop.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { FormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatDividerModule } from '@angular/material/divider';
@@ -31,7 +30,6 @@ const MATERIAL_MODULES = [
   imports: [
     CommonModule,
     FormsModule,
-    FlexLayoutModule,
     MATERIAL_MODULES,
     SharedModule,
     DevelopRoutingModule
diff --git a/src/app/pages/settings/components/settings-dialogs/settings-dialogs.module.ts b/src/app/pages/settings/components/settings-dialogs/settings-dialogs.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { FormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatDialogModule } from '@angular/material/dialog';
@@ -33,8 +32,7 @@ const MATERIAL_MODULES = [
   imports: [
     CommonModule,
     FormsModule,
-    MATERIAL_MODULES,
-    FlexLayoutModule
+    MATERIAL_MODULES
   ],
   exports: [SETTINGS_DIALOGS]
 })
diff --git a/src/app/pages/settings/panels/settings-panels.module.ts b/src/app/pages/settings/panels/settings-panels.module.ts
@@ -1,7 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RemoteConfigModule } from '@angular/fire/remote-config';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCheckboxModule } from '@angular/material/checkbox';
@@ -51,7 +50,6 @@ const ANGULAR_FIRE_MODULES = [
     CommonModule,
     MATERIAL_MODULES,
     ANGULAR_FIRE_MODULES,
-    FlexLayoutModule,
     FormsModule,
     ReactiveFormsModule,
     SettingsListModule,
diff --git a/src/app/pages/settings/settings.module.ts b/src/app/pages/settings/settings.module.ts
@@ -1,6 +1,5 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCardModule } from '@angular/material/card';
 import { MatIconModule } from '@angular/material/icon';
@@ -25,7 +24,6 @@ const MATERIAL_MODULES = [
   ],
   imports: [
     CommonModule,
-    FlexLayoutModule,
     MATERIAL_MODULES,
     DialogsModule,
     SettingsRoutingModule
diff --git a/src/app/shared/formly/custom-formly.module.ts b/src/app/shared/formly/custom-formly.module.ts
@@ -1,6 +1,5 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { FlexLayoutModule } from '@angular/flex-layout';
 import { MatButtonModule } from '@angular/material/button';
 import { MatExpansionModule } from '@angular/material/expansion';
 import { MatIconModule } from '@angular/material/icon';
@@ -34,7 +33,6 @@ const MATERIAL_MODULES = [
   ],
   imports: [
     CommonModule,
-    FlexLayoutModule,
     FormlyModule.forChild({
       wrappers: [
         { name: 'panel', component: PanelWrapperComponent }
