hashtopolis · gluafamichl · Oct 15, 2025 · Oct 15, 2025
diff --git a/src/app/agents/show-agents/show-agents.component.html b/src/app/agents/show-agents/show-agents.component.html
@@ -1,6 +1,6 @@
 <app-table>
   <app-page-title
-    title="Agents"
+    title="Agents Overview"
     buttontitle="New Agent"
     buttonlink="/agents/new-agent"
     [subbutton]="true"

diff --git a/src/app/agents/show-agents/show-agents.component.ts b/src/app/agents/show-agents/show-agents.component.ts
@@ -9,6 +9,6 @@ import { AutoTitleService } from '@services/shared/autotitle.service';
 })
 export class ShowAgentsComponent {
   constructor(private titleService: AutoTitleService) {
-    this.titleService.set(['Show Agents']);
+    this.titleService.set(['Agents Overview']);
   }
 }
diff --git a/src/app/core/_components/menus/action-menu/action-menu.component.html b/src/app/core/_components/menus/action-menu/action-menu.component.html
@@ -32,22 +32,29 @@
         (click)="onMenuItemClick(item)"
         [class.text-critical]="item.red"
       >
-        <div *ngIf="iconContainsDiscord(item.icon)" style="display: inline; padding-right: 6px">
-          <fa-icon [icon]="faDiscord" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
+        <div class="menu-item-content">
+         <span>
+            <div *ngIf="iconContainsDiscord(item.icon)" style="display: inline; padding-right: 6px">
+              <fa-icon [icon]="faDiscord" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
+            </div>
+            <div *ngIf="iconContainsGithub(item.icon)" style="display: inline; padding-right: 10px">
+              <fa-icon [icon]="faGithub" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
+            </div>
+            <div *ngIf="iconContainsPaperplane(item.icon)" style="display: inline; padding-right: 10px">
+              <fa-icon [icon]="faPaperplane" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
+            </div>
+            <div *ngIf="iconContainsGlobe(item.icon)" style="display: inline; padding-right: 10px">
+              <fa-icon [icon]="faGlobe" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
+            </div>
+            <div *ngIf="iconContainsBook(item.icon)" style="display: inline; padding-right: 10px">
+              <fa-icon [icon]="faBook" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
+            </div>
+            {{ item.label }}
+         </span>
+          <span *ngIf="item.showAddButton" class="menu-item-add-btn">
+            <fa-icon [icon]="faSquarePlus" matTooltip="{{item.tooltipAddButton}}" aria-hidden="true" (click)="onAddMenuItemClick(item); $event.stopPropagation();"></fa-icon>
+          </span>
         </div>
-        <div *ngIf="iconContainsGithub(item.icon)" style="display: inline; padding-right: 10px">
-          <fa-icon [icon]="faGithub" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
-        </div>
-        <div *ngIf="iconContainsPaperplane(item.icon)" style="display: inline; padding-right: 10px">
-          <fa-icon [icon]="faPaperplane" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
-        </div>
-        <div *ngIf="iconContainsGlobe(item.icon)" style="display: inline; padding-right: 10px">
-          <fa-icon [icon]="faGlobe" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
-        </div>
-        <div *ngIf="iconContainsBook(item.icon)" style="display: inline; padding-right: 10px">
-          <fa-icon [icon]="faBook" [style.color]="faIconColor" aria-hidden="true"></fa-icon>
-        </div>
-        {{ item.label }}
       </button>
       <mat-divider *ngIf="!last"></mat-divider>
     </ng-container>

