From dc1ed8ffeea21b1a8c954d80cd3531f78b898d7c Mon Sep 17 00:00:00 2001
From: akastijn <akastijn@alttd.com>
Date: Sat, 27 Dec 2025 21:22:05 +0100
Subject: [PATCH] use inject, adjust properties order

---
 .../properties/properties.component.html      | 22 +++++++++----------
 .../properties/properties.component.ts        |  9 +++-----
 2 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/frontend/src/app/pages/particles/components/properties/properties.component.html b/frontend/src/app/pages/particles/components/properties/properties.component.html
index 31bb77a..a59ab76 100644
--- a/frontend/src/app/pages/particles/components/properties/properties.component.html
+++ b/frontend/src/app/pages/particles/components/properties/properties.component.html
@@ -15,6 +15,17 @@
         </mat-form-field>
       </div>
 
+      <div class="form-row">
+        <mat-form-field appearance="outline">
+          <mat-label>Permission name</mat-label>
+          <input matInput [(ngModel)]="particleData.permission" placeholder="Enter permission">
+        </mat-form-field>
+        <mat-form-field appearance="outline">
+          <mat-label>Package name</mat-label>
+          <input matInput [(ngModel)]="particleData.package_permission" placeholder="Enter package permission">
+        </mat-form-field>
+      </div>
+
       <div class="form-row">
         <mat-form-field appearance="outline">
           <mat-label>Particle Type</mat-label>
@@ -37,17 +48,6 @@
         </mat-form-field>
       </div>
 
-      <div class="form-row">
-        <mat-form-field appearance="outline">
-          <mat-label>Permission name</mat-label>
-          <input matInput [(ngModel)]="particleData.permission" placeholder="Enter permission">
-        </mat-form-field>
-        <mat-form-field appearance="outline">
-          <mat-label>Package name</mat-label>
-          <input matInput [(ngModel)]="particleData.package_permission" placeholder="Enter package permission">
-        </mat-form-field>
-      </div>
-
       <div class="form-row">
         <mat-form-field appearance="outline">
           <mat-label>Random Offset</mat-label>
diff --git a/frontend/src/app/pages/particles/components/properties/properties.component.ts b/frontend/src/app/pages/particles/components/properties/properties.component.ts
index 9586142..1747e39 100644
--- a/frontend/src/app/pages/particles/components/properties/properties.component.ts
+++ b/frontend/src/app/pages/particles/components/properties/properties.component.ts
@@ -1,4 +1,4 @@
-import {Component} from '@angular/core';
+import {Component, inject} from '@angular/core';
 import {MatCard, MatCardContent, MatCardHeader, MatCardTitle} from "@angular/material/card";
 import {MatCheckbox} from "@angular/material/checkbox";
 import {MatFormField, MatInput, MatLabel} from "@angular/material/input";
@@ -24,17 +24,14 @@ import {ParticleManagerService} from '../../services/particle-manager.service';
     MatSelect,
     ReactiveFormsModule,
     FormsModule
-],
+  ],
   templateUrl: './properties.component.html',
   styleUrl: './properties.component.scss'
 })
 export class PropertiesComponent {
   public particleTypes = Object.values(ParticleType);
 
-  constructor(
-    private particleManagerService: ParticleManagerService,
-  ) {
-  }
+  private readonly particleManagerService = inject(ParticleManagerService);
 
   public get particleData(): ParticleData {
     return this.particleManagerService.getParticleData();