@spinnaker/core 0.11.7 → 0.12.0

package/dist/managed/environmentBaseElements/EnvironmentsRender.d.ts

@@ -10,10 +10,11 @@ interface IEnvironmentsRenderProps {
     style?: React.CSSProperties;
     children?: React.ReactNode;
 }
-export declare const useOrderedEnvironment: <T extends object>(ref: React.RefObject<HTMLDivElement>, environments: T[]) => {
+export interface OrderedEnvironments<T> {
     className?: string;
     style?: React.CSSProperties;
     environments: T[];
-};
+}
+export declare const useOrderedEnvironment: <T extends object>(ref: React.RefObject<HTMLDivElement>, environments: T[]) => OrderedEnvironments<T>;
 export declare const EnvironmentsRender: React.ForwardRefExoticComponent<IEnvironmentsRenderProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/managed/graphql/graphql-sdk.d.ts

@@ -106,6 +106,7 @@ export interface MdConfig {
     updatedAt?: Maybe<Scalars['InstantTime']>;
     rawConfig?: Maybe<Scalars['String']>;
     processedConfig?: Maybe<Scalars['String']>;
+    previewEnvironmentsConfigured?: Maybe<Scalars['Boolean']>;
 }
 export interface MdConstraint {
     __typename?: 'MdConstraint';
@@ -467,6 +468,9 @@ export declare type FetchApplicationQuery = {
     application?: Maybe<{
         __typename?: 'MdApplication';
     } & Pick<MdApplication, 'id' | 'name' | 'account'> & {
+        config?: Maybe<{
+            __typename?: 'MdConfig';
+        } & Pick<MdConfig, 'id' | 'previewEnvironmentsConfigured'>>;
         environments: Array<{
             __typename?: 'MdEnvironment';
         } & Pick<MdEnvironment, 'isDeleting'> & {

package/dist/managed/overview/PreviewEnvironments.d.ts

@@ -0,0 +1,8 @@
+import { OrderedEnvironments } from '../environmentBaseElements/EnvironmentsRender';
+import { QueryEnvironment } from './types';
+interface IPreviewEnvironmentsProps {
+    orderedEnvironments: OrderedEnvironments<QueryEnvironment>;
+    isConfigured?: boolean;
+}
+export declare const PreviewEnvironments: ({ orderedEnvironments, isConfigured }: IPreviewEnvironmentsProps) => JSX.Element;
+export {};

package/dist/managed/utils/defaults.d.ts

@@ -8,4 +8,4 @@ export declare const MODAL_MAX_WIDTH = 750;
 export declare const spinnerProps: ISpinnerProps;
 export declare const ABSOLUTE_TIME_FORMAT = "yyyy-MM-dd HH:mm:ss ZZZZ";
 export declare const MD_CATEGORY = "ManagedDelivery";
-export declare const getDocsUrl: (doc: keyof IManagedDeliveryURLs) => string;
+export declare const getDocsUrl: (doc: keyof IManagedDeliveryURLs) => string | undefined;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spinnaker/core",
   "license": "Apache-2.0",
-  "version": "0.11.7",
+  "version": "0.12.0",
   "module": "dist/index.js",
   "typings": "dist/index.d.ts",
   "scripts": {
@@ -120,5 +120,5 @@
     "shx": "0.3.3",
     "typescript": "4.3.5"
   },
-  "gitHead": "5b8914288d87ce58b67de4720ebc623b18a3be3e"
+  "gitHead": "dc5b117bb381113416c21ae8e4c39ec1c526dd2b"
 }

package/src/cloudProvider/providerSelection/ProviderSelectionService.spec.ts

@@ -266,4 +266,100 @@ describe('ProviderSelectionService: API', () => {
     $scope.$digest();
     expect(provider).toBe('modalProvider');
   });
+
+  // Unit tests for the isDisabled function, used to disable and enable buttons that create infrastructure ad-hoc operations
+  // in the core module (Create Server Group, Create Load Balancer, Create Firewall, Create Function)
+  describe('Toggle Infrastructure Ad-hoc Operations', function () {
+    // If an application is configured to only have kubernetes as a cloud provider and only one account exists, which is a kubernetes account,
+    // then show the create infrastructure buttons if kubernetesAdHocInfraWritesEnabled is set to true
+    it('create infrastructure buttons are enabled for applications with kubernetes cloud provider when kubernetesAdHocInfraWritesEnabled is set to true', () => {
+      let isDisabled_result = false;
+      hasValue = true;
+      const k8s_account = fakeAccount('kubernetes');
+      k8s_account.type = 'kubernetes';
+
+      accounts = [k8s_account];
+      let configuration = {
+        name: 'kubernetes',
+        kubernetesAdHocInfraWritesEnabled: true,
+      };
+      CloudProviderRegistry.registerProvider('kubernetes', configuration);
+      ProviderSelectionService.isDisabled(application).then((isDisable) => {
+        isDisabled_result = isDisable;
+      });
+      $scope.$digest();
+      expect(isDisabled_result).toBe(false);
+    });
+
+    // If an application is configured to only have kubernetes as a cloud provider and only one account exists, which is a kubernetes account,
+    // then disable the create infrastructure buttons when kubernetesAdHocInfraWritesEnabled is set to false
+    it('disable create infrastructure buttons for kubernetes applications when kubernetesAdHocInfraWritesEnabled is false', () => {
+      let isDisabled_result = false;
+      hasValue = true;
+      const k8s_account = fakeAccount('kubernetes');
+      k8s_account.type = 'kubernetes';
+
+      accounts = [k8s_account];
+      let configuration = {
+        name: 'kubernetes',
+        kubernetesAdHocInfraWritesEnabled: false,
+      };
+      CloudProviderRegistry.registerProvider('kubernetes', configuration);
+      ProviderSelectionService.isDisabled(application).then((isDisable) => {
+        isDisabled_result = isDisable;
+      });
+      $scope.$digest();
+      expect(isDisabled_result).toBe(true);
+    });
+
+    // If the application is configured to have multiple cloud providers (kuberentes and gce) and different accounts exist with
+    // different cloud providers (kuberentes and gce), then create infrastructure buttons appear even though kubernetesAdHocInfraWritesEnabled is false.
+    // This is because the buttons allow for ad-hoc operations for the non-kubernetes provider (GCE in this case)
+    it('create infrastructure buttons are enabled for apps with a cloud provider that does not have its ad-hoc operation disabled', () => {
+      let provider = '';
+      hasValue = true;
+      let isDisabled_result = false;
+      const k8s_account = fakeAccount('kubernetes');
+      k8s_account.type = 'kubernetes';
+      accounts = [k8s_account, fakeAccount('gce')];
+      let kubernetes_configuration = {
+        name: 'Kubernetes',
+        kubernetesAdHocInfraWritesEnabled: false,
+      };
+      CloudProviderRegistry.registerProvider('kubernetes', kubernetes_configuration);
+      CloudProviderRegistry.registerProvider('gce', config);
+      ProviderSelectionService.selectProvider(application, 'securityGroup').then((_provider) => {
+        provider = _provider;
+      });
+      ProviderSelectionService.isDisabled(application).then((isDisable) => {
+        isDisabled_result = isDisable;
+      });
+      $scope.$digest();
+      expect(isDisabled_result).toBe(false);
+      expect(provider).toBe('gce');
+    });
+
+    // If an application is configured to have kubernetes as a cloud provider, and there are multiple kubernetes accounts, then the create
+    // infrastructure buttons are disabled if kubernetesAdHocInfraWritesEnabled is false
+    it('create infrastructure buttons are disabled when all accounts have cloud providers with ad-hoc operations disabled', () => {
+      let isDisabled_result = false;
+      hasValue = true;
+      const k8s_account_1 = fakeAccount('kubernetes');
+      k8s_account_1.type = 'kubernetes';
+      const k8s_account_2 = fakeAccount('kubernetes');
+      k8s_account_2.type = 'kubernetes';
+
+      accounts = [k8s_account_1, k8s_account_2];
+      let configuration = {
+        name: 'kubernetes',
+        kubernetesAdHocInfraWritesEnabled: false,
+      };
+      CloudProviderRegistry.registerProvider('kubernetes', configuration);
+      ProviderSelectionService.isDisabled(application).then((isDisable) => {
+        isDisabled_result = isDisable;
+      });
+      $scope.$digest();
+      expect(isDisabled_result).toBe(true);
+    });
+  });
 });

package/src/cloudProvider/providerSelection/ProviderSelectionService.ts

@@ -53,14 +53,12 @@ export class ProviderSelectionService {
   public static isDisabled(app: Application): PromiseLike<boolean> {
     return AccountService.applicationAccounts(app).then((accounts: IAccountDetails[]) => {
       let isDisable = false;
-      if (accounts.length === 1) {
-        accounts
-          .filter((a) => {
-            return CloudProviderRegistry.hasValue(a.cloudProvider, 'kubernetesAdHocInfraWritesEnabled');
-          })
-          .map((a) => {
-            isDisable = !CloudProviderRegistry.getValue(a.cloudProvider, 'kubernetesAdHocInfraWritesEnabled');
-          });
+      const cloudProvidersEnabled = accounts.filter((a) => {
+        return !CloudProviderRegistry.isDisabled(a.cloudProvider);
+      });
+
+      if (cloudProvidersEnabled.length === 0) {
+        isDisable = true;
       }
       return isDisable;
     });

package/src/cluster/allClusters.html

@@ -6,6 +6,7 @@
           class="btn btn-xs btn-default"
           ng-class="{active: filterModel.sortFilter.multiselect}"
           ng-click="ctrl.toggleMultiselect()"
+          ng-hide="isDisabled"
         >
           <span class="glyphicon glyphicon-list visible-lg-inline"></span>
           <span class="glyphicon glyphicon-list visible-md-inline visible-sm-inline" uib-tooltip="Edit multiple"></span>

package/src/config/settings.ts

@@ -73,6 +73,7 @@ export interface IManagedDeliveryURLs {
   pinning: string;
   resourceStatus: string;
   markAsBad: string;
+  previewEnvironments?: string;
 }
 
 export interface ISpinnakerSettings {
@@ -157,6 +158,7 @@ export const SETTINGS: ISpinnakerSettings = (window as any).spinnakerSettings ||
 // Make sure to set up some reasonable default settings fields so we do not have to keep checking if they exist everywhere
 SETTINGS.feature = SETTINGS.feature || {};
 SETTINGS.feature.roscoMode = SETTINGS.feature.roscoMode ?? true;
+SETTINGS.kubernetesAdHocInfraWritesEnabled = SETTINGS.kubernetesAdHocInfraWritesEnabled ?? true;
 SETTINGS.analytics = SETTINGS.analytics || {};
 SETTINGS.providers = SETTINGS.providers || {};
 SETTINGS.defaultTimeZone = SETTINGS.defaultTimeZone || 'America/Los_Angeles';

package/src/instance/details/multipleInstances.controller.js

@@ -3,6 +3,7 @@
 import UIROUTER_ANGULARJS from '@uirouter/angularjs';
 import { module } from 'angular';
 
+import { ProviderSelectionService } from '../../cloudProvider/providerSelection/ProviderSelectionService';
 import { ConfirmationModalService } from '../../confirmationModal';
 import { InstanceWriter } from '../instance.write.service';
 import { CORE_INSTANCE_DETAILS_MULTIPLEINSTANCESERVERGROUP_DIRECTIVE } from './multipleInstanceServerGroup.directive';
@@ -20,6 +21,11 @@ module(CORE_INSTANCE_DETAILS_MULTIPLEINSTANCES_CONTROLLER, [
   'app',
   function ($scope, $state, app) {
     this.selectedGroups = [];
+    this.$onInit = () => {
+      ProviderSelectionService.isDisabled(app).then((disabled) => {
+        $scope.isDisabled = disabled;
+      });
+    };
 
     /**
      * Actions

package/src/instance/details/multipleInstances.view.html

@@ -16,6 +16,7 @@
             type="button"
             class="btn btn-sm btn-primary dropdown-toggle"
             ng-disabled="disabled"
+            ng-hide="isDisabled"
             uib-dropdown-toggle
           >
             Actions <span class="caret"></span>

package/src/managed/environmentBaseElements/EnvironmentsRender.tsx

@@ -65,10 +65,16 @@ interface IEnvironmentsRenderProps {
   children?: React.ReactNode;
 }
 
+export interface OrderedEnvironments<T> {
+  className?: string;
+  style?: React.CSSProperties;
+  environments: T[];
+}
+
 export const useOrderedEnvironment = <T extends object>(
   ref: React.RefObject<HTMLDivElement>,
   environments: T[],
-): { className?: string; style?: React.CSSProperties; environments: T[] } => {
+): OrderedEnvironments<T> => {
   const { direction } = useEnvironmentDirectionState();
   const { width } = useDimensions(ref, { isActive: direction === 'gridView' });
 

package/src/managed/graphql/graphql-sdk.ts

@@ -120,6 +120,7 @@ export interface MdConfig {
   updatedAt?: Maybe<Scalars['InstantTime']>;
   rawConfig?: Maybe<Scalars['String']>;
   processedConfig?: Maybe<Scalars['String']>;
+  previewEnvironmentsConfigured?: Maybe<Scalars['Boolean']>;
 }
 
 export interface MdConstraint {
@@ -545,6 +546,7 @@ export type FetchApplicationQueryVariables = Exact<{
 export type FetchApplicationQuery = { __typename?: 'Query' } & {
   application?: Maybe<
     { __typename?: 'MdApplication' } & Pick<MdApplication, 'id' | 'name' | 'account'> & {
+        config?: Maybe<{ __typename?: 'MdConfig' } & Pick<MdConfig, 'id' | 'previewEnvironmentsConfigured'>>;
         environments: Array<
           { __typename?: 'MdEnvironment' } & Pick<MdEnvironment, 'isDeleting'> & {
               state: { __typename?: 'MdEnvironmentState' } & Pick<MdEnvironmentState, 'id'> & {
@@ -937,6 +939,10 @@ export const FetchApplicationDocument = gql`
       id
       name
       account
+      config {
+        id
+        previewEnvironmentsConfigured
+      }
       environments {
         ...baseEnvironmentFields
         isDeleting

package/src/managed/graphql/schema.graphql

@@ -31,6 +31,7 @@ type MdConfig {
   updatedAt: InstantTime
   rawConfig: String
   processedConfig: String
+  previewEnvironmentsConfigured: Boolean
 }
 
 type MdEnvironment {

package/src/managed/overview/EnvironmentsOverview.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 
 import { ApplicationQueryError } from '../ApplicationQueryError';
 import { EnvironmentOverview } from './EnvironmentOverview';
+import { PreviewEnvironments } from './PreviewEnvironments';
 import { EnvironmentsRender, useOrderedEnvironment } from '../environmentBaseElements/EnvironmentsRender';
 import { useFetchApplicationQuery } from '../graphql/graphql-sdk';
 import { Messages } from '../messages/Messages';
@@ -25,11 +26,13 @@ export const EnvironmentsOverview = () => {
     environments.filter((env) => !env.isPreview),
   );
 
-  const { environments: previewEnvironments, ...previewEnvironmentsProps } = useOrderedEnvironment(
+  const previewEnvironments = useOrderedEnvironment(
     wrapperRef,
     environments.filter((env) => env.isPreview),
   );
 
+  const previewEnvironmentsConfigured = data?.application?.config?.previewEnvironmentsConfigured;
+
   let content;
   if (loading && !data) {
     content = <Spinner {...spinnerProps} message="Loading environments..." />;
@@ -46,16 +49,10 @@ export const EnvironmentsOverview = () => {
                 <EnvironmentOverview key={env.name} environment={env} />
               ))}
             </EnvironmentsRender>
-            {Boolean(previewEnvironments.length) && (
-              <h4 className="sp-margin-2xl-top sp-margin-m-bottom self-left">
-                <b>Preview Environments</b>
-              </h4>
-            )}
-            <EnvironmentsRender {...previewEnvironmentsProps}>
-              {previewEnvironments.map((env) => (
-                <EnvironmentOverview key={env.name} environment={env} />
-              ))}
-            </EnvironmentsRender>
+            <PreviewEnvironments
+              orderedEnvironments={previewEnvironments}
+              isConfigured={previewEnvironmentsConfigured}
+            />
           </>
         ) : (
           <div className="error-message">No environments found</div>

package/src/managed/overview/PreviewEnvironments.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+
+import { EnvironmentOverview } from './EnvironmentOverview';
+import { EnvironmentsRender, OrderedEnvironments } from '../environmentBaseElements/EnvironmentsRender';
+import { QueryEnvironment } from './types';
+import { getDocsUrl } from '../utils/defaults';
+import { useLogEvent } from '../utils/logging';
+
+interface IPreviewEnvironmentsProps {
+  orderedEnvironments: OrderedEnvironments<QueryEnvironment>;
+  isConfigured?: boolean;
+}
+
+export const PreviewEnvironments = ({ orderedEnvironments, isConfigured }: IPreviewEnvironmentsProps) => {
+  const { environments: previewEnvironments, ...previewEnvironmentsProps } = orderedEnvironments;
+  const logClick = useLogEvent('PreviewEnvironments');
+  const docsLink = getDocsUrl('previewEnvironments');
+  const hasActivePreviewEnvironments = previewEnvironments.length > 0;
+
+  return (
+    <>
+      {(isConfigured || hasActivePreviewEnvironments) && (
+        <h4 className="sp-margin-2xl-top sp-margin-m-bottom self-left">
+          <b>Preview Environments</b>
+        </h4>
+      )}
+      {isConfigured && !hasActivePreviewEnvironments && (
+        <div className="self-left">
+          No PRs matching your branch filter were found.
+          <br />
+          Your preview environments will automatically appear here once you create a PR from a branch matching your
+          config definition.{' '}
+          {docsLink && (
+            <a target="_blank" onClick={() => logClick({ action: 'Learn More' })} href={docsLink}>
+              Learn More
+            </a>
+          )}
+        </div>
+      )}
+      <EnvironmentsRender {...previewEnvironmentsProps}>
+        {previewEnvironments.map((env) => (
+          <EnvironmentOverview key={env.name} environment={env} />
+        ))}
+      </EnvironmentsRender>
+    </>
+  );
+};

package/src/managed/overview/queries.graphql

@@ -95,6 +95,10 @@ query fetchApplication($appName: String!, $statuses: [MdArtifactStatusInEnvironm
     id
     name
     account
+    config {
+      id
+      previewEnvironmentsConfigured
+    }
     environments {
       ...baseEnvironmentFields
       isDeleting

package/src/managed/utils/defaults.ts

@@ -26,6 +26,6 @@ const DOCS_URLS: IManagedDeliveryURLs = {
   resourceStatus: 'https://www.spinnaker.io/guides/user/managed-delivery/resource-status/',
 };
 
-export const getDocsUrl = (doc: keyof IManagedDeliveryURLs): string => {
+export const getDocsUrl = (doc: keyof IManagedDeliveryURLs): string | undefined => {
   return SETTINGS.managedDelivery?.urls?.[doc] || DOCS_URLS[doc];
 };

package/src/serverGroup/details/multipleServerGroups.controller.js

@@ -3,6 +3,7 @@
 import UIROUTER_ANGULARJS from '@uirouter/angularjs';
 import * as angular from 'angular';
 
+import { ProviderSelectionService } from '../../cloudProvider/providerSelection/ProviderSelectionService';
 import { PROVIDER_SERVICE_DELEGATE } from '../../cloudProvider/providerService.delegate';
 import { ConfirmationModalService } from '../../confirmationModal';
 import { CORE_SERVERGROUP_DETAILS_MULTIPLESERVERGROUP_COMPONENT } from './multipleServerGroup.component';
@@ -27,6 +28,11 @@ angular
     'app',
     function ($scope, $state, serverGroupWriter, providerServiceDelegate, app) {
       this.serverGroups = [];
+      this.$onInit = () => {
+        ProviderSelectionService.isDisabled(app).then((disabled) => {
+          $scope.isDisabled = disabled;
+        });
+      };
 
       /**
        * Actions

package/src/serverGroup/details/multipleServerGroups.view.html

@@ -16,6 +16,7 @@
             type="button"
             class="btn btn-sm btn-primary dropdown-toggle"
             ng-disabled="disabled"
+            ng-hide="isDisabled"
             uib-dropdown-toggle
           >
             Actions <span class="caret"></span>

package/src/utils/clipboard/CopyToClipboard.tsx

@@ -93,7 +93,7 @@ export class CopyToClipboard extends React.Component<ICopyToClipboardProps, ICop
 
     const persistOverlay = Boolean(tooltipCopy);
     const copy = tooltipCopy || toolTip;
-    const id = `clipboardValue-${text.replace(' ', '-')}`;
+    const id = `clipboardValue-${text.toString().replace(' ', '-')}`;
     const tooltipComponent = <Tooltip id={id}>{copy}</Tooltip>;
 
     // Hack - shouldUpdatePosition is a valid prop, just not declared in typings