carriera-intern 0.0.0

package/projects/carriera-intern-components/src/app/components/input/models/dropdown.model.ts

@@ -0,0 +1,376 @@
+import { AvatarFile, ColorFlag } from '../../avatar/models';
+
+// Dropdown
+
+export type DropdownOption = {
+  id?: number;
+  [key: string]: any;
+};
+
+// Dispatch dropdowns
+
+export type Dispatch = {
+  id: number;
+  dispatchBoardId: number;
+  dispatcherId: number;
+  truck: Truck;
+  trailer?: Trailer | null;
+  driver: Driver;
+  coDriver?: Driver | null;
+  payType: string;
+  status?: Status | null; // ?
+  numberOfSingleLtlLoads?: number;
+  currentLocationCoordinates?: {
+    latitude: number;
+    longitude: number;
+  };
+};
+
+export type DispatchBoard = {
+  teamBoard: boolean;
+  id: number;
+  dispatcher: string | null;
+  count: number;
+  dispatches: Dispatch[];
+};
+
+export type Driver = {
+  id: number;
+  firstName: string;
+  lastName: string;
+  owner?: boolean | null;
+  avatarFile?: AvatarFile | null;
+  colorFlag?: ColorFlag | null;
+  status?: number;
+  address: string | null;
+  payType: {
+    name: string; // TODO: Change this to the actual type: 'commission | flat ...'
+    id: number;
+  };
+  [key: string]: any;
+};
+
+export type Truck = {
+  id: number;
+  truckNumber: string;
+  status: number;
+  owner: string;
+
+  color: TruckColor;
+  truckType: TruckType;
+
+  truckMakeName?: string | null;
+  model?: string | null;
+
+  year: number;
+};
+
+export type TruckColor = {
+  id: number;
+  companyId?: number | null;
+  name: string;
+  code: string;
+};
+
+export type TruckType = {
+  id: number;
+  companyId?: number | null;
+  truckNumber?: string | null;
+  name: string;
+  logoName: string;
+};
+
+export type Trailer = {
+  id: number;
+  trailerNumber: string;
+  status: number;
+  owner: string | null;
+  trailerType: TrailerType;
+  trailerMakeName?: string | null;
+  model?: string | null;
+  year: number;
+};
+
+export type TrailerType = {
+  id: number;
+  companyId?: number | null;
+  name: string;
+  logoName: string;
+  hasVolume?: boolean | null;
+};
+
+export type Status = {
+  statusValue: {
+    name: string;
+    id: number;
+  };
+  statusString: string;
+  statusCheckInNumber: string;
+};
+
+// Brokers
+
+export type Broker = {
+  id?: number;
+  businessName?: string | null;
+  availableCredit?: number | null;
+  creditLimit?: number | null;
+  availableCreditType?: any | null; // TODO: Take type from brokers.json
+  payTerm?: any | null;
+  dnu?: boolean;
+  ban?: boolean;
+  status?: number;
+  loadsCount?: number;
+  revenue?: number | null;
+  fraudCheck?: boolean;
+};
+
+// Contact
+
+export type DepartmentContactsPair = {
+  department?: Department;
+  contacts?: Contact[];
+};
+
+export type Department = {
+  id?: number;
+  name?: string | null;
+  count?: number;
+  companyUsers?: any | null;
+};
+
+export type Contact = {
+  id?: number;
+  brokerId?: number; // Broker id or shipper id
+  shipperId?: number;
+  phone?: string | null;
+  contactName?: string | null;
+  extensionPhone?: string | null;
+  department?: Department;
+};
+
+// Shipper
+
+export type Shipper = {
+  id?: number;
+  businessName?: string | null;
+  status?: number | null;
+  address?: Address | null;
+  longitude?: number | null;
+  latitude?: number | null;
+  receivingFrom?: string | null;
+  receivingTo?: string | null;
+  shippingFrom?: string | null;
+  shippingTo?: string | null;
+  receivingOpenTwentyFourHours?: boolean;
+  shippingOpenTwentyFourHours?: boolean;
+  pickupCount?: number;
+  deliveryCount?: number;
+};
+
+export type Address = {
+  city?: string | null;
+  state?: string | null;
+  county?: string | null;
+  address?: string | null;
+  street?: string | null;
+  streetNumber?: string | null;
+  country?: string | null;
+  zipCode?: string | null;
+  stateShortName?: string | null;
+  addressUnit?: string | null;
+};
+
+// Bank
+
+export type Bank = {
+  id?: number;
+  name?: string | null;
+  logoName?: string | null;
+  createdAt?: string;
+  updatedAt?: string;
+};
+
+// Dispatcher
+
+export type Dispatcher = {
+  id: number;
+  userId: number | null;
+  fullName: string;
+  avatarFile: AvatarFile | null;
+  departmentId: number | null;
+  colorFlag?: ColorFlag | null;
+};
+
+// Truck
+
+export type TruckOption = {
+  id: number;
+  companyId?: number | null;
+  name: string;
+  logoName: string;
+};
+
+// Trailer
+
+export type TrailerOption = {
+  id: number;
+  companyId?: number | null;
+  name: string;
+  logoName: string;
+  hasVolume?: boolean | null;
+};
+
+export type Hazardous = {
+  id?: number;
+  class?: number;
+  division?: number;
+  group?: string;
+  description?: string;
+  notes?: string;
+  logoName?: string;
+};
+
+export type State = {
+  id?: number;
+  countryType?: {
+    name: string;
+    id: number;
+  };
+  stateShortName?: string;
+  stateName?: string;
+  counter?: number | null;
+};
+
+export type Owner = {
+  id?: number;
+  name?: string | null;
+  ein?: string | null;
+};
+
+export type FuelCard = {
+  id?: number;
+  number?: string | null;
+  brand?: string | null;
+  account?: string | null;
+};
+
+export type PMOption = {
+  id?: number;
+  title?: string | null;
+  months?: number | null;
+  logoName?: string | null;
+};
+
+export type ColorOption = {
+  id?: number;
+  companyId?: number | null;
+  name?: string | null;
+  code?: string | null;
+  hoverCode?: string | null;
+};
+
+export type MakeOption = {
+  id?: number;
+  companyId?: number | null;
+  name?: string | null;
+  logoName?: string | null;
+};
+
+export type TollOption = {
+  groupName?: string | null;
+  tollTransponders?: TollTransponderOption[] | null;
+};
+
+export type TollTransponderOption = {
+  name?: string | null;
+  id?: number;
+};
+
+// Fuel
+
+export type Franchise = {
+  id: number;
+  businessName: string;
+  count: number;
+  fuelStopStores: FuelStopStore[];
+  isFranchise: boolean;
+  [key: string]: any;
+};
+
+export type FuelStopStore = {
+  id: number;
+  companyId: number;
+  businessName: string;
+  store: string;
+  address: Address; // Needs city, stateShortName and zipcode
+  [key: string]: any;
+};
+
+export type Provider = {
+  id: number;
+  name: string;
+};
+
+export type SplitDriver = {
+  id: number;
+  firstName: string;
+  lastName: string;
+  owner?: any | null;
+  avatarFile?: AvatarFile | null;
+  colorFlag?: ColorFlag | null;
+  status?: number;
+  pendingLoadsCount?: number;
+  dispatchStatus?: Status | null;
+  payType?: {
+    name: string;
+    id: number;
+  };
+  payTypeValue?: string;
+  [key: string]: any;
+};
+
+export type SplitDriverBoard = {
+  id: number;
+  dispatcherName: string | null;
+  isTeamBoard: boolean;
+  drivers?: SplitDriver[];
+};
+
+export type SplitTruck = {
+  id: number;
+  truckNumber: string;
+  truckType: TruckType;
+  color?: TruckColor | null;
+  status?: number;
+  pendingLoadsCount?: number;
+  dispatchStatus?: Status | null;
+  location?: Address | null;
+  [key: string]: any;
+};
+
+export type SplitTruckBoard = {
+  id: number;
+  dispatcherName: string | null;
+  isTeamBoard: boolean;
+  trucks?: SplitTruck[];
+};
+
+export type SplitTrailer = {
+  id: number;
+  trailerNumber: string;
+  trailerType: TrailerType;
+  color?: TruckColor | null;
+  status?: number;
+  pendingLoadsCount?: number;
+  dispatchStatus?: Status | null;
+  location?: Address | null;
+  [key: string]: any;
+};
+
+export type SplitTrailerBoard = {
+  id: number;
+  dispatcherName: string | null;
+  isTeamBoard: boolean;
+  trailers?: SplitTrailer[];
+};

