[v10.0.x] docs: add datasource selector content (#69587)

docs: add datasource selector content (#69280)

* updated create dashboard topic including adding screenshot of DS selector

* finished editing build dashboards - create dashboards

* finished data source selection edits'
:

* updated tutorials

* reverted tutorial to old nav to match reality and added that prom DS is preselected

* wording edits

* Apply suggestions from code review

Co-authored-by: Christopher Moyer <35463610+chri2547@users.noreply.github.com>

* add that configure DS is only for admins

---------

Co-authored-by: Christopher Moyer <35463610+chri2547@users.noreply.github.com>
(cherry picked from commit 865636993f)

Co-authored-by: Isabel <76437239+imatwawana@users.noreply.github.com>

docs/sources/dashboards/build-dashboards/create-dashboard/index.md

@@ -29,11 +29,21 @@ Dashboards and panels allow you to show your data in visual form. Each panel nee
 
    ![Empty dashboard state](/media/docs/grafana/dashboards/empty-dashboard-9.5.png)
 
-1. In the first line of the **Query** tab, click the dropdown list and select a data source.
-1. Write or construct a query in the query language of your data source.
+1. In the modal that opens, do one of the following:
+
+   - Select one of your existing data sources.
+   - Select one of the Grafana's [built-in special data sources]({{< relref "../../../datasources/#special-data-sources" >}}).
+   - Click **Configure a new data source** to set up a new one (Admins only).
+
+   {{< figure class="float-right"  src="/media/docs/grafana/dashboards/screenshot-data-source-selector-10.0.png" max-width="800px" alt="Select data source modal" >}}
+
+   The **Edit panel** view opens with your data source selected.
+   You can change the panel data source later using the dropdown in the **Query** tab of the panel editor if needed.
 
    For more information about data sources, refer to [Data sources]({{< relref "../../../datasources/" >}}) for specific guidelines.
 
+1. Write or construct a query in the query language of your data source.
+
 1. Click the Refresh dashboard icon to query the data source.
 
    ![Refresh dashboard icon](/media/docs/grafana/dashboards/screenshot-refresh-dashboard-9.5.png)
@@ -64,7 +74,9 @@ Dashboards and panels allow you to show your data in visual form. Each panel nee
 1. Click **Save**.
 1. To add more panels to the dashboard, click **Add** in the dashboard header and select **Visualization** in the dropdown.
 
-   ![Add dropdown](/media/docs/grafana/dashboards/screenshot-add-dropdown-9.5.png)
+   ![Add dropdown](/media/docs/grafana/dashboards/screenshot-add-dropdown-10.0.png)
+
+   When you add additional panels to the dashboard, you're taken straight to the **Edit panel** view.
 
 ## Configure repeating rows