carriera-intern 0.0.0 → 1.1.76

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/list-contact-dropdown.component.ts

@@ -1,208 +0,0 @@
-import { Component, input, output, signal, ViewChild } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import {
-  FormControl,
-  FormGroup,
-  FormsModule,
-  ReactiveFormsModule,
-  UntypedFormGroup,
-} from '@angular/forms';
-
-// Components
-import { InputComponent } from '../input/input.component';
-import { SvgIconComponent } from 'angular-svg-icon';
-
-// Bootstrap
-import {
-  NgbPopover,
-  NgbDropdownModule,
-  NgbPopoverModule,
-  NgbTooltip,
-} from '@ng-bootstrap/ng-bootstrap';
-
-// Models
-import { Contact } from './models/contact.interface';
-
-// Pipes
-import { MapContactsPipe } from './pipes/map-contacts.pipe';
-import { HighlightSearchPipe } from '../input/pipes/highlight-search.pipe';
-import { CopyComponent } from '../copy/copy.component';
-import { ContactsHeightPipe } from './pipes/contacts-height.pipe';
-import { DepartmentsHeightPipe } from './pipes/departments-height.pipe';
-import { ContactCountPipe } from './pipes/contact-count.pipe';
-
-@Component({
-  selector: 'cai-list-contact-dropdown',
-  templateUrl: './list-contact-dropdown.component.html',
-  styleUrl: './list-contact-dropdown.component.scss',
-  imports: [
-    // Modules
-    CommonModule,
-    FormsModule,
-    ReactiveFormsModule,
-
-    // Components
-    InputComponent,
-    SvgIconComponent,
-    CopyComponent,
-
-    // Bootstrap
-    NgbDropdownModule,
-    NgbPopoverModule,
-    NgbTooltip,
-
-    // Pipes
-    MapContactsPipe,
-    HighlightSearchPipe,
-    ContactsHeightPipe,
-    DepartmentsHeightPipe,
-    ContactCountPipe,
-  ],
-})
-export class ListContactDropdownComponent {
-  @ViewChild('dropdown') dropdown!: NgbPopover;
-
-  // Inputs
-  id = input<string>('');
-  contacts = input<Contact[]>([]);
-
-  // Outputs
-  onAdd = output();
-  onDelete = output();
-  onEdit = output();
-  onOpen = output();
-  onClose = output();
-
-  closing = signal<boolean>(false);
-  open = signal<boolean>(false);
-
-  selectedIds = signal<{ departmentId: number; contactId: number[] }[]>([]);
-
-  form: UntypedFormGroup = new FormGroup({
-    search: new FormControl(''),
-  });
-
-  selectedContactIds() {
-    return this.selectedIds().flatMap((entry) => entry.contactId);
-  }
-
-  closeDropdown() {
-    this.open.set(false);
-    this.dropdown?.close();
-    this.form.get('search')?.reset();
-    this.onClose.emit();
-  }
-
-  openDropdown() {
-    this.open.set(true);
-    this.onOpen.emit();
-  }
-
-  isDepartmentOpen(departmentId: number | null | undefined): boolean {
-    if (!departmentId) return false;
-    return !!this.selectedIds().find(
-      (entry) => entry.departmentId === departmentId
-    );
-  }
-
-  isContactOpen(contactId: number | null | undefined): boolean {
-    if (!contactId) return false;
-    return !!this.selectedContactIds().find((id) => id === contactId);
-  }
-
-  handleOpenDropdown() {
-    this.openDropdown();
-  }
-
-  handleCloseDropdown() {
-    this.closeDropdown();
-  }
-
-  emitOnAdd(event: Event) {
-    event.stopPropagation();
-    this.closeDropdown();
-    this.onAdd.emit();
-  }
-
-  emitOnEdit(event: Event) {
-    event.stopPropagation();
-    this.closeDropdown();
-    this.onEdit.emit();
-  }
-
-  emitOnDelete(event: Event) {
-    event.stopPropagation();
-    this.closeDropdown();
-    this.onDelete.emit();
-  }
-
-  handleContactClick(contactId: number) {
-    const currentSelected = this.selectedIds();
-    const existingEntry = currentSelected.find((entry) =>
-      entry.contactId.includes(contactId)
-    );
-
-    // Find the contact's actual department ID
-    const contact = this.contacts().find((c) => c.id === contactId);
-    const departmentId = contact?.department?.id || 0;
-
-    if (existingEntry) {
-      const updatedEntry = {
-        ...existingEntry,
-        contactId: existingEntry.contactId.filter((id) => id !== contactId),
-      };
-
-      this.selectedIds.set(
-        currentSelected.map((entry) =>
-          entry === existingEntry ? updatedEntry : entry
-        )
-      );
-    } else {
-      // Check if there's already an entry for this department
-      const departmentEntry = currentSelected.find(
-        (entry) => entry.departmentId === departmentId
-      );
-
-      if (departmentEntry) {
-        // Add contact to existing department entry
-        const updatedDepartmentEntry = {
-          ...departmentEntry,
-          contactId: [...departmentEntry.contactId, contactId],
-        };
-
-        this.selectedIds.set(
-          currentSelected.map((entry) =>
-            entry === departmentEntry ? updatedDepartmentEntry : entry
-          )
-        );
-      }
-    }
-  }
-
-  handleDepartmentClick(departmentId: number) {
-    const currentSelected = this.selectedIds();
-    const existingEntry = currentSelected.find(
-      (entry) => entry.departmentId === departmentId
-    );
-
-    if (existingEntry) {
-      // Remove the department entry and all contacts from this department
-      this.selectedIds.set(
-        currentSelected.filter((entry) => entry.departmentId !== departmentId)
-      );
-    } else {
-      // Add new department selection
-      this.selectedIds.set([
-        ...currentSelected,
-        { departmentId: departmentId, contactId: [] },
-      ]);
-    }
-  }
-
-  handleClick() {
-    if (!this.open()) {
-      this.open.set(true);
-      return;
-    }
-  }
-}

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/list-contact-dropdown.stories.ts