package/projects/carriera-intern-components/src/app/components/input/models/index.ts

@@ -0,0 +1,2 @@
+export * from './input.model';
+export * from './dropdown.model';

package/projects/carriera-intern-components/src/app/components/input/models/input.model.ts

@@ -0,0 +1,227 @@
+import {
+  Bank,
+  Broker,
+  Contact,
+  DepartmentContactsPair,
+  Dispatch,
+  DispatchBoard,
+  Dispatcher,
+  DropdownOption,
+  Shipper,
+  TrailerOption,
+  TruckOption,
+  Hazardous,
+  State,
+  Owner,
+  FuelCard,
+  PMOption,
+  ColorOption,
+  MakeOption,
+  TollOption,
+  TollTransponderOption,
+  Franchise,
+  FuelStopStore,
+  Provider,
+  SplitDriverBoard,
+  SplitTruckBoard,
+  SplitTrailerBoard,
+  SplitDriver,
+  SplitTruck,
+  SplitTrailer,
+} from './dropdown.model';
+
+export interface CaiInputConfig {
+  type?: 'text' | 'password' | 'number' | 'account';
+  name?: string;
+  required?: boolean;
+  alignment?: 'left' | 'right';
+  inverse?: boolean; // dark mode
+  reveal?: number; // Revealed character count from the end of the password
+  icon?: string | null; // icon name ex. 'cai-email'
+  iconColor?: string; // color code for icons ex. #F89B2E
+  dropdown?: boolean | DropdownType; // dropdown menu
+  dropdownAutocomplete?: boolean; // dropdown autocomplete functionality
+  fullState?: boolean; // full state dropdown functionality
+  search?: boolean; // dropdown search functionality
+  useOutsideSearch?: boolean; // use outside search functionality
+  add?: boolean; // dropdown add new functionality
+  subcontent?: string; // ex. months, years, lbs, gallons
+  textTransform?: 'capitalize' | 'uppercase' | 'lowercase';
+  textTransformExceptions?: string[]; // exception from text transform
+  isNumberFormattingDisabled?: boolean;
+  textColor?: 'positive';
+  isAddress?: boolean; // address dropdown functionality
+
+  isEdit?: boolean;
+  writeAddValue?: boolean;
+
+  placeholderBehavior?: 'dynamic' | 'fade' | 'static' | 'hidden';
+  errorBehavior?: 'dynamic' | 'static' | 'floating' | 'hidden';
+
+  label?: string; // aria label
+  mask?: string; // mask pattern ex. (000) 000-0000
+  min?: number; // min value for number inputs
+  max?: number; // max value for number inputs or max length for text inputs
+  step?: number | 'automatic'; // step value for number inputs
+  disableDecimals?: boolean; // disable decimals for number inputs
+  prefix?: string; // ex. $
+  withButtons?: boolean; // + - buttons
+  autocomplete?: string; // autocomplete
+  inTable?: boolean;
+  disabled?: boolean; // disabled?
+  passwordRequirements?: boolean; // password requirements
+  canOpenModal?: boolean; // can open modal for add new
+  noSeparator?: boolean; // no separator between label and input
+  squareAvatar?: boolean; // square avatar
+
+  optionValue?: string; // option value (key)
+  optionLabel?: string; // option label (key)
+
+  removable?: boolean;
+  isRemovableWhenDisabled?: boolean;
+  autofocus?: boolean;
+  size?: (typeof sizes)[number]; // size of the input
+
+  customErrors?: CustomError[]; // custom error message
+  disabledCharacters?: string[]; // characters that are disabled
+  enabledCharacters?: string[]; // characters that are enabled
+  spacesAllowed?: number;
+
+  placeholderColor?: string;
+
+  strikethrough?: boolean; // strikethrough the input
+  hasRemoveModal?: boolean; // has remove modal
+  hasNoClearButton?: boolean; // has no clear button
+
+  hasResetButton?: boolean; // has reset button
+
+  placeholder?: string;
+
+  hasStroke?: boolean; // has stroke
+}
+
+export type CustomError = {
+  name: string; // name of the error
+  message: string | null; // message of the error
+};
+
+export const DropdownTypes = [
+  'multiple',
+  'dispatch',
+  'ftl-dispatch',
+  'broker',
+  'contact',
+  'shipper',
+  'bank',
+  'dispatcher',
+  'truck',
+  'trailer',
+  'subcontent',
+  'hazardous',
+  'state',
+  'owner',
+  'fuelcard',
+  'pm',
+  'color',
+  'make',
+  'toll',
+  'fuel-stop-transaction',
+  'provider',
+
+  // Load Split
+  'split-driver',
+  'split-truck',
+  'split-trailer',
+] as const;
+
+export const sizes = [
+  22, 26,
+  // 34 For later versions when applicant is done
+] as const;
+
+export type DropdownType = (typeof DropdownTypes)[number];
+
+export type DropdownArrays =
+  | DropdownOption[]
+  | Broker[]
+  | DispatchBoard[]
+  | DepartmentContactsPair[]
+  | Shipper[]
+  | Dispatch[]
+  | Bank[]
+  | Dispatcher[]
+  | TruckOption[]
+  | TrailerOption[]
+  | Hazardous[]
+  | State[]
+  | Owner[]
+  | FuelCard[]
+  | PMOption[]
+  | ColorOption[]
+  | MakeOption[]
+  | TollOption[]
+  | Franchise[]
+  | Provider[]
+  | SplitDriverBoard[]
+  | SplitTruckBoard[]
+  | SplitTrailerBoard[];
+
+export type DropdownOptions =
+  | DropdownOption
+  | Broker
+  | Contact
+  | Shipper
+  | Dispatch
+  | Bank
+  | Dispatcher
+  | TruckOption
+  | TrailerOption
+  | Hazardous
+  | State
+  | Owner
+  | FuelCard
+  | PMOption
+  | ColorOption
+  | MakeOption
+  | TollTransponderOption
+  | FuelStopStore
+  | Provider
+  | SplitDriver
+  | SplitTruck
+  | SplitTrailer;
+
+export type DropdownKeys =
+  | DropdownOption[keyof DropdownOption]
+  | Dispatch[keyof Dispatch]
+  | Broker[keyof Broker]
+  | Contact[keyof Contact]
+  | Shipper[keyof Shipper]
+  | Bank[keyof Bank]
+  | Dispatcher[keyof Dispatcher]
+  | TruckOption[keyof TruckOption]
+  | TrailerOption[keyof TrailerOption]
+  | Hazardous[keyof Hazardous]
+  | State[keyof State]
+  | Owner[keyof Owner]
+  | FuelCard[keyof FuelCard]
+  | PMOption[keyof PMOption]
+  | ColorOption[keyof ColorOption]
+  | MakeOption[keyof MakeOption]
+  | TollTransponderOption[keyof TollTransponderOption]
+  | FuelStopStore[keyof FuelStopStore]
+  | Provider[keyof Provider]
+  | SplitDriver[keyof SplitDriver]
+  | SplitTruck[keyof SplitTruck]
+  | SplitTrailer[keyof SplitTrailer];
+
+export type DropdownGroups = Franchise;
+
+export type GroupedNavigationState = {
+  groupIndex: number | null;
+  optionIndex: number | null;
+};
+
+export type KeyboardNavigationState = {
+  singleIndex: number | null;
+  groupedNavigationState: GroupedNavigationState | null;
+};

