docs: data source

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>

packages/noco-docs/docs/085.data-source/010.data-source-overview.md

@@ -5,65 +5,96 @@ description: 'NocoDB Data-Source sync, access control & re-config'
 
 ## Overview
 
+NocoDB allows you to connect to external data sources and get a unified spreadsheet view of your data. Activities related to external data sources can be managed from `Data Sources` tab in `Base dashboard`.
+
 `Data Sources` tab includes following functionalities
-- Connect/manage external data source
-- UI Access Control
-- Relations
+1. Connect/manage external data source
+2. UI Access Control
+3. Relations
 
 :::info
 Currently only one external data source can be added per project.
 :::
 
-## Accessing Data Sources
+## Accessing `Data Sources`
 
-Click `Data Sources` tab in `Project dashboard`
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
   
-![data source](https://github.com/nocodb/nocodb/assets/86527202/fde9de36-93cd-4b9a-adbe-48666daa009d)
+![data source](/img/v2/data-source/data-source.png)
 
 ## Sync Metadata
 
-Go to `Data Sources`, click ``Sync Metadata``, you can see your metadata sync status. If it is out of sync, you can sync the schema. See [Sync Schema](/setup-and-usages/sync-schema) for more.
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
+3. Click on `Sync Metadata` button listed under `Actions` column for the data source that you wish to sync metadata for
+4. [**Optional**] Click on `Reload` button to refresh Sync state.
+5. Any changes to the metadata identified will be listed in the `Sync State` column
+6. Click on `Sync Now` button to sync the metadata changes
+  
+![sync metadata](/img/v2/data-source/data-source-2.png)
+![sync metadata](/img/v2/data-source/data-source-meta-sync.png)
+
+After the sync is complete, you can see the updated state in the `Sync State` column. Sync modal also marks `Tables metadata is in Sync` in the header.
+  
+![post sync](/img/v2/data-source/data-source-post-sync.png)
 
-![sync metadata](https://github.com/nocodb/nocodb/assets/86527202/2df4687f-c349-4fd5-a50c-9c6161d87795)
 
 ## UI Access Control
 
-Go to `Data Sources`, click ``UI ACL``, you can control the access to each table by roles.
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
+3. Click on `UI ACL` button listed under `Actions` column for the data source that you wish to manage UI access control for
+4. On the UI ACL modal, you can see the list of tables available in the data source as rows & roles available as columns. Toggle checkboxes to enable/disable access to tables for specific roles.
+5. Click on `Save` button to save the changes
+
   
-![ui acl](https://github.com/nocodb/nocodb/assets/86527202/2368a543-b985-4adc-8650-5447bf7ee55b)
+![ui acl](/img/v2/data-source/data-source-3.png)
+![ui acl](/img/v2/data-source/ui-acl.png)
 
 
 ## Relations
 
-Go to `Data Sources`, click ``Relations``, you can see the ERD of your database.
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
+3. Click on `Relations` button listed under `Actions` column for the data source that you wish to access ERD (Relations view) for
   
+![relations](/img/v2/data-source/data-source-4.png)
 ![relations](https://github.com/nocodb/nocodb/assets/86527202/c3775d27-f75d-4263-8903-dd66427de4b4)
 
 
 ### Junction table names within Relations
 
 - Enable `Show M2M Tables` within `Project Settings` menu
-- Double click on `Show Columns` to see additional checkboxes get enabled.
+- Double-click on `Show Columns` to see additional checkboxes get enabled.
     - Enabling which you should be able to see junction tables and their table names.
   
 ![image](https://user-images.githubusercontent.com/35857179/219832436-9c1311c3-854c-4b31-9c94-8035dfba2a2b.png)
 
 ## Edit external database configuration parameters
 
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
+3. Click on `Edit` icon listed under `Actions` column for the data source that you wish to access ERD (Relations view) for
 Go to `Data Sources`, click ``Edit`` icon, you can re-configure database credentials.  
 Please make sure database configuration parameters are valid. Any incorrect parameters could lead to schema loss!
   
+![relations](/img/v2/data-source/data-source-edit.png)
 ![edit db config](https://github.com/nocodb/nocodb/assets/86527202/8a609529-e4b9-4869-95ce-90bc1b4cfe4d)
 
 ## Unlink data source
 
-Go to `Data Sources`, click ``Delete`` against the data source that you wish to un-link.
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
+3. Click on `Delete` icon listed under `Actions` column for the data source that you wish to Unlink
   
-![datasource unlink](https://github.com/nocodb/nocodb/assets/86527202/39ba34d9-9e00-4bac-996c-48c08c8fc049)
+![datasource unlink](/img/v2/data-source/data-source-unlink.png)
 
 
 ## Data source visibility
 
-Go to `Data Sources`, toggle ``Radio-button`` against the data source that you wish to hide/un-hide.
+1. Access Base context menu by clicking on the `Base` name in the left sidebar
+2. Click on `Data Sources` tab
+3. Toggle radio button listed under `Visibility` column for the data source that you wish to hide/un-hide
   
-![datasource visibility](https://github.com/nocodb/nocodb/assets/86527202/d7da4046-4755-484e-877c-bd80dfcbeded)
+![datasource visibility](/img/v2/data-source/data-source-visibility.png)