fix(picker-image): prevent caching of image

springtreesolutions · Nov 9, 2021 · 834a2fb · 834a2fb
1 parent 9754a85
commit 834a2fb
Show file tree

Hide file tree

Showing 6 changed files with 41 additions and 6 deletions.
diff --git a/src/components/picker-customer-logo/picker-customer-logo.tsx b/src/components/picker-customer-logo/picker-customer-logo.tsx
@@ -26,9 +26,7 @@ export class PickerCustomerLogo {
 
   private async loadImageSrc() {
     try {
-      // const wait = (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
-
-      // await wait(400000);
+      console.log(`[eva-picker-customer-logo] getting customer logo for ${this.customerName} with logoPath ${this.logoPath}`);
       this.logoSrc = await getDownloadURL(ref(firebaseServiceInstance.storage, this.logoPath));
     } catch (error) {
       console.error(`[eva-picker-customer-logo] error getting customer logo for ${this.customerName}`, error);
@@ -40,8 +38,8 @@ export class PickerCustomerLogo {
       <Host>
         <div class="placeholder" style={{
           'opacity': this.logoSrc ? '0' : '1',
-        }}></div>
-
+        }}>
+        </div>
         {this.renderImage()}
       </Host>
     );

diff --git a/src/components/picker-customer-logo/readme.md b/src/components/picker-customer-logo/readme.md
@@ -0,0 +1,31 @@
+# picker-customer-logo
+
+
+
+<!-- Auto Generated Below -->
+
+
+## Properties
+
+| Property       | Attribute       | Description | Type     | Default     |
+| -------------- | --------------- | ----------- | -------- | ----------- |
+| `customerName` | `customer-name` |             | `string` | `undefined` |
+| `logoPath`     | `logo-path`     |             | `string` | `undefined` |
+
+
+## Dependencies
+
+### Used by
+
+ - [eva-config-picker-customer](../picker-customers)
+
+### Graph
+```mermaid
+graph TD;
+  eva-config-picker-customer --> picker-customer-logo
+  style picker-customer-logo fill:#f9f,stroke:#333,stroke-width:4px
+```
+
+----------------------------------------------
+
+*Built with [StencilJS](https://stenciljs.com/)*
diff --git a/src/components/picker-customers/picker-customers.scss b/src/components/picker-customers/picker-customers.scss
@@ -90,6 +90,9 @@ button.md {
   }
 
   .base-environments-list-item {
+    border-bottom: 1px solid var(--border-color);
+    padding-bottom: 8px;
+
     h4, p {
       margin: 0;
     }

diff --git a/src/components/picker-customers/picker-customers.tsx b/src/components/picker-customers/picker-customers.tsx
@@ -185,7 +185,7 @@ export class Customers {
           <div class="back-icon">&#10132;</div>
         </button>
         <div class="card">
-          <picker-customer-logo logoPath={this.selectedCustomer.logoPath} customerName={this.selectedCustomer.name}/>
+          <picker-customer-logo key={this.selectedCustomer.name} logoPath={this.selectedCustomer.logoPath} customerName={this.selectedCustomer.name}/>
           <h3>{this.selectedCustomer.name}</h3>
         </div>
 

diff --git a/src/components/picker-customers/readme.md b/src/components/picker-customers/readme.md
@@ -21,12 +21,14 @@
 ### Depends on
 
 - [eva-config-picker-spinner](../picker-spinner)
+- [picker-customer-logo](../picker-customer-logo)
 - [eva-config-picker-endpoint-status](../picker-endpoint-status)
 
 ### Graph
 ```mermaid
 graph TD;
   eva-config-picker-customer --> eva-config-picker-spinner
+  eva-config-picker-customer --> picker-customer-logo
   eva-config-picker-customer --> eva-config-picker-endpoint-status
   eva-config-picker-endpoint-status --> eva-config-picker-spinner
   eva-config-picker --> eva-config-picker-customer

diff --git a/src/components/picker/readme.md b/src/components/picker/readme.md
@@ -20,6 +20,7 @@ graph TD;
   eva-config-picker --> eva-config-picker-customer
   eva-config-picker --> eva-config-picker-login
   eva-config-picker-customer --> eva-config-picker-spinner
+  eva-config-picker-customer --> picker-customer-logo
   eva-config-picker-customer --> eva-config-picker-endpoint-status
   eva-config-picker-endpoint-status --> eva-config-picker-spinner
   style eva-config-picker fill:#f9f,stroke:#333,stroke-width:4px