@@ -1,52 +0,0 @@
-import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
-
-import { ReactiveFormsModule } from '@angular/forms';
-import { ListContactDropdownComponent } from './list-contact-dropdown.component';
-import { brokerContacts } from './mock/brokerContacts.json';
-
-const meta: Meta<ListContactDropdownComponent> = {
-  title: 'Components/ListContactDropdown',
-  component: ListContactDropdownComponent,
-  decorators: [
-    moduleMetadata({
-      imports: [ReactiveFormsModule],
-    }),
-  ],
-  argTypes: {},
-  args: {
-    id: 'my-input',
-    contacts: [],
-  },
-};
-
-export default meta;
-type Story = StoryObj<ListContactDropdownComponent>;
-
-// --- Stories ---
-
-export const Default: Story = {
-  args: {
-    id: 'default-input',
-    contacts: brokerContacts,
-  },
-  render: (args) => ({
-    props: {
-      ...args,
-      onAdd: () => {
-        console.log('onClear');
-      },
-      onDelete: () => {
-        console.log('onDelete');
-      },
-      onEdit: () => {
-        console.log('onEdit');
-      },
-    },
-    template: `
-    <div style="width: 500px; height: 26px; padding-left: 50px;">
-      <cai-list-contact-dropdown [id]="id" [contacts]="contacts" (onAdd)="onAdd()" (onDelete)="onDelete()" (onEdit)="onEdit()">
-      </cai-list-contact-dropdown>
-    </div>
-    `,
-  }),
-};

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/mock/brokerContacts.json

@@ -1,74 +0,0 @@
-{
-  "brokerContacts": [
-    {
-      "id": 505,
-      "brokerId": 647,
-      "email": "jovan@rute.co",
-      "phone": "(381) 123-1231",
-      "contactName": "Jovan Kostic",
-      "department": {
-        "id": 7,
-        "name": "Manager",
-        "count": 0,
-        "companyUsers": null
-      },
-      "extensionPhone": null
-    },
-    {
-      "id": 506,
-      "brokerId": 647,
-      "email": "petar@rute.co",
-      "phone": "(381) 123-1231",
-      "contactName": "Petar Petrovic",
-      "department": {
-        "id": 2,
-        "name": "Dispatch",
-        "count": 0,
-        "companyUsers": null
-      },
-      "extensionPhone": null
-    },
-    {
-      "id": 507,
-      "brokerId": 647,
-      "email": "marko@rute.co",
-      "phone": "(381) 123-1231",
-      "contactName": "Marko Markovic",
-      "department": {
-        "id": 5,
-        "name": "Safety",
-        "count": 0,
-        "companyUsers": null
-      },
-      "extensionPhone": "123"
-    },
-    {
-      "id": 508,
-      "brokerId": 647,
-      "email": "luka@rute.co",
-      "phone": "(381) 123-1231",
-      "contactName": "Luka Lukic",
-      "department": {
-        "id": 9,
-        "name": "Other",
-        "count": 0,
-        "companyUsers": null
-      },
-      "extensionPhone": null
-    },
-    {
-      "id": 509,
-      "brokerId": 647,
-      "email": "dispecerdugacaktkestprobatest@rute.co",
-      "phone": "(381) 123-1231",
-      "contactName": "Dispec Dispecer Dugacak Tekst Proba Test",
-      "department": {
-        "id": 2,
-        "name": "Dispatch",
-        "count": 0,
-        "companyUsers": null
-      },
-      "extensionPhone": "12"
-    }
-  ]
-}

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/models/contact.interface.ts

@@ -1,23 +0,0 @@
-export interface Contact {
-  id?: number | null;
-  brokerId?: number | null;
-  shipperId?: number | null;
-  email?: string | null;
-  phone?: string | null;
-  contactName?: string | null;
-  fullName?: string | null;
-  extensionPhone?: string | null;
-  department?: Department | null;
-}
-
-export interface Department {
-  id?: number | null;
-  name?: string | null;
-  count?: number | null;
-  companyUsers?: any | null;
-}
-
-export interface ContactList {
-  department?: Department;
-  contacts?: Contact[];
-}

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/pipes/contact-count.pipe.ts

