adding action attributes sidebard

Issue-ID: CCSDK-2874
Signed-off-by: ShaabanEltanany <shaaban.eltanany.ext@orange.com>
Change-Id: I962f98e9caaa8db4753d5266b8084eae7cb0961d

1 files changed, 3 insertions, 167 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
index 980a94ca5..bca5ba951 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
@@ -269,175 +269,11 @@
         </div>
         <!--<button (click)="_toggleSidebar2()" style="float:right;">Toggle sidebar right</button> -->
     </div>
-
-    <!--Right Side Menu - Action Attribute-->
     <ng-sidebar [(opened)]="actionAttributesSideBar" [sidebarClass]="'demo-sidebar attributesSideBar '" [mode]="'push'"
-        [position]="'right'" #sidebarRight1>
-        <div class="container-fluid0">
-            <div class="row m-0">
-                <div class="col attributesContainer">
-                    <div class="row m-0 attributesContainertTitle">
-                        <div class="col-2 pl-0">
-                            <button (click)="sidebarRight1.close()" class="closeBar" tooltip="Close"
-                                placement="bottom"><i class="icon-close" type="button" aria-hidden="true"></i></button>
-                        </div>
-                        <h6 class="col pl-0">Action Attributes</h6>
-                        <div class="col-3 pl-0">
-                            <div class="btn-group" role="group" aria-label="Basic example">
-                                <button type="button" class="btn view-source" tooltip="View Action Source"
-                                    placement="bottom"><i class="icon-source"></i></button>
-                                <button type="button" class="btn trash-item" tooltip="Delete Action"
-                                    placement="bottom"><i class="icon-delete-sm" type="button"
-                                        aria-hidden="true"></i></button>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="scrollWrapper">
-                        <div class="row m-0">
-                            <div class="col">
-                                <div class="form-group">
-                                    <label for="exampleInputEmail1">Action Name</label>
-                                    <input type="text" class="form-control" placeholder="Action Name"
-                                        value="resource-assignment">
-                                </div>
-                            </div>
-                        </div>
-                        <!--Add Attribute-->
-                        <div class="row m-b add-attribute">
-                            <div class="col">
-                                <h5>Add Attribute</h5>
-                                <div class="row">
-                                    <div class="col pr-0 text-center">
-                                        <button type="button" data-toggle="modal" data-target="#exampleModalScrollable"
-                                            class="btn btn-secondary"><i class="icon-custom-attribute" type="button"
-                                                aria-hidden="true"></i></button>
-                                        <span>Custom Attribute</span>
-
-
-                                    </div>
-                                    <div class="col text-center">
-                                        <button type="button" class="btn btn-secondary"><i
-                                                class="icon-function-attribute" type="button"
-                                                aria-hidden="true"></i></button>
-                                        <span>Function Attribute</span>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <!--INPUTS-->
-                        <div class="accordion" id="accordionExample">
-                            <div class="card">
-                                <div class="card-header row" id="headingOne">
-                                    <button class="btn btn-link" type="button" data-toggle="collapse"
-                                        data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
-                                        Inputs
-                                    </button>
-                                </div>
-                                <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
-                                    data-parent="#accordionExample">
-                                    <div class="card-body action-attributes">
-                                        <div class="row">
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <label for="exampleFormControlTextarea1">template-prefix
-                                                        <i class="icon-required-star" type="button"
-                                                            aria-hidden="true"></i></label>
-                                                    <div class="attributeOptions">
-                                                        <a data-toggle="modal" data-target="#templateDeletionModal"
-                                                            class="accordion-delete editAttribute"
-                                                            tooltip="Edit Attribute" placement="bottom"><i
-                                                                class="icon-edit"></i></a><a data-toggle="modal"
-                                                            data-target="#templateDeletionModal"
-                                                            class="accordion-delete deleteAttribute"
-                                                            tooltip="Delete Attribute" placement="bottom"><i
-                                                                class="icon-delete-sm"></i></a>
-                                                    </div>
-                                                </div>
-                                                <div class="form-group">
-                                                    <label for="exampleInputEmail1">resource-assignment-properties <i
-                                                            class="icon-required-star" type="button"
-                                                            aria-hidden="true"></i></label>
-                                                    <div class="attributeOptions">
-                                                        <a data-toggle="modal" data-target="#templateDeletionModal"
-                                                            class="accordion-delete editAttribute"
-                                                            tooltip="Edit Attribute" placement="bottom"><i
-                                                                class="icon-edit"></i></a><a data-toggle="modal"
-                                                            data-target="#templateDeletionModal"
-                                                            class="accordion-delete deleteAttribute"
-                                                            tooltip="Delete Attribute" placement="bottom"><i
-                                                                class="icon-delete-sm"></i></a>
-                                                    </div>
-                                                </div>
-                                                <div class="form-group">
-                                                    <label for="exampleInputEmail1">occurrence <i
-                                                            class="icon-required-star optional-attribute" type="button"
-                                                            aria-hidden="true"></i></label>
-                                                    <div class="attributeOptions">
-                                                        <a data-toggle="modal" data-target="#templateDeletionModal"
-                                                            class="accordion-delete editAttribute"
-                                                            tooltip="Edit Attribute" placement="bottom"><i
-                                                                class="icon-edit"></i></a><a data-toggle="modal"
-                                                            data-target="#templateDeletionModal"
-                                                            class="accordion-delete deleteAttribute"
-                                                            tooltip="Delete Attribute" placement="bottom"><i
-                                                                class="icon-delete-sm"></i></a>
-                                                    </div>
-                                                </div>
-                                                <div class="form-group">
-                                                    <label for="exampleFormControlTextarea1">store-result
-                                                        <i class="icon-required-star optional-attribute" type="button"
-                                                            aria-hidden="true"></i></label>
-                                                    <div class="attributeOptions">
-                                                        <a data-toggle="modal" data-target="#templateDeletionModal"
-                                                            class="accordion-delete editAttribute"
-                                                            tooltip="Edit Attribute" placement="bottom"><i
-                                                                class="icon-edit"></i></a><a data-toggle="modal"
-                                                            data-target="#templateDeletionModal"
-                                                            class="accordion-delete deleteAttribute"
-                                                            tooltip="Delete Attribute" placement="bottom"><i
-                                                                class="icon-delete-sm"></i></a>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <!--OUTPUTS-->
-                        <div class="accordion" id="accordionExample1">
-                            <div class="card">
-                                <div class="card-header row" id="headingOne">
-                                    <button class="btn btn-link" type="button" data-toggle="collapse"
-                                        data-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
-                                        Outputs
-                                    </button>
-                                </div>
-
-                                <div id="collapseTwo" class="collapse show" aria-labelledby="headingOne"
-                                    data-parent="#accordionExample1">
-                                    <div class="card-body">
-                                        <div class="row">
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <label for="exampleFormControlTextarea1">resolved-data
-                                                        <i class="icon-required-star optional-attribute" type="button"
-                                                            aria-hidden="true"></i></label>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <!-- Modal -->
+                [position]="'right'" #sidebarRight1>
 
+   <app-action-attributes></app-action-attributes>
     </ng-sidebar>
-
     <!--Right Side Menu - Function Attribute-->
     <ng-sidebar [(opened)]="functionAttributeSidebar" [sidebarClass]="'demo-sidebar attributesSideBar'" [mode]="'push'"
         [position]="'right'" #sidebarRight2>
@@ -680,4 +516,4 @@
             </div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>