Chore (release): 5.1.1 (#1678)

* Fix: Build information for feedback and telemetry (#1669)

* Task: Persist sidebar selection (#1664)

* Chore: Update fluentUI package (#1674)

* Bump version to 5.1.1

package.json

@@ -1,14 +1,14 @@
 {
         "name": "graph-explorer-v2",
-        "version": "5.1.0",
+        "version": "5.1.1",
         "private": true,
         "dependencies": {
                 "@augloop/types-core": "file:packages/types-core-2.16.189.tgz",
                 "@axe-core/webdriverjs": "4.4.2",
                 "@azure/msal-browser": "2.23.0",
                 "@babel/core": "7.17.9",
                 "@babel/runtime": "7.17.9",
-                "@fluentui/react": "8.64.1",
+                "@fluentui/react": "8.66.1",
                 "@microsoft/applicationinsights-react-js": "3.2.4",
                 "@microsoft/applicationinsights-web": "2.7.4",
                 "@microsoft/microsoft-graph-client": "3.0.2",

src/app/utils/version.ts

@@ -1,5 +1,5 @@
-import version from '../../../package.json';
+import packageJsonFile from '../../../package.json';
 
 export function getVersion() {
-  return version || 0;
+  return packageJsonFile.version || 0;
 }

src/app/views/App.tsx

@@ -65,6 +65,7 @@ interface IAppState {
   selectedVerb: string;
   mobileScreen: boolean;
   hideDialog: boolean;
+  sidebarTabSelection: string;
 }
 
 class App extends Component<IAppProps, IAppState> {
@@ -78,10 +79,17 @@ class App extends Component<IAppProps, IAppState> {
     this.state = {
       selectedVerb: 'GET',
       mobileScreen: false,
-      hideDialog: true
+      hideDialog: true,
+      sidebarTabSelection: 'sample-queries'
     };
   }
 
+  private setSidebarTabSelection = (selectedTab : string) => {
+    this.setState({
+      sidebarTabSelection: selectedTab
+    });
+  }
+
   public componentDidMount = async () => {
     this.displayToggleButton(this.mediaQueryList);
     this.mediaQueryList.addListener(this.displayToggleButton);
@@ -476,7 +484,8 @@ class App extends Component<IAppProps, IAppState> {
                 {this.displayAuthenticationSection(minimised)}
                 <hr className={classes.separator} />
 
-                {showSidebar && (<Sidebar />)}
+                {showSidebar && ( <Sidebar currentTab = { this.state.sidebarTabSelection }
+                  setSidebarTabSelection = { this.setSidebarTabSelection } /> ) }
               </Resizable>
             )}
             {graphExplorerMode === Mode.TryIt &&

src/app/views/sidebar/Sidebar.tsx

@@ -6,10 +6,25 @@ import { translateMessage } from '../../utils/translate-messages';
 import History from './history/History';
 import { ResourceExplorer } from './resource-explorer';
 import SampleQueries from './sample-queries/SampleQueries';
-export const Sidebar = () => {
+
+interface ISidebar {
+  currentTab: string;
+  setSidebarTabSelection: Function;
+}
+export const Sidebar = (props: ISidebar) => {
+
+  const onPivotItemClick = (item?: PivotItem) => {
+    if (!item) { return; }
+    const key = item.props.itemKey;
+    if (key) {
+      props.setSidebarTabSelection(key);
+      telemetry.trackTabClickEvent(key);
+    }
+  }
+
   return (
     <div>
-      <Pivot onLinkClick={onPivotItemClick} overflowBehavior='menu'>
+      <Pivot onLinkClick={onPivotItemClick} overflowBehavior='menu' defaultSelectedKey={props.currentTab}>
         <PivotItem
           headerText={translateMessage('Sample Queries')}
           itemIcon='Rocket'
@@ -45,10 +60,4 @@ export const Sidebar = () => {
   );
 };
 
-function onPivotItemClick(item?: PivotItem) {
-  if (!item) { return; }
-  const key = item.props.itemKey;
-  if (key) {
-    telemetry.trackTabClickEvent(key);
-  }
-}
+