@khester/create-dynamics-app 1.0.8 → 1.1.0

package/templates/dynamics-365-starter/src/index.tsx

@@ -1,27 +1,112 @@
-import React from 'react';
+import React, { useState, useCallback } from 'react';
 import { createRoot } from 'react-dom/client';
+import { Pivot, DynamicsPivotItemProps } from '@khester/dynamics-ui-components';
 import { ContactManagement } from './components/ContactManagement';
+import { AccountManagement } from './components/AccountManagement';
 import { DynamicsProvider } from './providers/DynamicsProvider';
+import { LoggingProvider } from './components/Logging/LoggingProvider';
+import { LoggingDebugPanel } from './components/Logging/LoggingDebugPanel';
+import { Logger } from './components/Logging/logger';
 import './styles/index.css';
 
 const App: React.FC = () => {
+  const [selectedTab, setSelectedTab] = useState<'contacts' | 'accounts'>(
+    'contacts'
+  );
+  const [showDebugPanel, setShowDebugPanel] = useState(false);
+
+  const handleTabChange = useCallback(
+    (item: DynamicsPivotItemProps) => {
+      const newTab = item.itemKey as 'contacts' | 'accounts';
+      Logger.userAction(
+        'Tab changed in main application',
+        { from: selectedTab, to: newTab },
+        'App.handleTabChange'
+      );
+      setSelectedTab(newTab);
+    },
+    [selectedTab]
+  );
+
+  const toggleDebugPanel = useCallback(() => {
+    setShowDebugPanel((prev) => !prev);
+    Logger.userAction(
+      showDebugPanel ? 'Debug panel closed' : 'Debug panel opened',
+      {},
+      'App.toggleDebugPanel'
+    );
+  }, [showDebugPanel]);
+
+  const renderContent = () => {
+    switch (selectedTab) {
+      case 'contacts':
+        return <ContactManagement />;
+      case 'accounts':
+        return <AccountManagement />;
+      default:
+        return <ContactManagement />;
+    }
+  };
+
   return (
-    <DynamicsProvider>
-      <div className="app">
-        <header className="app-header">
-          <h1>Dynamics 365 Contact Management</h1>
-          <p>Built with Dynamics UI Kit</p>
-        </header>
-        
-        <main className="app-main">
-          <ContactManagement />
-        </main>
-        
-        <footer className="app-footer">
-          <p>&copy; 2024 Your Organization. Powered by Dynamics UI Kit.</p>
-        </footer>
-      </div>
-    </DynamicsProvider>
+    <LoggingProvider>
+      <DynamicsProvider>
+        <div className="app">
+          <header className="app-header">
+            <div className="app-header__content">
+              <div className="app-header__title">
+                <h1>Dynamics 365 Management Console</h1>
+                <p>Built with Dynamics UI Kit - Enhanced Template</p>
+              </div>
+              <div className="app-header__actions">
+                <button
+                  className="debug-toggle-btn"
+                  onClick={toggleDebugPanel}
+                  title="Toggle Debug Panel"
+                >
+                  🐛 Debug
+                </button>
+              </div>
+            </div>
+          </header>
+
+          <nav className="app-navigation">
+            <Pivot
+              items={[
+                {
+                  headerText: 'Contacts',
+                  itemKey: 'contacts',
+                  itemIcon: 'Contact',
+                },
+                {
+                  headerText: 'Accounts',
+                  itemKey: 'accounts',
+                  itemIcon: 'Building',
+                },
+              ]}
+              selectedKey={selectedTab}
+              onItemClick={handleTabChange}
+              linkFormat="tabs"
+            />
+          </nav>
+
+          <main className="app-main">{renderContent()}</main>
+
+          <footer className="app-footer">
+            <p>
+              &copy; 2024 Your Organization. Powered by Dynamics UI Kit v1.0
+            </p>
+          </footer>
+
+          {/* Debug Panel */}
+          {showDebugPanel && (
+            <div className="debug-panel-overlay">
+              <LoggingDebugPanel onClose={() => setShowDebugPanel(false)} />
+            </div>
+          )}
+        </div>
+      </DynamicsProvider>
+    </LoggingProvider>
   );
 };
 
