openshift-docs/modules/odc-grouping-multiple-components.adoc

// Module included in the following assemblies:
//
// applications/application_life_cycle_management/odc-viewing-application-composition-using-topology-view.adoc

[id="odc-grouping-multiple-components_{context}"]
= Grouping multiple components within an application

You can use the *Add* page to add multiple components or services to your project and use the *Topology* page to group applications and resources within an application group.
The following procedure adds a MongoDB database service to an existing application with a Node.js component.


.Prerequisites

* Ensure that you have created and deployed a Node.js application on {product-title} using the *Developer* perspective.

.Procedure

. Create and deploy the MongoDB service to your project as follows:
.. In the *Developer* perspective, navigate to the *Add* view and select the *Database* option to see the *Developer Catalog*, which has multiple options that you can add as components or services to your application.
.. Click on the *MongoDB* option to see the details for the service.
.. Click *Instantiate Template* to see an automatically populated template with details for the MongoDB service, and click *Create* to create the service.

. On the left navigation panel, click *Topology* to see the MongoDB service deployed in your project.
. To add the MongoDB service to the existing application group, select the *mongodb* Pod and drag it to the application; the MongoDB service is added to the existing application group.
. Dragging a component and adding it to an application group automatically adds the required labels to the component. Click on the MongoDB service node to see the label `app.kubernetes.io/part-of=myapp` added to the *Labels* section in the *Overview* Panel.
+
.Application grouping
image::odc_app_grouping_label.png[]

Alternatively, you can also add the component to an application as follows:

. To add the MongoDB service to your application, click on the *mongodb* Pod to see the *Overview* panel to the right.
. Click the *Actions* drop-down menu on the upper right of the panel and select *Edit Application Grouping*.
. In the *Edit Application Grouping* dialog box, click the *Select an Application* drop-down list, and select the appropriate application group.
. Click *Save* to see the MongoDB service added to the application group.

You can remove a component from an application group by selecting the component and using kbd:[Shift]+ drag to drag it out of the application group.