package/projects/carriera-intern-components/src/app/components/input/pipes/broker-progress.pipe.ts

@@ -0,0 +1,36 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { Broker } from '../models';
+
+@Pipe({
+  name: 'brokerProgress',
+})
+export class BrokerProgressPipe implements PipeTransform {
+  transform(
+    broker: Broker,
+    disable?: boolean,
+  ): { activePercentageOfPaid: number; status: string | null } {
+    let activePercentageOfPaid;
+    let status;
+    let availableCredit = broker.availableCredit || 0;
+    let creditLimit = broker.creditLimit || 0;
+    if (broker.availableCredit === 0) {
+      activePercentageOfPaid = 100;
+      status = disable ? 'disable' : 'high';
+      return { activePercentageOfPaid, status };
+    } else {
+      activePercentageOfPaid = (+availableCredit / +creditLimit) * 100;
+    }
+
+    if (activePercentageOfPaid >= 0 && activePercentageOfPaid < 30) {
+      status = disable ? 'disable' : 'low';
+    } else if (activePercentageOfPaid > 30 && activePercentageOfPaid < 60) {
+      status = disable ? 'disable' : 'medium';
+    } else if (activePercentageOfPaid > 60 && activePercentageOfPaid <= 100) {
+      status = disable ? 'disable' : 'high';
+    } else {
+      status = null;
+    }
+
+    return { activePercentageOfPaid, status };
+  }
+}

package/projects/carriera-intern-components/src/app/components/input/pipes/clear-tooltip.pipe.ts

@@ -0,0 +1,38 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'clearTooltip',
+})
+export class ClearTooltipPipe implements PipeTransform {
+  transform(
+    hasText: boolean,
+    isAdding: boolean,
+    isEdit: boolean,
+    placeholderBehavior: string,
+    multiple: boolean,
+    hasResetButton?: boolean,
+    canTooltipBeVisible?: boolean,
+  ): string {
+    if (!canTooltipBeVisible) {
+      return '';
+    }
+
+    if (hasText && (isAdding || isEdit)) {
+      return 'Cancel';
+    }
+
+    if (placeholderBehavior === 'static') {
+      return 'Delete';
+    }
+
+    if (multiple) {
+      return 'Clear All';
+    }
+
+    if (hasResetButton) {
+      return 'Reset';
+    }
+
+    return 'Clear';
+  }
+}