Refined display content condition and provided more tests

axonivy-market · Aug 30, 2024 · bb059fd · bb059fd
1 parent 834be1a
commit bb059fd
Show file tree

Hide file tree

Showing 3 changed files with 413 additions and 77 deletions.
diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.html b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.html
@@ -153,58 +153,60 @@ <h4 class="analysis-title text-primary text-capitalize mb-0">
         </div>
         <div class="tab-content col-12 default-cursor">
           @if (!isEmptyProductContent()) {
-            <div
-              class="tab-pane fade show"
-              [class.active]="activeTab === 'description'"
-              id="description"
-              role="tabpanel"
-              aria-labelledby="description-tab">
-              <markdown
-                [lang]="languageService.selectedLanguage()"
-                class="readme-content"
-                [data]="
-                  productModuleContent().description!
-                    | multilingualism: languageService.selectedLanguage()
-                "></markdown>
-            </div>
-            <div
-              class="tab-pane fade"
-              [class.active]="activeTab === 'demo'"
-              id="demo"
-              role="tabpanel"
-              aria-labelledby="demo-tab">
-              <markdown
-                class="readme-content"
-                [data]="
-                  productModuleContent().demo!
-                    | multilingualism: languageService.selectedLanguage()
-                "></markdown>
-            </div>
-            <div
-              class="tab-pane fade"
-              [class.active]="activeTab === 'setup'"
-              id="setup"
-              role="tabpanel"
-              aria-labelledby="setup-tab">
-              <markdown
-                class="readme-content"
-                [data]="
-                  productModuleContent().setup!
-                    | multilingualism: languageService.selectedLanguage()
-                "></markdown>
-            </div>
-            <div
-              class="tab-pane fade"
-              [class.active]="activeTab === 'dependency'"
-              id="dependency"
-              role="tabpanel"
-              aria-labelledby="dependency-tab">
-              <app-product-detail-maven-content
-                [productModuleContent]="productModuleContent()"
-                [selectedVersion]="
-                  selectedVersion
-                "></app-product-detail-maven-content>
-            </div>
+            @if(getContent(activeTab)) {
+              <div
+                class="tab-pane fade show"
+                [class.active]="activeTab === 'description'"
+                id="description"
+                role="tabpanel"
+                aria-labelledby="description-tab">
+                <markdown
+                  [lang]="languageService.selectedLanguage()"
+                  class="readme-content"
+                  [data]="
+                    productModuleContent().description!
+                      | multilingualism: languageService.selectedLanguage()
+                  "></markdown>
+              </div>
+              <div
+                class="tab-pane fade"
+                [class.active]="activeTab === 'demo'"
+                id="demo"
+                role="tabpanel"
+                aria-labelledby="demo-tab">
+                <markdown
+                  class="readme-content"
+                  [data]="
+                    productModuleContent().demo!
+                      | multilingualism: languageService.selectedLanguage()
+                  "></markdown>
+              </div>
+              <div
+                class="tab-pane fade"
+                [class.active]="activeTab === 'setup'"
+                id="setup"
+                role="tabpanel"
+                aria-labelledby="setup-tab">
+                <markdown
+                  class="readme-content"
+                  [data]="
+                    productModuleContent().setup!
+                      | multilingualism: languageService.selectedLanguage()
+                  "></markdown>
+              </div>
+              <div
+                class="tab-pane fade"
+                [class.active]="activeTab === 'dependency'"
+                id="dependency"
+                role="tabpanel"
+                aria-labelledby="dependency-tab">
+                <app-product-detail-maven-content
+                  [productModuleContent]="productModuleContent()"
+                  [selectedVersion]="
+                    selectedVersion
+                  "></app-product-detail-maven-content>
+              </div>
+            }
           }
         </div>
       </div>