@@ -1,14 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { ContactList } from '../models/contact.interface';
-
-@Pipe({
-  name: 'contactCount',
-})
-export class ContactCountPipe implements PipeTransform {
-  transform(contactList: ContactList[]): number {
-    return contactList.reduce(
-      (total, list) => total + (list.contacts?.length || 0),
-      0
-    );
-  }
-}

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/pipes/contacts-height.pipe.ts

@@ -1,34 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { ContactList } from '../models/contact.interface';
-
-@Pipe({
-  name: 'contactsHeight',
-})
-export class ContactsHeightPipe implements PipeTransform {
-  transform(
-    departmentId: number,
-    contactList: ContactList,
-    selectedIds: { departmentId: number; contactId: number[] }[]
-  ): number {
-    const contactCount = contactList.contacts?.length || 0;
-
-    // Get the selected contact IDs for this department
-    const selectedContactIds =
-      selectedIds.find((entry) => entry.departmentId === departmentId)
-        ?.contactId || [];
-
-    // Get the visible contact IDs in the current filtered list
-    const visibleContactIds =
-      contactList.contacts?.map((contact) => contact.id) || [];
-
-    // Only count selected contacts that are currently visible in the filtered list
-    const visibleSelectedContacts = selectedContactIds.filter((contactId) =>
-      visibleContactIds.includes(contactId)
-    ).length;
-
-    return (
-      (contactCount - visibleSelectedContacts) * 30 +
-      visibleSelectedContacts * 74
-    );
-  }
-}

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/pipes/departments-height.pipe.ts

@@ -1,57 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { ContactList } from '../models/contact.interface';
-
-@Pipe({
-  name: 'departmentsHeight',
-})
-export class DepartmentsHeightPipe implements PipeTransform {
-  transform(
-    contactLists: ContactList[],
-    selectedIds: { departmentId: number; contactId: number[] }[]
-  ): number {
-    let totalHeight = 52;
-
-    // Calculate height for each visible department
-    contactLists.forEach((contactList) => {
-      // Base height for each department (30px) + 1px for the divider
-      totalHeight += 31;
-
-      // If department is open (has id in selectedIds), add contacts height calculation
-      const isDepartmentOpen = selectedIds.some(
-        (entry) => entry.departmentId === contactList.department?.id
-      );
-
-      if (isDepartmentOpen) {
-        const contactCount = contactList.contacts?.length || 0;
-
-        // Get the selected contact IDs for this department
-        const selectedContactIds =
-          selectedIds.find(
-            (entry) => entry.departmentId === contactList.department?.id
-          )?.contactId || [];
-
-        // Get the visible contact IDs in the current filtered list
-        const visibleContactIds =
-          contactList.contacts?.map((contact) => contact.id) || [];
-
-        // Only count selected contacts that are currently visible in the filtered list
-        const visibleSelectedContacts = selectedContactIds.filter((contactId) =>
-          visibleContactIds.includes(contactId)
-        ).length;
-
-        // Add contacts height calculation (same logic as contacts height pipe)
-        const contactsHeight =
-          (contactCount - visibleSelectedContacts) * 30 +
-          visibleSelectedContacts * 74;
-
-        totalHeight += contactsHeight;
-      }
-    });
-
-    if (totalHeight === 52) {
-      return 134;
-    }
-
-    return totalHeight;
-  }
-}

package/projects/carriera-intern-components/src/app/components/list-contact-dropdown/pipes/map-contacts.pipe.ts

@@ -1,51 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { Contact, ContactList } from '../models/contact.interface';
-
-@Pipe({
-  name: 'mapContacts',
-})
-export class MapContactsPipe implements PipeTransform {
-  transform(contacts: Contact[], searchValue: string | null): ContactList[] {
-    if (!contacts || contacts.length === 0) {
-      return [];
-    }
-
-    // Filter contacts by name if search value is provided
-    let filteredContacts = contacts;
-    if (searchValue && searchValue.trim()) {
-      const searchTerm = searchValue.toLowerCase().trim();
-      filteredContacts = contacts.filter((contact) =>
-        contact.contactName?.toLowerCase().includes(searchTerm)
-      );
-    }
-
-    // Group contacts by department
-    const departmentMap = new Map<number, ContactList>();
-
-    filteredContacts.forEach((contact) => {
-      const departmentId = contact.department?.id || 0;
-      const departmentName = contact.department?.name || 'No Department';
-
-      if (!departmentMap.has(departmentId)) {
-        departmentMap.set(departmentId, {
-          department: {
-            id: departmentId,
-            name: departmentName,
-            count: 0,
-            companyUsers: null,
-          },
-          contacts: [],
-        });
-      }
-
-      const contactList = departmentMap.get(departmentId)!;
-      contactList.contacts?.push(contact);
-      contactList.department!.count = (contactList.department!.count || 0) + 1;
-    });
-
-    // Convert map to array and sort by department name
-    return Array.from(departmentMap.values()).sort((a, b) =>
-      (a.department?.name || '').localeCompare(b.department?.name || '')
-    );
-  }
-}