diff --git a/src/app/core/_components/menus/action-menu/action-menu.component.scss b/src/app/core/_components/menus/action-menu/action-menu.component.scss
@@ -0,0 +1,19 @@
+.menu-item-content {
+  display: flex;
+  align-items: center;
+}
+
+.menu-item-add-btn {
+  margin-left: auto;
+  padding-left: 20px;
+  cursor: pointer;
+
+  fa-icon {
+    transition: filter 0.2s, color 0.2s;
+  }
+
+  &:hover fa-icon {
+    filter: brightness(1.3);
+    color: #607d8b;
+  }
+}
diff --git a/src/app/core/_components/menus/action-menu/action-menu.component.ts b/src/app/core/_components/menus/action-menu/action-menu.component.ts
@@ -1,6 +1,6 @@
 import { faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
 import { faGlobe, faPaperPlane } from '@fortawesome/free-solid-svg-icons';
-import { faBook } from '@fortawesome/free-solid-svg-icons';
+import { faBook, faSquarePlus } from '@fortawesome/free-solid-svg-icons';
 import { Subscription } from 'rxjs';
 import { LocalStorageService } from 'src/app/core/_services/storage/local-storage.service';
 
@@ -28,6 +28,7 @@ import { UISettingsUtilityClass } from '@src/app/shared/utils/config';
 @Component({
   selector: 'action-menu',
   templateUrl: './action-menu.component.html',
+  styleUrls: ['./action-menu.component.scss'],
   standalone: false
 })
 export class ActionMenuComponent implements OnInit, AfterViewInit, OnDestroy {
@@ -71,6 +72,7 @@ export class ActionMenuComponent implements OnInit, AfterViewInit, OnDestroy {
   faPaperplane = faPaperPlane;
   faGlobe = faGlobe;
   faBook = faBook;
+  faSquarePlus = faSquarePlus;
 
   isDarkMode = false;
   faIconColor = 'white';
@@ -214,6 +216,21 @@ export class ActionMenuComponent implements OnInit, AfterViewInit, OnDestroy {
     }
   }
 
+  /**
+   * Handles a click on the add menu item.
+   * Navigates internally or externally based on menuItem properties,
+   * or emits an event for custom handling.
+   * Closes the menu afterward.
+   * @param menuItem The clicked ActionMenuItem
+   */
+  onAddMenuItemClick(menuItem: ActionMenuItem): void {
+    if (menuItem.routerLinkAdd && !menuItem.external) {
+      this.router.navigate(menuItem.routerLinkAdd).then(() => {
+        this.closeMenuIfOpen();
+      });
+    }
+  }
+
   /**
    * Closes the menu if it is currently open.
    */

diff --git a/src/app/core/_components/menus/action-menu/action-menu.model.ts b/src/app/core/_components/menus/action-menu/action-menu.model.ts
@@ -10,4 +10,7 @@ export interface ActionMenuItem {
   red?: boolean;
   routerLink?: string[];
   external?: boolean;
+  showAddButton?: boolean;
+  routerLinkAdd?: string[];
+  tooltipAddButton?: string;
 }
diff --git a/src/app/layout/header/header.component.ts b/src/app/layout/header/header.component.ts
@@ -149,7 +149,10 @@ export class HeaderComponent implements OnInit, OnDestroy {
     const agentActions = [
       {
         label: HeaderMenuLabel.SHOW_AGENTS,
-        routerLink: ['agents', 'show-agents']
+        routerLink: ['agents', 'show-agents'],
+        showAddButton: true,
+        routerLinkAdd: ['agents', 'new-agent'],
+        tooltipAddButton: 'New Agent'
       }
     ];
 
@@ -158,7 +161,10 @@ export class HeaderComponent implements OnInit, OnDestroy {
     if (canReadAgentStats) {
       agentActions.push({
         label: HeaderMenuLabel.AGENT_STATUS,
-        routerLink: ['agents', 'agent-status']
+        routerLink: ['agents', 'agent-status'],
+        showAddButton: false,
+        routerLinkAdd: [],
+        tooltipAddButton: ''
       });
     }
 
@@ -183,15 +189,24 @@ export class HeaderComponent implements OnInit, OnDestroy {
     const taskActions = [
       {
         label: HeaderMenuLabel.SHOW_TASKS,
-        routerLink: ['tasks', 'show-tasks']
+        routerLink: ['tasks', 'show-tasks'],
+        showAddButton: true,
+        routerLinkAdd: ['tasks', 'new-task'],
+        tooltipAddButton: 'New Task'
       },
       {
         label: HeaderMenuLabel.PRECONFIGURED_TASKS,
-        routerLink: ['tasks', 'preconfigured-tasks']
+        routerLink: ['tasks', 'preconfigured-tasks'],
+        showAddButton: true,
+        routerLinkAdd: ['tasks', 'new-preconfigured-tasks'],
+        tooltipAddButton: 'New Preconfigured Task'
       },
       {
         label: HeaderMenuLabel.SUPERTASKS,
-        routerLink: ['tasks', 'supertasks']
+        routerLink: ['tasks', 'supertasks'],
+        showAddButton: true,
+        routerLinkAdd: ['tasks', 'new-supertasks'],
+        tooltipAddButton: 'New Supertask'
       },
       {
         label: HeaderMenuLabel.IMPORT_SUPERTASK,
@@ -228,11 +243,17 @@ export class HeaderComponent implements OnInit, OnDestroy {
     const actions = [
       {
         label: HeaderMenuLabel.SHOW_HASHLISTS,
-        routerLink: ['hashlists', 'hashlist']
+        routerLink: ['hashlists', 'hashlist'],
+        showAddButton: true,
+        routerLinkAdd: ['hashlists', 'new-hashlist'],
+        tooltipAddButton: 'New Hashlist'
       },
       {
         label: HeaderMenuLabel.SUPERHASHLISTS,
-        routerLink: ['hashlists', 'superhashlist']
+        routerLink: ['hashlists', 'superhashlist'],
+        showAddButton: true,
+        routerLinkAdd: ['hashlists', 'new-superhashlist'],
+        tooltipAddButton: 'New Superhashlist'
       }
     ];
 
@@ -241,11 +262,17 @@ export class HeaderComponent implements OnInit, OnDestroy {
       actions.push(
         {
           label: HeaderMenuLabel.SEARCH_HASH,
-          routerLink: ['hashlists', 'search-hash']
+          routerLink: ['hashlists', 'search-hash'],
+          showAddButton: false,
+          routerLinkAdd: [],
+          tooltipAddButton: ''
         },
         {
           label: HeaderMenuLabel.SHOW_CRACKS,
-          routerLink: ['hashlists', 'show-cracks']
+          routerLink: ['hashlists', 'show-cracks'],
+          showAddButton: false,
+          routerLinkAdd: [],
+          tooltipAddButton: ''
         }
       );
     }
@@ -274,15 +301,24 @@ export class HeaderComponent implements OnInit, OnDestroy {
         [
           {
             label: HeaderMenuLabel.WORDLISTS,
-            routerLink: ['files', 'wordlist']
+            routerLink: ['files', 'wordlist'],
+            showAddButton: true,
+            routerLinkAdd: ['files', 'wordlist', 'new-wordlist'],
+            tooltipAddButton: 'New Wordlist'
           },
           {
             label: HeaderMenuLabel.RULES,
-            routerLink: ['files', 'rules']
+            routerLink: ['files', 'rules'],
+            showAddButton: true,
+            routerLinkAdd: ['files', 'rules', 'new-rule'],
+            tooltipAddButton: 'New Rule'
           },
           {
             label: HeaderMenuLabel.OTHER,
-            routerLink: ['files', 'other']
+            routerLink: ['files', 'other'],
+            showAddButton: true,
+            routerLinkAdd: ['files', 'other', 'new-other'],
+            tooltipAddButton: 'New File'
           }
         ]
       ]

diff --git a/src/app/layout/header/header.constants.ts b/src/app/layout/header/header.constants.ts
@@ -4,10 +4,10 @@ export const HeaderMenuAction = {
 
 export const HeaderMenuLabel = {
   AGENTS: 'Agents',
-  SHOW_AGENTS: 'Show Agents',
+  SHOW_AGENTS: 'Agents Overview',
   AGENT_STATUS: 'Agent Status',
   TASKS: 'Tasks',
-  SHOW_TASKS: 'Show Tasks',
+  SHOW_TASKS: 'Tasks',
   PRECONFIGURED_TASKS: 'Preconfigured Tasks',
   SUPERTASKS: 'Supertasks',
   IMPORT_SUPERTASK: 'Supertask Builder',

diff --git a/src/app/tasks/show-tasks/show-tasks.component.ts b/src/app/tasks/show-tasks/show-tasks.component.ts
@@ -15,7 +15,7 @@ export class ShowTasksComponent {
   pageTitle = 'Tasks';
 
   constructor(private titleService: AutoTitleService) {
-    titleService.set(['Show Tasks']);
+    titleService.set(['Tasks']);
   }
 
   toggleIsArchived(event: MatSlideToggleChange): void {

diff --git a/src/app/users/globalpermissionsgroups/globalpermissionsgroups.component.html b/src/app/users/globalpermissionsgroups/globalpermissionsgroups.component.html
@@ -1,7 +1,7 @@
 <app-table>
   <app-page-title
     title="Global Permission Groups"
-    buttontitle="New"
+    buttontitle="New Global Permission Group"
     buttonlink="/users/global-permissions-groups/new"
     [subbutton]="true"
   ></app-page-title>