refactor(stacks): extract auto update logic [EE-4945] (#8545)

2025-08-05 05:45:22 +02:00 · 2023-03-02 17:07:50 +02:00 · 2023-03-02 17:07:50 +02:00 · 6918da2414
commit 6918da2414
parent 085381e6fc
42 changed files with 410 additions and 166 deletions
--- a/app/kubernetes/views/applications/create/createApplicationController.js
+++ b/app/kubernetes/views/applications/create/createApplicationController.js
@ -199,7 +199,7 @@ class KubernetesCreateApplicationController {
        }

        this.state.updateWebEditorInProgress = true;
-        await this.StackService.updateKubeStack({ EndpointId: this.endpoint.Id, Id: this.application.StackId }, this.stackFileContent, null);
+        await this.StackService.updateKubeStack({ EndpointId: this.endpoint.Id, Id: this.application.StackId }, { stackFile: this.stackFileContent });
        this.state.isEditorDirty = false;
        await this.$state.reload(this.$state.current);
      } catch (err) {
--- a/app/kubernetes/views/deploy/deploy.html
+++ b/app/kubernetes/views/deploy/deploy.html
@ -84,6 +84,8 @@
                  is-auth-explanation-visible="true"
                  deploy-method="{{ ctrl.state.DeployType === ctrl.ManifestDeployTypes.COMPOSE ? 'compose' : 'manifest' }}"
                  base-webhook-url="{{ ctrl.state.baseWebhookUrl }}"
+                  webhook-id="{{ ctrl.state.webhookId }}"
+                  webhooks-docs="https://docs.portainer.io/user/kubernetes/applications/webhooks"
                ></git-form>
                <!-- !repository -->

--- a/app/kubernetes/views/deploy/deployController.js
+++ b/app/kubernetes/views/deploy/deployController.js
@ -9,7 +9,7 @@ import { isBE } from '@/react/portainer/feature-flags/feature-flags.service';
 import { kubernetes } from '@@/BoxSelector/common-options/deployment-methods';
 import { editor, git, customTemplate, url } from '@@/BoxSelector/common-options/build-methods';
 import { parseAutoUpdateResponse, transformAutoUpdateViewModel } from '@/react/portainer/gitops/AutoUpdateFieldset/utils';
-import { baseStackWebhookUrl } from '@/portainer/helpers/webhookHelper';
+import { baseStackWebhookUrl, createWebhookId } from '@/portainer/helpers/webhookHelper';
 import { confirmWebEditorDiscard } from '@@/modals/confirm';

 class KubernetesDeployController {
@ -45,6 +45,7 @@ class KubernetesDeployController {
      templateId: null,
      template: null,
      baseWebhookUrl: baseStackWebhookUrl(),
+      webhookId: createWebhookId(),
    };

    this.formValues = {
@ -256,7 +257,7 @@ class KubernetesDeployController {
        }
        payload.ManifestFile = this.formValues.ComposeFilePathInRepository;
        payload.AdditionalFiles = this.formValues.AdditionalFiles;
-        payload.AutoUpdate = transformAutoUpdateViewModel(this.formValues.AutoUpdate);
+        payload.AutoUpdate = transformAutoUpdateViewModel(this.formValues.AutoUpdate, this.state.webhookId);
      } else if (method === KubernetesDeployRequestMethods.STRING) {
        payload.StackFileContent = this.formValues.EditorContent;
      } else {
--- a/app/portainer/components/forms/git-form/git-form-auto-update-fieldset.ts
+++ b/app/portainer/components/forms/git-form/git-form-auto-update-fieldset.ts
@ -10,6 +10,8 @@ export const gitFormAutoUpdate: IComponentOptions = {
    environment-type="$ctrl.environmentType"
    is-force-pull-visible="$ctrl.isForcePullVisible"
    base-webhook-url="$ctrl.baseWebhookUrl"
+    webhook-id="$ctrl.webhookId"
+    webhooks-docs="$ctrl.webhooksDocs"
    errors="$ctrl.errors">
    </react-git-form-auto-update-fieldset>
  </ng-form>`,
@ -19,6 +21,8 @@ export const gitFormAutoUpdate: IComponentOptions = {
    environmentType: '@',
    isForcePullVisible: '<',
    baseWebhookUrl: '@',
+    webhookId: '@',
+    webhooksDocs: '@',
  },
  controller,
 };
--- a/app/portainer/components/forms/git-form/git-form.ts
+++ b/app/portainer/components/forms/git-form/git-form.ts
@ -11,10 +11,11 @@ export const gitForm: IComponentOptions = {
    is-docker-standalone="$ctrl.isDockerStandalone"
    deploy-method="$ctrl.deployMethod"
    is-additional-files-field-visible="$ctrl.isAdditionalFilesFieldVisible"
-    is-auto-update-visible="$ctrl.isAutoUpdateVisible"
    is-force-pull-visible="$ctrl.isForcePullVisible"
    is-auth-explanation-visible="$ctrl.isAuthExplanationVisible"
    base-webhook-url="$ctrl.baseWebhookUrl"
+    webhook-id="$ctrl.webhookId"
+    webhooks-docs="$ctrl.webhooksDocs"
    errors="$ctrl.errors">
  </react-git-form>
 </ng-form>`,
@ -25,9 +26,10 @@ export const gitForm: IComponentOptions = {
    deployMethod: '@',
    baseWebhookUrl: '@',
    isAdditionalFilesFieldVisible: '<',
-    isAutoUpdateVisible: '<',
    isForcePullVisible: '<',
    isAuthExplanationVisible: '<',
+    webhookId: '@',
+    webhooksDocs: '@',
  },
  controller,
 };
--- a/app/portainer/components/forms/kubernetes-redeploy-app-git-form/kubernetes-redeploy-app-git-form.controller.js
+++ b/app/portainer/components/forms/kubernetes-redeploy-app-git-form/kubernetes-redeploy-app-git-form.controller.js
@ -3,7 +3,7 @@ import { confirm } from '@@/modals/confirm';
 import { buildConfirmButton } from '@@/modals/utils';
 import { ModalType } from '@@/modals';
 import { parseAutoUpdateResponse } from '@/react/portainer/gitops/AutoUpdateFieldset/utils';
-import { baseStackWebhookUrl } from '@/portainer/helpers/webhookHelper';
+import { baseStackWebhookUrl, createWebhookId } from '@/portainer/helpers/webhookHelper';

 class KubernetesRedeployAppGitFormController {
  /* @ngInject */
@ -20,6 +20,7 @@ class KubernetesRedeployAppGitFormController {
      isEdit: false,
      hasUnsavedChanges: false,
      baseWebhookUrl: baseStackWebhookUrl(),
+      webhookId: createWebhookId(),
    };

    this.formValues = {
@ -117,7 +118,7 @@ class KubernetesRedeployAppGitFormController {
    return this.$async(async () => {
      try {
        this.state.saveGitSettingsInProgress = true;
-        await this.StackService.updateKubeStack({ EndpointId: this.stack.EndpointId, Id: this.stack.Id }, null, this.formValues);
+        await this.StackService.updateKubeStack({ EndpointId: this.stack.EndpointId, Id: this.stack.Id }, { gitConfig: this.formValues, webhookId: this.state.webhookId });
        this.savedFormValues = angular.copy(this.formValues);
        this.state.hasUnsavedChanges = false;
        this.Notifications.success('Success', 'Save stack settings successfully');
@ -138,6 +139,10 @@ class KubernetesRedeployAppGitFormController {

    this.formValues.AutoUpdate = parseAutoUpdateResponse(this.stack.AutoUpdate);

+    if (this.stack.AutoUpdate.Webhook) {
+      this.state.webhookId = this.stack.AutoUpdate.Webhook;
+    }
+
    if (this.stack.GitConfig && this.stack.GitConfig.Authentication) {
      this.formValues.RepositoryUsername = this.stack.GitConfig.Authentication.Username;
      this.formValues.RepositoryAuthentication = true;
--- a/app/portainer/components/forms/kubernetes-redeploy-app-git-form/kubernetes-redeploy-app-git-form.html
+++ b/app/portainer/components/forms/kubernetes-redeploy-app-git-form/kubernetes-redeploy-app-git-form.html
@ -10,6 +10,8 @@
    on-change="($ctrl.onChangeAutoUpdate)"
    environment-type="KUBERNETES"
    base-webhook-url="{{ $ctrl.state.baseWebhookUrl }}"
+    webhook-id="{{ $ctrl.state.webhookId }}"
+    webhooks-docs="https://docs.portainer.io/user/kubernetes/applications/webhooks"
  ></git-form-auto-update-fieldset>
  <time-window-display></time-window-display>

--- a/app/portainer/components/forms/stack-redeploy-git-form/stack-redeploy-git-form.controller.js
+++ b/app/portainer/components/forms/stack-redeploy-git-form/stack-redeploy-git-form.controller.js
@ -3,7 +3,7 @@ import { FeatureId } from '@/react/portainer/feature-flags/enums';
 import { confirmStackUpdate } from '@/react/docker/stacks/common/confirm-stack-update';

 import { parseAutoUpdateResponse } from '@/react/portainer/gitops/AutoUpdateFieldset/utils';
-import { baseStackWebhookUrl } from '@/portainer/helpers/webhookHelper';
+import { baseStackWebhookUrl, createWebhookId } from '@/portainer/helpers/webhookHelper';

 class StackRedeployGitFormController {
  /* @ngInject */
@ -23,6 +23,7 @@ class StackRedeployGitFormController {
      isEdit: false,
      hasUnsavedChanges: false,
      baseWebhookUrl: baseStackWebhookUrl(),
+      webhookId: createWebhookId(),
    };

    this.formValues = {
@ -132,7 +133,8 @@ class StackRedeployGitFormController {
          this.stack.Id,
          this.stack.EndpointId,
          this.FormHelper.removeInvalidEnvVars(this.formValues.Env),
-          this.formValues
+          this.formValues,
+          this.state.webhookId
        );
        this.savedFormValues = angular.copy(this.formValues);
        this.state.hasUnsavedChanges = false;
@ -180,6 +182,10 @@ class StackRedeployGitFormController {

    this.formValues.AutoUpdate = parseAutoUpdateResponse(this.stack.AutoUpdate);

+    if (this.stack.AutoUpdate.Webhook) {
+      this.state.webhookId = this.stack.AutoUpdate.Webhook;
+    }
+
    if (this.stack.GitConfig && this.stack.GitConfig.Authentication) {
      this.formValues.RepositoryUsername = this.stack.GitConfig.Authentication.Username;
      this.formValues.RepositoryAuthentication = true;
--- a/app/portainer/components/forms/stack-redeploy-git-form/stack-redeploy-git-form.html
+++ b/app/portainer/components/forms/stack-redeploy-git-form/stack-redeploy-git-form.html
@ -14,6 +14,8 @@
    environment-type="DOCKER"
    is-force-pull-visible="$ctrl.stack.Type !== 3"
    base-webhook-url="{{ $ctrl.state.baseWebhookUrl }}"
+    webhook-id="{{ $ctrl.state.webhookId }}"
+    webhooks-docs="https://docs.portainer.io/user/docker/stacks/webhooks"
  ></git-form-auto-update-fieldset>
  <div class="form-group">
    <div class="col-sm-12">
--- a/app/portainer/helpers/webhookHelper.ts
+++ b/app/portainer/helpers/webhookHelper.ts
@ -1,3 +1,5 @@
+import uuid from 'uuid';
+
 import { API_ENDPOINT_STACKS, API_ENDPOINT_WEBHOOKS } from '@/constants';

 import { baseHref } from './pathHelper';
@ -16,6 +18,10 @@ export function stackWebhookUrl(token: string) {
  return `${baseStackWebhookUrl()}/${token}`;
 }

+export function createWebhookId() {
+  return uuid();
+}
+
 /* @ngInject */
 export function WebhookHelperFactory() {
  return {
--- a/app/portainer/react/components/git-form.ts
+++ b/app/portainer/react/components/git-form.ts
@ -25,6 +25,8 @@ export const gitFormModule = angular
      'isAuthExplanationVisible',
      'errors',
      'baseWebhookUrl',
+      'webhookId',
+      'webhooksDocs',
    ])
  )
  .component(
@ -46,6 +48,8 @@ export const gitFormModule = angular
      'isForcePullVisible',
      'errors',
      'baseWebhookUrl',
+      'webhookId',
+      'webhooksDocs',
    ])
  )
  .component(
--- a/app/portainer/services/api/stackService.js
+++ b/app/portainer/services/api/stackService.js
@ -270,7 +270,7 @@ angular.module('portainer.app').factory('StackService', [
      ).$promise;
    };

-    service.updateKubeStack = function (stack, stackFile, gitConfig) {
+    service.updateKubeStack = function (stack, { stackFile, gitConfig, webhookId }) {
      let payload = {};

      if (stackFile) {
@ -279,7 +279,7 @@ angular.module('portainer.app').factory('StackService', [
        };
      } else {
        payload = {
-          AutoUpdate: transformAutoUpdateViewModel(gitConfig.AutoUpdate),
+          AutoUpdate: transformAutoUpdateViewModel(gitConfig.AutoUpdate, webhookId),
          RepositoryReferenceName: gitConfig.RefName,
          RepositoryAuthentication: gitConfig.RepositoryAuthentication,
          RepositoryUsername: gitConfig.RepositoryUsername,
@ -455,11 +455,11 @@ angular.module('portainer.app').factory('StackService', [
      ).$promise;
    }

-    service.updateGitStackSettings = function (id, endpointId, env, gitConfig) {
+    service.updateGitStackSettings = function (id, endpointId, env, gitConfig, webhookId) {
      return Stack.updateGitStackSettings(
        { endpointId, id },
        {
-          AutoUpdate: transformAutoUpdateViewModel(gitConfig.AutoUpdate),
+          AutoUpdate: transformAutoUpdateViewModel(gitConfig.AutoUpdate, webhookId),
          Env: env,
          RepositoryReferenceName: gitConfig.RefName,
          RepositoryAuthentication: gitConfig.RepositoryAuthentication,
--- a/app/portainer/views/stacks/create/createStackController.js
+++ b/app/portainer/views/stacks/create/createStackController.js
@ -9,7 +9,7 @@ import { renderTemplate } from '@/react/portainer/custom-templates/components/ut
 import { editor, upload, git, customTemplate } from '@@/BoxSelector/common-options/build-methods';
 import { confirmWebEditorDiscard } from '@@/modals/confirm';
 import { parseAutoUpdateResponse, transformAutoUpdateViewModel } from '@/react/portainer/gitops/AutoUpdateFieldset/utils';
-import { baseStackWebhookUrl } from '@/portainer/helpers/webhookHelper';
+import { baseStackWebhookUrl, createWebhookId } from '@/portainer/helpers/webhookHelper';

 angular
  .module('portainer.app')
@ -70,6 +70,7 @@ angular
        selectedTemplate: null,
        selectedTemplateId: null,
        baseWebhookUrl: baseStackWebhookUrl(),
+        webhookId: createWebhookId(),
      };

      $window.onbeforeunload = () => {
@ -153,6 +154,7 @@ angular
      function createSwarmStack(name, method) {
        var env = FormHelper.removeInvalidEnvVars($scope.formValues.Env);
        const endpointId = +$state.params.endpointId;
+
        if (method === 'template' || method === 'editor') {
          var stackFileContent = $scope.formValues.StackFileContent;
          return StackService.createSwarmStackFromFileContent(name, stackFileContent, env, endpointId);
@ -172,7 +174,7 @@ angular
            RepositoryAuthentication: $scope.formValues.RepositoryAuthentication,
            RepositoryUsername: $scope.formValues.RepositoryUsername,
            RepositoryPassword: $scope.formValues.RepositoryPassword,
-            AutoUpdate: transformAutoUpdateViewModel($scope.formValues.AutoUpdate),
+            AutoUpdate: transformAutoUpdateViewModel($scope.formValues.AutoUpdate, $scope.state.webhookId),
          };

          return StackService.createSwarmStackFromGitRepository(name, repositoryOptions, env, endpointId);
@ -198,7 +200,7 @@ angular
            RepositoryAuthentication: $scope.formValues.RepositoryAuthentication,
            RepositoryUsername: $scope.formValues.RepositoryUsername,
            RepositoryPassword: $scope.formValues.RepositoryPassword,
-            AutoUpdate: transformAutoUpdateViewModel($scope.formValues.AutoUpdate),
+            AutoUpdate: transformAutoUpdateViewModel($scope.formValues.AutoUpdate, $scope.state.webhookId),
          };

          return StackService.createComposeStackFromGitRepository(name, repositoryOptions, env, endpointId);
--- a/app/portainer/views/stacks/create/createstack.html
+++ b/app/portainer/views/stacks/create/createstack.html
@ -83,10 +83,11 @@
            on-change="(onChangeFormValues)"
            is-docker-standalone="isDockerStandalone"
            is-additional-files-field-visible="true"
-            is-auto-update-visible="true"
            is-auth-explanation-visible="true"
            is-force-pull-visible="true"
            base-webhook-url="{{ state.baseWebhookUrl }}"
+            webhook-id="{{ state.webhookId }}"
+            webhooks-docs="https://docs.portainer.io/user/docker/stacks/webhooks"
          ></git-form>

          <div ng-show="state.Method === 'template'">
--- a/app/react/portainer/gitops/AutoUpdateFieldset/AutoUpdateFieldset.tsx
+++ b/app/react/portainer/gitops/AutoUpdateFieldset/AutoUpdateFieldset.tsx
@ -14,6 +14,8 @@ export function AutoUpdateFieldset({
  isForcePullVisible = true,
  errors,
  baseWebhookUrl,
+  webhookId,
+  webhooksDocs,
 }: {
  value: AutoUpdateModel;
  onChange: (value: AutoUpdateModel) => void;
@ -21,6 +23,8 @@ export function AutoUpdateFieldset({
  isForcePullVisible?: boolean;
  errors?: FormikErrors<AutoUpdateModel>;
  baseWebhookUrl: string;
+  webhookId: string;
+  webhooksDocs?: string;
 }) {
  return (
    <>
@ -45,12 +49,14 @@ export function AutoUpdateFieldset({

      {value.RepositoryAutomaticUpdates && (
        <AutoUpdateSettings
+          webhookId={webhookId}
          baseWebhookUrl={baseWebhookUrl}
          value={value}
          onChange={handleChange}
          environmentType={environmentType}
          showForcePullImage={isForcePullVisible}
          errors={errors}
+          webhookDocs={webhooksDocs}
        />
      )}
    </>
--- a/app/react/portainer/gitops/AutoUpdateFieldset/AutoUpdateSettings.tsx
+++ b/app/react/portainer/gitops/AutoUpdateFieldset/AutoUpdateSettings.tsx
@ -19,6 +19,8 @@ export function AutoUpdateSettings({
  showForcePullImage,
  errors,
  baseWebhookUrl,
+  webhookId,
+  webhookDocs,
 }: {
  value: AutoUpdateModel;
  onChange: (value: Partial<AutoUpdateModel>) => void;
@ -26,6 +28,8 @@ export function AutoUpdateSettings({
  showForcePullImage: boolean;
  errors?: FormikErrors<AutoUpdateModel>;
  baseWebhookUrl: string;
+  webhookId: string;
+  webhookDocs?: string;
 }) {
  return (
    <>
@ -50,12 +54,8 @@ export function AutoUpdateSettings({
      {value.RepositoryMechanism === 'Webhook' && (
        <WebhookSettings
          baseUrl={baseWebhookUrl}
-          value={value.RepositoryWebhookId || ''}
-          docsLink={
-            environmentType === 'KUBERNETES'
-              ? 'https://docs.portainer.io/user/kubernetes/applications/webhooks'
-              : 'https://docs.portainer.io/user/docker/stacks/webhooks'
-          }
+          value={webhookId}
+          docsLink={webhookDocs}
        />
      )}

--- a/app/react/portainer/gitops/AutoUpdateFieldset/WebhookSettings.tsx
+++ b/app/react/portainer/gitops/AutoUpdateFieldset/WebhookSettings.tsx
@ -8,7 +8,7 @@ export function WebhookSettings({
  baseUrl,
  docsLink,
 }: {
-  docsLink: string;
+  docsLink?: string;
  value: string;
  baseUrl: string;
 }) {
@ -18,13 +18,15 @@ export function WebhookSettings({
    <FormControl
      label="Webhook"
      tooltip={
-        <>
-          See{' '}
-          <a href={docsLink} target="_blank" rel="noreferrer">
-            Portainer documentation on webhook usage
-          </a>
-          .
-        </>
+        !!docsLink && (
+          <>
+            See{' '}
+            <a href={docsLink} target="_blank" rel="noreferrer">
+              Portainer documentation on webhook usage
+            </a>
+            .
+          </>
+        )
      }
    >
      <div className="flex items-center gap-2">
--- a/app/react/portainer/gitops/AutoUpdateFieldset/utils.ts
+++ b/app/react/portainer/gitops/AutoUpdateFieldset/utils.ts
@ -1,5 +1,3 @@
-import { v4 as uuid } from 'uuid';
-
 import { AutoUpdateResponse, AutoUpdateModel } from '../types';

 export function parseAutoUpdateResponse(
@ -11,7 +9,6 @@ export function parseAutoUpdateResponse(
      RepositoryAutomaticUpdatesForce: false,
      RepositoryMechanism: 'Interval',
      RepositoryFetchInterval: '5m',
-      RepositoryWebhookId: uuid(),
      ForcePullImage: false,
    };
  }
@ -20,28 +17,30 @@ export function parseAutoUpdateResponse(
    RepositoryAutomaticUpdates: true,
    RepositoryMechanism: response.Interval ? 'Interval' : 'Webhook',
    RepositoryFetchInterval: response.Interval || '',
-    RepositoryWebhookId: response.Webhook || uuid(),
    RepositoryAutomaticUpdatesForce: response.ForceUpdate,
    ForcePullImage: response.ForcePullImage,
  };
 }

 export function transformAutoUpdateViewModel(
-  viewModel?: AutoUpdateModel
+  viewModel?: AutoUpdateModel,
+  webhookId?: string
 ): AutoUpdateResponse | null {
  if (!viewModel || !viewModel.RepositoryAutomaticUpdates) {
    return null;
  }

+  if (viewModel.RepositoryMechanism === 'Webhook' && !webhookId) {
+    throw new Error('Webhook ID is required');
+  }
+
  return {
    Interval:
      viewModel.RepositoryMechanism === 'Interval'
        ? viewModel.RepositoryFetchInterval
        : '',
    Webhook:
-      viewModel.RepositoryMechanism === 'Webhook'
-        ? viewModel.RepositoryWebhookId
-        : '',
+      viewModel.RepositoryMechanism === 'Webhook' && webhookId ? webhookId : '',
    ForceUpdate: viewModel.RepositoryAutomaticUpdatesForce,
    ForcePullImage: viewModel.ForcePullImage,
  };
--- a/app/react/portainer/gitops/GitForm.stories.tsx
+++ b/app/react/portainer/gitops/GitForm.stories.tsx
@ -90,6 +90,7 @@ export function Primary({
            isForcePullVisible={isForcePullVisible}
            deployMethod={deployMethod}
            baseWebhookUrl="ws://localhost:9000"
+            webhookId="1234"
          />
        </Form>
      )}
--- a/app/react/portainer/gitops/GitForm.tsx
+++ b/app/react/portainer/gitops/GitForm.tsx
@ -28,6 +28,8 @@ interface Props {
  isAuthExplanationVisible?: boolean;
  errors: FormikErrors<GitFormModel>;
  baseWebhookUrl: string;
+  webhookId: string;
+  webhooksDocs?: string;
 }

 export function GitForm({
@ -40,6 +42,8 @@ export function GitForm({
  isAuthExplanationVisible,
  errors = {},
  baseWebhookUrl,
+  webhookId,
+  webhooksDocs,
 }: Props) {
  return (
    <FormSection title="Git repository">
@ -89,11 +93,13 @@ export function GitForm({

      {value.AutoUpdate && (
        <AutoUpdateFieldset
+          webhookId={webhookId}
          baseWebhookUrl={baseWebhookUrl}
          value={value.AutoUpdate}
          onChange={(value) => handleChange({ AutoUpdate: value })}
          isForcePullVisible={isForcePullVisible}
          errors={errors.AutoUpdate as FormikErrors<GitFormModel['AutoUpdate']>}
+          webhooksDocs={webhooksDocs}
        />
      )}

--- a/app/react/portainer/gitops/types.ts
+++ b/app/react/portainer/gitops/types.ts
@ -31,7 +31,6 @@ export interface RepoConfigResponse {
 export type AutoUpdateModel = {
  RepositoryAutomaticUpdates: boolean;
  RepositoryMechanism: AutoUpdateMechanism;
-  RepositoryWebhookId: string;
  RepositoryFetchInterval: string;
  ForcePullImage: boolean;
  RepositoryAutomaticUpdatesForce: boolean;