From 213c08f0aade5ddcab6d8be004141eccfd8dc04e Mon Sep 17 00:00:00 2001 From: "Dale R. Hille" Date: Wed, 25 Sep 2019 12:23:37 -0400 Subject: [PATCH 1/4] remove tr/td element click dependencies --- imports/ui/components/externalApplications/component.html | 6 +++--- imports/ui/components/externalApplications/index.js | 6 +++--- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/imports/ui/components/externalApplications/component.html b/imports/ui/components/externalApplications/component.html index 030df14a..196eac32 100644 --- a/imports/ui/components/externalApplications/component.html +++ b/imports/ui/components/externalApplications/component.html @@ -39,9 +39,9 @@

External applications {{#unless externalApps}} No applications have been defined - https://company.example.com/{{|kind}}/{{|metadata.labels.app}} - my-resource - Deployment + + + {{/unless}} diff --git a/imports/ui/components/externalApplications/index.js b/imports/ui/components/externalApplications/index.js index dd062c83..c86bbcf9 100644 --- a/imports/ui/components/externalApplications/index.js +++ b/imports/ui/components/externalApplications/index.js @@ -144,7 +144,7 @@ Template.ManageExternalApps.events({ }, 'click .js-update-app'(e) { e.preventDefault(); - const appId = $(e.target).closest('tr').data('id'); + const appId = $(e.target).closest('.app-item-edit').data('id'); const updatedName = $(e.target).closest('.app-item-edit').find('input[name="appName"]').val(); const updatedLink = $(e.target).closest('.app-item-edit').find('input[name="appLink"]').val(); const updatedNameMatch = $(e.target).closest('.app-item-edit').find('input[name="nameMatch"]').val(); @@ -176,9 +176,9 @@ Template.ManageExternalApps.events({ clickedItem.set(null); editMode.set(false); }, - 'click td.app-edit, keypress td.app-edit'(e) { + 'click .app-edit, keypress .app-edit'(e) { e.preventDefault(); - const clickedRow = $(e.target).closest('tr').data('name'); + const clickedRow = $(e.target).closest('.app-item').data('name'); clickedItem.set(clickedRow); editMode.set(true); return false; From cffa6a79cd7bed8deae544e5ff49440948eaaff4 Mon Sep 17 00:00:00 2001 From: "Dale R. Hille" Date: Thu, 26 Sep 2019 17:46:49 -0400 Subject: [PATCH 2/4] use bootstrap grid elements instead of a table --- .../externalApplications/component.html | 212 ++++++++++-------- .../externalApplications/component.scss | 65 +++++- 2 files changed, 176 insertions(+), 101 deletions(-) diff --git a/imports/ui/components/externalApplications/component.html b/imports/ui/components/externalApplications/component.html index 196eac32..ba6c3e2f 100644 --- a/imports/ui/components/externalApplications/component.html +++ b/imports/ui/components/externalApplications/component.html @@ -24,110 +24,128 @@

External applications
-
- - - - - - - - - - - - {{#unless externalApps}} - - - - - - - - {{/unless}} - {{#each app in externalApps}} - {{#if editMode app.name }} - - - - - - - - {{else}} - - - - - - - - {{/if}} - {{/each}} - - {{#if showNewAppRow }} - - - - - - - + +
+
Name Match(regex)
+ +
+
+
Kind Match(regex)
+ +
+
+
Action
+ + +
+ + {{else}} + +
+
+
Name
+
{{app.name}}
+
+
+
URL
+
{{app.url}}
+
+
+
Name Match(regex)
+
{{app.nameMatch}}
+
+
+
Kind Match(regex)
+
{{app.kindMatch}}
+
+
+
Action
+ + +
+
{{/if}} - -
NameURLName Match (regex)Kind Match (regex)Action
No applications have been defined
- -
Please enter a unique name
- 		- -
Please enter a url
- 		- - - - - - -
{{app.name}}{{app.url}}{{app.nameMatch}}{{app.kindMatch}} - - -
- + +
+ {{#unless externalApps}} +
+
No applications have been defined
+
+ {{/unless}} +
+
+
Name
+
URL
+
Name Match(regex)
+
Kind Match(regex)
+
Action
+
+
+ {{#each app in externalApps}} + {{#if editMode app.name }} +
+
+
Name
+
Please enter a unique name
-
- + +
+
URL
+
Please enter a url
-
- - - - - - -
+ {{/each}} + {{#if showNewAppRow }} +
+
+
Name
+ +
Please enter a unique name
+
+
+
URL
+ +
Please enter a url
+
+
+
Name Match(regex)
+ +
+
+
Kind Match(regex)
+ +
+
+
Action
+ + +
+
+ {{/if}}
+ {{#unless showNewAppRow}}
- +
+ {{/unless}}
diff --git a/imports/ui/components/externalApplications/component.scss b/imports/ui/components/externalApplications/component.scss index 7696b211..c8321b2c 100644 --- a/imports/ui/components/externalApplications/component.scss +++ b/imports/ui/components/externalApplications/component.scss @@ -1,8 +1,65 @@ -.cursor-pointer { + +$grey:#ced4da; + +.app-edit { + min-height: 37px; cursor: pointer; + overflow-x: scroll; +} +#app-table .container-fluid { + padding-left: 0px; +} +.app-item { + line-height: 2.5; + margin-bottom: 2px; + &:hover { + background-color: rgba(0,0,0,.075); + } +} +.app-item-edit { + margin-bottom: 2px; +} +.row-header { + line-height: 2.1; + border-bottom: solid 1px $grey; + border-top: solid 1px $grey; + font-weight: 600; + margin-bottom: 8px; +} +.row-header-sm { + border: none; + font-weight: 600; } -// prevents the left border from being cut off when the input field is focused -td.app-edit:focus { - outline-offset: -5px; +@media (max-width: 991px) { + .app-item { + line-height: 3.5; + &:hover { + background-color: inherit; + } + } + .app-item-new { + line-height: 3.5; + } + .action-col { + border-bottom: solid 1px $grey; + padding-bottom: 10px; + } + .app-item-edit { + line-height: 3.5; + } + .form-control { + height: 39px; + } + .app-edit { + display: block; + width: 100%; + height: 39px; + padding: 0.375rem 0.75rem; + font-size: 0.875rem; + font-weight: 400; + line-height: 1.9; + border: 1px solid $grey; + border-radius: 0px; + } } From 69eb9dfad43b661e0714a8d0a1af1a1b2768fa88 Mon Sep 17 00:00:00 2001 From: "Dale R. Hille" Date: Thu, 26 Sep 2019 18:10:11 -0400 Subject: [PATCH 3/4] don't show the apps card on the resources page if there are no apps --- .../components/externalApplications/component.html | 12 +++++++----- imports/ui/pages/resources/resourcesSingle.jsx | 7 +++++-- 2 files changed, 12 insertions(+), 7 deletions(-) diff --git a/imports/ui/components/externalApplications/component.html b/imports/ui/components/externalApplications/component.html index ba6c3e2f..23d103c8 100644 --- a/imports/ui/components/externalApplications/component.html +++ b/imports/ui/components/externalApplications/component.html @@ -26,11 +26,6 @@

External applications
- {{#unless externalApps}} -
-
No applications have been defined
-
- {{/unless}}
Name
@@ -40,6 +35,13 @@

External applications
Action

+ {{#unless externalApps}} + {{#unless showNewAppRow}} +
+
No applications have been defined
+
+ {{/unless}} + {{/unless}} {{#each app in externalApps}} {{#if editMode app.name }}
diff --git a/imports/ui/pages/resources/resourcesSingle.jsx b/imports/ui/pages/resources/resourcesSingle.jsx index 55903b61..c3bb1207 100644 --- a/imports/ui/pages/resources/resourcesSingle.jsx +++ b/imports/ui/pages/resources/resourcesSingle.jsx @@ -197,9 +197,13 @@ export class ResourcesSingle_default extends React.Component{ KindResourceTagName = resourceKinds[kind]; } + const apps = this.props.externalApplications; + return (
- + { apps && apps.length > 0 && + + } {KindResourceTagName && @@ -215,7 +219,6 @@ export class ResourcesSingle_default extends React.Component{ class ExternalApps extends React.Component{ renderLinks(applications) { - console.log(JSON.parse(this.props.resource.data)); const resourceName = _.get(this.props.resource, 'searchableData.name', this.props.selfLink); const resourceKind = this.props.resource.searchableData.kind; From ec2696812102d395d612f8070966a582b8e64407 Mon Sep 17 00:00:00 2001 From: "Dale R. Hille" Date: Fri, 27 Sep 2019 04:50:59 -0400 Subject: [PATCH 4/4] cleanup --- .../ui/components/externalApplications/component.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/imports/ui/components/externalApplications/component.html b/imports/ui/components/externalApplications/component.html index 23d103c8..4a12b6b3 100644 --- a/imports/ui/components/externalApplications/component.html +++ b/imports/ui/components/externalApplications/component.html @@ -26,6 +26,7 @@

External applications
+
Name
@@ -70,7 +71,6 @@

External applications

{{else}} -
Name
@@ -123,7 +123,7 @@
Remove "{{app.name}}"
URL
- +
Please enter a url
@@ -144,9 +144,9 @@
Remove "{{app.name}}"
{{#unless showNewAppRow}} -
- -
+
+ +
{{/unless}}