From b08e0b023524ed7544ebbc243f46917de51dd8a8 Mon Sep 17 00:00:00 2001
From: fhanportainer <79428273+fhanportainer@users.noreply.github.com>
Date: Wed, 13 Apr 2022 21:57:39 +1200
Subject: [PATCH] feat(git): added regex to validate compose file extension
 (#6731)

* feat(git): added regex to validate compose file extension

* feat(git): copy change

* feat(git): updated icon
---
 app/kubernetes/views/deploy/deploy.html       |  4 +-
 .../git-form-additional-file-item.html        | 11 ++++-
 .../git-form-compose-path-field.html          | 41 +++++++++++--------
 3 files changed, 36 insertions(+), 20 deletions(-)

diff --git a/app/kubernetes/views/deploy/deploy.html b/app/kubernetes/views/deploy/deploy.html
index 8ebfd70c5..7531e8a88 100644
--- a/app/kubernetes/views/deploy/deploy.html
+++ b/app/kubernetes/views/deploy/deploy.html
@@ -13,7 +13,7 @@
             <uib-tab index="0">
               <uib-tab-heading> <i class="fa fa-code space-right" aria-hidden="true"></i> Deploy </uib-tab-heading>
               <div class="col-sm-12 form-section-title"> Namespace </div>
-              <form class="form-horizontal" style="margin-top: 20px">
+              <form class="form-horizontal" style="margin-top: 20px" name="deploymentForm">
                 <div class="form-group" ng-if="ctrl.formValues.Namespace">
                   <label for="target_node" class="col-lg-1 col-sm-2 control-label text-left">Namespace</label>
                   <div class="col-lg-11 col-sm-10">
@@ -161,7 +161,7 @@
                     <button
                       type="button"
                       class="btn btn-primary btn-sm"
-                      ng-disabled="ctrl.disableDeploy()"
+                      ng-disabled="!deploymentForm.$valid || ctrl.disableDeploy()"
                       ng-click="ctrl.deploy()"
                       button-spinner="ctrl.state.actionInProgress"
                       data-cy="k8sAppDeploy-deployButton"
diff --git a/app/portainer/components/forms/git-form/git-form-additional-files-panel/git-form-additional-file-item/git-form-additional-file-item.html b/app/portainer/components/forms/git-form/git-form-additional-files-panel/git-form-additional-file-item/git-form-additional-file-item.html
index b463ba798..414e4fb54 100644
--- a/app/portainer/components/forms/git-form/git-form-additional-files-panel/git-form-additional-file-item/git-form-additional-file-item.html
+++ b/app/portainer/components/forms/git-form/git-form-additional-files-panel/git-form-additional-file-item/git-form-additional-file-item.html
@@ -3,7 +3,15 @@
     <div class="form-inline" style="margin-top: 10px">
       <div class="input-group col-sm-5 input-group-sm">
         <span class="input-group-addon">path</span>
-        <input type="text" name="name" class="form-control" ng-model="$ctrl.variable" ng-change="$ctrl.onChangePath($ctrl.variable)" required />
+        <input
+          type="text"
+          name="name"
+          class="form-control"
+          ng-model="$ctrl.variable"
+          ng-change="$ctrl.onChangePath($ctrl.variable)"
+          ng-pattern="/.+\.(yml|yaml|json|hcl)$/i"
+          required
+        />
       </div>
       <button class="btn btn-sm btn-danger" type="button" ng-click="$ctrl.removeValue()">
         <i class="fa fa-trash" aria-hidden="true"></i>
@@ -13,6 +21,7 @@
       <div class="col-sm-12 small text-warning">
         <div ng-messages="$ctrl[$ctrl.formName].name.$error">
           <p ng-message="required"> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> Path is required. </p>
+          <p ng-message="pattern"> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> File path must include yaml, yml, json, or hcl extension </p>
         </div>
       </div>
     </div>
diff --git a/app/portainer/components/forms/git-form/git-form-compose-path-field/git-form-compose-path-field.html b/app/portainer/components/forms/git-form/git-form-compose-path-field/git-form-compose-path-field.html
index bce200564..dd8c7577b 100644
--- a/app/portainer/components/forms/git-form/git-form-compose-path-field/git-form-compose-path-field.html
+++ b/app/portainer/components/forms/git-form/git-form-compose-path-field/git-form-compose-path-field.html
@@ -1,18 +1,25 @@
-<div class="form-group">
-  <span class="col-sm-12 text-muted small"> Indicate the path to the {{ $ctrl.deployMethod == 'compose' ? 'Compose' : 'Manifest' }} file from the root of your repository. </span>
-</div>
-<div class="form-group">
-  <label for="stack_repository_path" class="col-sm-2 control-label text-left">{{ $ctrl.deployMethod == 'compose' ? 'Compose' : 'Manifest' }} path</label>
-  <div class="col-sm-10">
-    <input
-      type="text"
-      class="form-control"
-      name="repoPathField"
-      ng-model="$ctrl.value"
-      ng-change="$ctrl.onChange($ctrl.value)"
-      id="stack_repository_path"
-      placeholder="{{ $ctrl.deployMethod == 'compose' ? 'docker-compose.yml' : 'manifest.yml' }}"
-      required
-    />
+<ng-form name="pathForm">
+  <div class="form-group">
+    <span class="col-sm-12 text-muted small"
+      ><i class="fa fa-info-circle blue-icon space-right" aria-hidden="true"></i>Indicate the path to the {{ $ctrl.deployMethod == 'compose' ? 'Compose' : 'Manifest' }} file from
+      the root of your repository (requires a yaml, yml, json, or hcl file extension)
+    </span>
   </div>
-</div>
+  <div class="form-group">
+    <label for="stack_repository_path" class="col-sm-2 control-label text-left">{{ $ctrl.deployMethod == 'compose' ? 'Compose' : 'Manifest' }} path</label>
+    <div class="col-sm-10">
+      <input
+        type="text"
+        class="form-control"
+        name="repoPathField"
+        ng-model="$ctrl.value"
+        ng-change="$ctrl.onChange($ctrl.value)"
+        id="stack_repository_path"
+        placeholder="{{ $ctrl.deployMethod == 'compose' ? 'docker-compose.yml' : 'manifest.yml' }}"
+        ng-pattern="/.+\.(yml|yaml|json|hcl)$/i"
+        required
+      />
+      <p class="mt-10 text-warning" ng-show="pathForm.repoPathField.$error.pattern"> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> Invalid file path </p>
+    </div>
+  </div>
+</ng-form>