@@ -35,6 +120,9 @@ if (typeof document !== 'undefined') {
 }
 
 // Export for PCF integration
-export { App, ContactManagement };
+export { App, ContactManagement, AccountManagement };
 export * from './components/ContactManagement';
-export * from './providers/DynamicsProvider';
+export * from './components/AccountManagement';
+export * from './providers/DynamicsProvider';
+export * from './pcf/ContactControlWrapper';
+export * from './pcf/MultiEntityControlWrapper';

package/templates/dynamics-365-starter/src/models/Account.ts

@@ -0,0 +1,480 @@
+import { IApiService } from '@khester/dynamics-ui-api-client';
+import { BaseEntity } from './BaseEntity';
+import { AccountConstants } from '../constants/account';
+
+/**
+ * Interface for Account entity
+ */
+export interface IAccount {
+  accountid?: string;
+  name: string;
+  accountnumber?: string;
+  emailaddress1?: string;
+  emailaddress2?: string;
+  emailaddress3?: string;
+  telephone1?: string;
+  telephone2?: string;
+  telephone3?: string;
+  fax?: string;
+  websiteurl?: string;
+  description?: string;
+  revenue?: number;
+  numberofemployees?: number;
+  sic?: string;
+  tickersymbol?: string;
+  stockexchange?: string;
+  ownershipcode?: number;
+  industrycode?: number;
+  accountcategorycode?: number;
+  accountclassificationcode?: number;
+  accountratingcode?: number;
+  customersizecode?: number;
+  customertypecode?: number;
+  territorycode?: number;
+  marketcap?: number;
+  sharesoutstanding?: number;
+  creditlimit?: number;
+  creditonhold?: boolean;
+  donotbulkemail?: boolean;
+  donotemail?: boolean;
+  donotfax?: boolean;
+  donotphone?: boolean;
+  donotpostalmail?: boolean;
+  donotsendmm?: boolean;
+  marketingonly?: boolean;
+  preferredcontactmethodcode?: number;
+  paymenttermscode?: number;
+  shippingmethodcode?: number;
+  primarycontactid?: string;
+  parentaccountid?: string;
+  address1_line1?: string;
+  address1_line2?: string;
+  address1_line3?: string;
+  address1_city?: string;
+  address1_stateorprovince?: string;
+  address1_postalcode?: string;
+  address1_country?: string;
+  address1_county?: string;
+  address1_latitude?: number;
+  address1_longitude?: number;
+  address1_telephone1?: string;
+  address1_telephone2?: string;
+  address1_telephone3?: string;
+  address1_fax?: string;
+  address1_addresstypecode?: string;
+  address1_name?: string;
+  address1_primarycontactname?: string;
+  address1_shippingmethodcode?: number;
+  statecode?: number;
+  statuscode?: number;
+  createdon?: string;
+  modifiedon?: string;
+  createdby?: string;
+  modifiedby?: string;
+  ownerid?: string;
+  transactioncurrencyid?: string;
+}
+
+/**
+ * Account entity model class
+ */
+export class Account extends BaseEntity implements IAccount {
+  accountid?: string;
+  name: string;
+  accountnumber?: string;
+  emailaddress1?: string;
+  emailaddress2?: string;
+  emailaddress3?: string;
+  telephone1?: string;
+  telephone2?: string;
+  telephone3?: string;
+  fax?: string;
+  websiteurl?: string;
+  description?: string;
+  revenue?: number;
+  numberofemployees?: number;
+  sic?: string;
+  tickersymbol?: string;
+  stockexchange?: string;
+  ownershipcode?: number;
+  industrycode?: number;
+  accountcategorycode?: number;
+  accountclassificationcode?: number;
+  accountratingcode?: number;
+  customersizecode?: number;
+  customertypecode?: number;
+  territorycode?: number;
+  marketcap?: number;
+  sharesoutstanding?: number;
+  creditlimit?: number;
+  creditonhold?: boolean;
+  donotbulkemail?: boolean;
+  donotemail?: boolean;
+  donotfax?: boolean;
+  donotphone?: boolean;
+  donotpostalmail?: boolean;
+  donotsendmm?: boolean;
+  marketingonly?: boolean;
+  preferredcontactmethodcode?: number;
+  paymenttermscode?: number;
+  shippingmethodcode?: number;
+  primarycontactid?: string;
+  parentaccountid?: string;
+  address1_line1?: string;
+  address1_line2?: string;
+  address1_line3?: string;
+  address1_city?: string;
+  address1_stateorprovince?: string;
+  address1_postalcode?: string;
+  address1_country?: string;
+  address1_county?: string;
+  address1_latitude?: number;
+  address1_longitude?: number;
+  address1_telephone1?: string;
+  address1_telephone2?: string;
+  address1_telephone3?: string;
+  address1_fax?: string;
+  address1_addresstypecode?: string;
+  address1_name?: string;
+  address1_primarycontactname?: string;
+  address1_shippingmethodcode?: number;
+  statecode?: number;
+  statuscode?: number;
+  createdon?: string;
+  modifiedon?: string;
+  createdby?: string;
+  modifiedby?: string;
+  ownerid?: string;
+  transactioncurrencyid?: string;
+
+  /**
+   * Constructor for Account entity
+   * @param account The account data
+   */
+  constructor(account: IAccount) {
+    super();
+    this.accountid = account.accountid;
+    this.name = account.name;
+    this.accountnumber = account.accountnumber;
+    this.emailaddress1 = account.emailaddress1;
+    this.emailaddress2 = account.emailaddress2;
+    this.emailaddress3 = account.emailaddress3;
+    this.telephone1 = account.telephone1;
+    this.telephone2 = account.telephone2;
+    this.telephone3 = account.telephone3;
+    this.fax = account.fax;
+    this.websiteurl = account.websiteurl;
+    this.description = account.description;
+    this.revenue = account.revenue;
+    this.numberofemployees = account.numberofemployees;
+    this.sic = account.sic;
+    this.tickersymbol = account.tickersymbol;
+    this.stockexchange = account.stockexchange;
+    this.ownershipcode = account.ownershipcode;
+    this.industrycode = account.industrycode;
+    this.accountcategorycode = account.accountcategorycode;
+    this.accountclassificationcode = account.accountclassificationcode;
+    this.accountratingcode = account.accountratingcode;
+    this.customersizecode = account.customersizecode;
+    this.customertypecode = account.customertypecode;
+    this.territorycode = account.territorycode;
+    this.marketcap = account.marketcap;
+    this.sharesoutstanding = account.sharesoutstanding;
+    this.creditlimit = account.creditlimit;
+    this.creditonhold = account.creditonhold;
+    this.donotbulkemail = account.donotbulkemail;
+    this.donotemail = account.donotemail;
+    this.donotfax = account.donotfax;
+    this.donotphone = account.donotphone;
+    this.donotpostalmail = account.donotpostalmail;
+    this.donotsendmm = account.donotsendmm;
+    this.marketingonly = account.marketingonly;
+    this.preferredcontactmethodcode = account.preferredcontactmethodcode;
+    this.paymenttermscode = account.paymenttermscode;
+    this.shippingmethodcode = account.shippingmethodcode;
+    this.primarycontactid = account.primarycontactid;
+    this.parentaccountid = account.parentaccountid;
+    this.address1_line1 = account.address1_line1;
+    this.address1_line2 = account.address1_line2;
+    this.address1_line3 = account.address1_line3;
+    this.address1_city = account.address1_city;
+    this.address1_stateorprovince = account.address1_stateorprovince;
+    this.address1_postalcode = account.address1_postalcode;
+    this.address1_country = account.address1_country;
+    this.address1_county = account.address1_county;
+    this.address1_latitude = account.address1_latitude;
+    this.address1_longitude = account.address1_longitude;
+    this.address1_telephone1 = account.address1_telephone1;
+    this.address1_telephone2 = account.address1_telephone2;
+    this.address1_telephone3 = account.address1_telephone3;
+    this.address1_fax = account.address1_fax;
+    this.address1_addresstypecode = account.address1_addresstypecode;
+    this.address1_name = account.address1_name;
+    this.address1_primarycontactname = account.address1_primarycontactname;
+    this.address1_shippingmethodcode = account.address1_shippingmethodcode;
+    this.statecode = account.statecode;
+    this.statuscode = account.statuscode;
+    this.createdon = account.createdon;
+    this.modifiedon = account.modifiedon;
+    this.createdby = account.createdby;
+    this.modifiedby = account.modifiedby;
+    this.ownerid = account.ownerid;
+    this.transactioncurrencyid = account.transactioncurrencyid;
+  }
+
+  /**
+   * Validates the account instance
+   * @returns True if valid, throws error if invalid
+   */
+  validate(): boolean {
+    if (!this.name || this.name.trim().length === 0) {
+      throw new Error('Account name is required');
+    }
+
+    if (this.name.length > 160) {
+      throw new Error('Account name cannot exceed 160 characters');
+    }
+
+    if (this.accountnumber && this.accountnumber.length > 20) {
+      throw new Error('Account number cannot exceed 20 characters');
+    }
+
+    if (this.emailaddress1 && !this.isValidEmail(this.emailaddress1)) {
+      throw new Error('Invalid primary email address format');
+    }
+
+    if (this.emailaddress2 && !this.isValidEmail(this.emailaddress2)) {
+      throw new Error('Invalid secondary email address format');
+    }
+
+    if (this.emailaddress3 && !this.isValidEmail(this.emailaddress3)) {
+      throw new Error('Invalid tertiary email address format');
+    }
+
+    if (this.websiteurl && !this.isValidUrl(this.websiteurl)) {
+      throw new Error('Invalid website URL format');
+    }
+
+    if (this.revenue !== undefined && this.revenue < 0) {
+      throw new Error('Revenue cannot be negative');
+    }
+
+    if (this.numberofemployees !== undefined && this.numberofemployees < 0) {
+      throw new Error('Number of employees cannot be negative');
+    }
+
+    if (this.creditlimit !== undefined && this.creditlimit < 0) {
+      throw new Error('Credit limit cannot be negative');
+    }
+
+    return true;
+  }
+
+  /**
+   * Creates a new account record
+   * @param apiService The API service instance
+   * @param account The account to create
+   * @returns Promise resolving to the created account
+   */
+  public static async create(
+    apiService: IApiService,
+    account: Account
+  ): Promise<Account> {
+    const loggerContext = 'Account.create';
+    console.log(`${loggerContext}: Creating new account`, {
+      name: account.name,
+    });
+
+    return await this.createEntity<Account>(
+      apiService,
+      account,
+      AccountConstants.EntityCollectionName,
+      loggerContext
+    );
+  }
+
+  /**
+   * Updates an existing account record
+   * @param apiService The API service instance
+   * @param account The account to update
+   * @returns Promise resolving to the updated account
+   */
+  public static async update(
+    apiService: IApiService,
+    account: Account
+  ): Promise<Account> {
+    const loggerContext = 'Account.update';
+
+    if (!account.accountid) {
+      throw new Error('Account ID is required for update');
+    }
+
+    console.log(`${loggerContext}: Updating account`, {
+      accountid: account.accountid,
+      name: account.name,
+    });
+
+    return await this.updateEntity<Account>(
+      apiService,
+      account.accountid,
+      account,
+      AccountConstants.EntityCollectionName,
+      AccountConstants.PrimaryKey,
+      loggerContext
+    );
+  }
+
+  /**
+   * Deletes an account record
+   * @param apiService The API service instance
+   * @param accountId The ID of the account to delete
+   * @returns Promise resolving when deletion is complete
+   */
+  public static async delete(
+    apiService: IApiService,
+    accountId: string
+  ): Promise<void> {
+    const loggerContext = 'Account.delete';
+    console.log(`${loggerContext}: Deleting account`, { accountid: accountId });
+
+    return await this.deleteEntity(
+      apiService,
+      accountId,
+      AccountConstants.EntityCollectionName,
+      loggerContext
+    );
+  }
+
+  /**
+   * Retrieves accounts based on a filter
+   * @param apiService The API service instance
+   * @param filter Optional FetchXML filter string
+   * @returns Promise resolving to an array of accounts
+   */
+  public static async retrieveByFilter(
+    apiService: IApiService,
+    filter?: string
+  ): Promise<Account[]> {
+    const loggerContext = 'Account.retrieveByFilter';
+    console.log(`${loggerContext}: Retrieving accounts with filter`, {
+      filter,
+    });
+
+    const attributes = [
+      AccountConstants.PrimaryKey,
+      AccountConstants.PrimaryName,
+      AccountConstants.AccountNumber,
+      AccountConstants.EMailAddress1,
+      AccountConstants.Telephone1,
+      AccountConstants.Address1_City,
+      AccountConstants.Address1_StateOrProvince,
+      AccountConstants.Address1_Country,
+      AccountConstants.Revenue,
+      AccountConstants.NumberOfEmployees,
+      AccountConstants.IndustryCode,
+      AccountConstants.OwnershipCode,
+      AccountConstants.WebSiteURL,
+      AccountConstants.Description,
+      AccountConstants.StateCode,
+      AccountConstants.StatusCode,
+      AccountConstants.CreatedOn,
+      AccountConstants.ModifiedOn,
+    ];
+
+    const fetchXml = this.buildFetchXml(
+      AccountConstants.EntityName,
+      attributes,
+      filter,
+      { attribute: AccountConstants.PrimaryName }
+    );
+
+    return await this.retrieveEntitiesByFilter<Account>(
+      apiService,
+      AccountConstants.EntityCollectionName,
+      fetchXml,
+      Account,
+      loggerContext
+    );
+  }
+
+  /**
+   * Retrieves a single account by ID
+   * @param apiService The API service instance
+   * @param accountId The account ID
+   * @returns Promise resolving to the account or null if not found
+   */
+  public static async retrieveById(
+    apiService: IApiService,
+    accountId: string
+  ): Promise<Account | null> {
+    const loggerContext = 'Account.retrieveById';
+    console.log(`${loggerContext}: Retrieving account by ID`, {
+      accountid: accountId,
+    });
+
+    const filter = `<filter type="and">
+      <condition attribute="${AccountConstants.PrimaryKey}" operator="eq" value="${this.escapeXml(accountId)}" />
+    </filter>`;
+
+    const accounts = await this.retrieveByFilter(apiService, filter);
+    return accounts.length > 0 ? accounts[0] : null;
+  }
+
+  /**
+   * Retrieves accounts by name (partial match)
+   * @param apiService The API service instance
+   * @param name The name to search for
+   * @returns Promise resolving to an array of matching accounts
+   */
+  public static async retrieveByName(
+    apiService: IApiService,
+    name: string
+  ): Promise<Account[]> {
+    const loggerContext = 'Account.retrieveByName';
+    console.log(`${loggerContext}: Retrieving accounts by name`, { name });
+
+    const filter = `<filter type="and">
+      <condition attribute="${AccountConstants.PrimaryName}" operator="like" value="%${this.escapeXml(name)}%" />
+    </filter>`;
+
+    return await this.retrieveByFilter(apiService, filter);
+  }
+
+  /**
+   * Retrieves active accounts only
+   * @param apiService The API service instance
+   * @returns Promise resolving to an array of active accounts
+   */
+  public static async retrieveActiveAccounts(
+    apiService: IApiService
+  ): Promise<Account[]> {
+    const loggerContext = 'Account.retrieveActiveAccounts';
+    console.log(`${loggerContext}: Retrieving active accounts`);
+
+    const filter = `<filter type="and">
+      <condition attribute="${AccountConstants.StateCode}" operator="eq" value="0" />
+    </filter>`;
+
+    return await this.retrieveByFilter(apiService, filter);
+  }
+
+  /**
+   * Helper method to validate email format
+   */
+  private isValidEmail(email: string): boolean {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(email);
+  }
+
+  /**
+   * Helper method to validate URL format
+   */
+  private isValidUrl(url: string): boolean {
+    try {
+      new URL(url);
+      return true;
+    } catch {
+      return false;
+    }
+  }
+}