DOCSP-43493 adding screenshots

Author: ltran-mdb2

source/copilot-query.txt

@@ -51,27 +51,29 @@ value of ``Kayden Washington``.
 .. code-block:: javascript
    :copyable: false
 
-   @MongoDB /query find a document in the users collection with the name
-   of Kayden Washington.
+   @MongoDB /query In the sample_mflix database, find a document in the
+   users collection with the name of Kayden Washington.
 
 The Github Copilot Chat uses the |copilot| to
 generate the following query using knowledge of your database schema:
 
 .. code-block:: javascript
 
+   use(`sample_mflix`);
    db.getCollection('users').findOne({ name: 'Kayden Washington' });
 
 Once the |copilot| generates the query, you can choose to run the query
 directly or open the query in a playground. 
 
-      .. figure:: /images/copilot-query.png
-         :figwidth: 700px
-         :alt: Image copilot generating a query
+.. figure:: /images/copilot-query.png
+   :figwidth: 700px
+   :alt: Screenshot of copilot generating a query
 
 Build an Aggregation Pipeline
 `````````````````````````````
 
-You can also use the |copilot| to build aggregation pipelines. Consider the ``users`` collection in the `Mflix Sample Database
+You can also use the |copilot| to build aggregation pipelines. Consider
+the ``users`` collection in the `Mflix Sample Database
 <https://www.mongodb.com/docs/atlas/sample-data/sample-mflix/#sample_mflix.users>`__.
 Each document in the collection has the following structure:
 
@@ -101,13 +103,19 @@ The |copilot| generates the following aggregation pipeline:
 
 .. code-block:: javascript
 
+   use('sample_mflix');
    db.getCollection('users').aggregate([
-      // First stage: Sort documents alphabetically by name
       { $sort: { name: 1 } },
-      // Second stage: Remove the password field from each document
-      { $unset: "password" }
+      { $project: { password: 0 } }
    ]);
 
+Once the |copilot| generates the query, you can choose to run the pipeline
+directly or open the pipeline in a playground.   
+
+.. figure:: /images/copilot-agg-pipeline.png
+   :figwidth: 700px
+   :alt: Screenshot of copilot generating an aggregation pipeline
+
 You can also iteratively build on your aggregation pipeline:
 
 .. code-block:: javascript
@@ -121,11 +129,13 @@ The |copilot| returns the following aggregation pipeline:
 
 .. code-block:: javascript
 
+   use('sample_mflix');
    db.getCollection('users').aggregate([
       { $sort: { name: 1 } },
       { $project: { password: 0 } },
-      { $addFields: 
-         { username: { $arrayElemAt: 
-            [{ $split: ["$email", "@"] }, 0] } } },
-      { $out: "sortedUsersWithUsernames" }
+      { $addFields: { username: { $arrayElemAt: [{ $split: ["$email", "@"] }, 0] } } }
    ]);
+
+.. figure:: /images/copilot-agg-pipeline2.png
+   :figwidth: 700px
+   :alt: Screenshot of copilot iteratively building on an aggregation pipeline