Use entity name as cluster name in sidebar (#3751)

* Using entity name as cluster name in sidebar

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Use entity name if preferences name is empty

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* simplify

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

Co-authored-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

src/renderer/components/cluster-settings/cluster-settings.tsx

@@ -42,7 +42,7 @@ export function GeneralSettings({ entity }: EntitySettingViewProps) {
       <section>
         <div className="flex">
           <div className="flex-grow pr-8">
-            <components.ClusterNameSetting cluster={cluster} />
+            <components.ClusterNameSetting cluster={cluster} entity={entity as KubernetesCluster} />
           </div>
           <div>
             <components.ClusterIconSetting cluster={cluster} entity={entity as KubernetesCluster} />

src/renderer/components/cluster-settings/components/cluster-name-setting.tsx

@@ -26,9 +26,11 @@ import { observable, autorun, makeObservable } from "mobx";
 import { observer, disposeOnUnmount } from "mobx-react";
 import { SubTitle } from "../../layout/sub-title";
 import { isRequired } from "../../input/input_validators";
+import type { KubernetesCluster } from "../../../../common/catalog-entities";
 
 interface Props {
   cluster: Cluster;
+  entity: KubernetesCluster;
 }
 
 @observer
@@ -43,7 +45,7 @@ export class ClusterNameSetting extends React.Component<Props> {
   componentDidMount() {
     disposeOnUnmount(this,
       autorun(() => {
-        this.name = this.props.cluster.preferences.clusterName;
+        this.name = this.props.cluster.preferences.clusterName || this.props.entity.metadata.name;
       })
     );
   }