feat: update version to 1.2.1 and improve title handling in organization chart

config/package-solution.json

@@ -4,7 +4,7 @@
     "name": "organization-chart-webpart",
     "title": "organization-chart-webpart",
     "id": "b2f88ea8-f7da-4d0e-a945-6973bf1acd1e",
-    "version": "1.2.0.0",
+    "version": "1.2.1.0",
     "includeClientSideAssets": true,
     "skipFeatureDeployment": true
   },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "organization-chart-webpart",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "private": true,
   "main": "lib/index.js",
   "engines": { "node": ">=6.9.0 <9.0.0" },

src/webparts/organizationChart/OrganizationChartWebPart.ts

@@ -101,7 +101,7 @@ export default class OrganizationChartWebPart extends BaseClientSideWebPart<IOrg
       if (!data.root) { this.renderStatus(strings.EmptyMessage, false); return; }
       const element: React.ReactElement<IOrganizationChartProps> = React.createElement(OrganizationChart, {
         data: data,
-        title: this.properties.title || strings.DefaultTitle,
+        title: String(this.properties.title || '').trim(),
         showPictures: this.properties.showPictures !== false,
         showContactDetails: this.properties.showContactDetails === true,
         cardBackgroundColor: this.properties.cardBackgroundColor || '',

src/webparts/organizationChart/components/OrganizationChart.tsx

@@ -39,9 +39,10 @@ export default class OrganizationChart extends React.Component<IOrganizationChar
     const treeClassName: string = styles.tree + (densityClass ? ' ' + densityClass : '');
     return (
       <section className={styles.organizationChart} aria-label={this.props.title}>
+        {this.props.title &&
           <div className={styles.header}>
-          {this.props.title && <h2 className={styles.heading}>{this.props.title}</h2>}
+            <h2 className={styles.heading}>{this.props.title}</h2>
-        </div>
+          </div>}
         {this.props.data.truncated && <div className={styles.notice} role='status'>{this.props.truncatedLabel}</div>}
         <div className={styles.viewport} ref={(element: HTMLDivElement): void => { this.viewportElement = element; }}>
           <div className={treeClassName}>

tests/validate-project.js

@@ -26,10 +26,12 @@ assert(packageSolution.solution.includeClientSideAssets === true && packageSolut
   'Central deployment is not configured.');
 assert(!!config.bundles['organization-chart-webpart'], 'Bundle name is inconsistent.');
 assert(manifest.componentType === 'WebPart' && manifest.alias === 'OrganizationChartWebPart', 'Manifest is invalid.');
-assert(packageJson.version === '1.2.0' && packageSolution.solution.version === '1.2.0.0',
+assert(packageJson.version === '1.2.1' && packageSolution.solution.version === '1.2.1.0',
   'Organization Chart version is inconsistent.');
 assert(webPart.indexOf("PropertyPaneTextField('title'") >= 0 && component.indexOf('styles.heading') >= 0,
   'Configurable web part title is missing.');
+assert(webPart.indexOf("String(this.properties.title || '').trim()") >= 0,
+  'An empty web part title must remain hidden.');
 assert(service.indexOf('/_api/SP.UserProfiles.PeopleManager/GetPropertiesFor') >= 0, 'User Profile REST access is missing.');
 assert(service.indexOf('/_api/SP.UserProfiles.PeopleManager/GetMyProperties') >= 0,
   'Reliable current-user profile access is missing.');