docs: Key updates for realtime (#45130)

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Documentation**
* Rewrote realtime guides to recommend new publishable and secret API
keys instead of legacy key guidance.
* Updated code examples (TypeScript, Flutter, Swift, Python, Dart) to
use publishable key naming.
* Simplified REST examples by removing the service-role Authorization
header and standardizing the apikey header to use a secret key.
* Improved Dashboard/API Keys navigation links and added connect dialog
query parameters.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: fadymak <dev@fadymak.com>
Co-authored-by: fadymak <fady@fadymak.com>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

apps/docs/content/guides/realtime/broadcast.mdx

@@ -41,10 +41,11 @@ Get the Project URL and key from [the project's **Connect** dialog](/dashboard/p
 
 Supabase is changing the way keys work to improve project security and developer experience. You can [read the full announcement](https://github.com/orgs/supabase/discussions/29260), but in the transition period, you can use both the current `anon` and `service_role` keys and the new publishable key with the form `sb_publishable_xxx` which will replace the older keys.
 
-In most cases, you can get the correct key from [the Project's **Connect** dialog](/dashboard/project/_?showConnect=true), but if you want a specific key, you can find all keys in [the API Keys section of a Project's Settings page](/dashboard/project/_/settings/api-keys/):
+**The legacy keys will be deprecated shortly, so we strongly encourage switching to and using the new publishable and secret API keys**.
 
-- **For legacy keys**, copy the `anon` key for client-side operations and the `service_role` key for server-side operations from the **Legacy API Keys** tab.
-- **For new keys**, open the **API Keys** tab, if you don't have a publishable key already, click **Create new API Keys**, and copy the value from the **Publishable key** section.
+In most cases, you can get the correct key from [the Project's **Connect** dialog](/dashboard/project/\_?showConnect=true&connectTab={{ .tab }}&framework={{ .framework }}), but if you want a specific key, you can find all keys in [the API Keys section of a Project's Settings page](/dashboard/project/_/settings/api-keys/):
+
+**For new keys**, open the **API Keys** tab, if you don't have a publishable key already, click **Create new API Keys**, and copy the value from the **Publishable key** section.
 
 </Admonition>
 
@@ -76,7 +77,7 @@ In most cases, you can get the correct key from [the Project's **Connect** dialo
     void main() async {
       Supabase.initialize(
         url: 'https://<project>.supabase.co',
-        anonKey: '<sb_publishable_... key>',
+        publishableKey: '<sb_publishable_... key>',
       );
       runApp(MyApp());
     }

apps/docs/content/guides/realtime/getting_started.mdx

@@ -97,7 +97,7 @@ Get your project URL and key.
 ```ts
 import { createClient } from '@supabase/supabase-js'
 
-const supabase = createClient('https://<project>.supabase.co', '<anon_key or sb_publishable_key>')
+const supabase = createClient('https://<project>.supabase.co', '<sb_publishable_key>')
 ```
 
 </TabPanel>
@@ -110,7 +110,7 @@ import 'package:supabase_flutter/supabase_flutter.dart';
 void main() async {
   await Supabase.initialize(
     url: 'https://<project>.supabase.co',
-    anonKey: '<anon_key or sb_publishable_key>',
+    publishableKey: '<sb_publishable_key>',
   );
   runApp(MyApp());
 }
@@ -128,7 +128,7 @@ import Supabase
 
 let supabase = SupabaseClient(
   supabaseURL: URL(string: "https://<project>.supabase.co")!,
-  supabaseKey: "<anon_key or sb_publishable_key>"
+  supabaseKey: "<sb_publishable_key>"
 )
 ```
 
@@ -141,7 +141,7 @@ let supabase = SupabaseClient(
 from supabase import create_client, Client
 
 url: str = "https://<project>.supabase.co"
-key: str = "<anon_key or sb_publishable_key>"
+key: str = "<sb_publishable_key>"
 supabase: Client = create_client(url, key)
 ```
 
@@ -349,8 +349,7 @@ const response = await fetch(`https://<project>.supabase.co/rest/v1/rpc/broadcas
   method: 'POST',
   headers: {
     'Content-Type': 'application/json',
-    Authorization: `Bearer <your-service-role-key>`,
-    apikey: '<your-service-role-key>',
+    -H "apikey: <SECRET_KEY>"
   },
   body: JSON.stringify({
     topic: 'room:lobby:messages',
@@ -378,8 +377,7 @@ final response = await http.post(
   Uri.parse('https://<project>.supabase.co/rest/v1/rpc/broadcast'),
   headers: {
     'Content-Type': 'application/json',
-    'Authorization': 'Bearer <your-service-role-key>',
-    'apikey': '<your-service-role-key>',
+    -H "apikey: <SECRET_KEY>"
   },
   body: jsonEncode({
     'topic': 'room:lobby:messages',
@@ -407,8 +405,7 @@ let url = URL(string: "https://<project>.supabase.co/rest/v1/rpc/broadcast")!
 var request = URLRequest(url: url)
 request.httpMethod = "POST"
 request.setValue("application/json", forHTTPHeaderField: "Content-Type")
-request.setValue("Bearer <your-service-role-key>", forHTTPHeaderField: "Authorization")
-request.setValue("<your-service-role-key>", forHTTPHeaderField: "apikey")
+request.setValue("<SECRET_KEY>", forHTTPHeaderField: "apikey")
 
 let payload = [
   "topic": "room:lobby:messages",
@@ -440,8 +437,7 @@ response = requests.post(
     'https://<project>.supabase.co/rest/v1/rpc/broadcast',
     headers={
         'Content-Type': 'application/json',
-        'Authorization': 'Bearer <your-service-role-key>',
-        'apikey': '<your-service-role-key>'
+        'apikey': '<SECRET_KEY>'
     },
     json={
         'topic': 'room:lobby:messages',

apps/docs/content/guides/realtime/postgres-changes.mdx

@@ -1793,7 +1793,7 @@ We strongly encourage you to enable RLS and create policies for tables in privat
 
 You may choose to sign your own tokens to customize claims that can be checked in your RLS policies.
 
-Your project JWT secret is found with your [Project API keys](https://app.supabase.com/project/_/settings/api) in your dashboard.
+Your project JWT secret is found in the [**Settings > API keys**](/dashboard/project/_/settings/api-keys) section of the Dashboard.
 
 <Admonition type="caution">
 

apps/docs/content/guides/realtime/presence.mdx

@@ -37,18 +37,17 @@ The complete presence state returned by `presenceState()` looks like this:
 
 ### Initialize the client
 
-{/* TODO: Further consolidate partial */}
-
 Get the Project URL and key from [the project's **Connect** dialog](/dashboard/project/_?showConnect=true).
 
 <Admonition type="note" title="Changes to API keys">
 
 Supabase is changing the way keys work to improve project security and developer experience. You can [read the full announcement](https://github.com/orgs/supabase/discussions/29260), but in the transition period, you can use both the current `anon` and `service_role` keys and the new publishable key with the form `sb_publishable_xxx` which will replace the older keys.
 
-In most cases, you can get the correct key from [the Project's **Connect** dialog](/dashboard/project/_?showConnect=true), but if you want a specific key, you can find all keys in [the API Keys section of a Project's Settings page](/dashboard/project/_/settings/api-keys/):
+**The legacy keys will be deprecated shortly, so we strongly encourage switching to and using the new publishable and secret API keys**.
 
-- **For legacy keys**, copy the `anon` key for client-side operations and the `service_role` key for server-side operations from the **Legacy API Keys** tab.
-- **For new keys**, open the **API Keys** tab, if you don't have a publishable key already, click **Create new API Keys**, and copy the value from the **Publishable key** section.
+In most cases, you can get the correct key from [the Project's **Connect** dialog](/dashboard/project/\_?showConnect=true&connectTab={{ .tab }}&framework={{ .framework }}), but if you want a specific key, you can find all keys in [the API Keys section of a Project's Settings page](/dashboard/project/_/settings/api-keys/):
+
+**For new keys**, open the **API Keys** tab, if you don't have a publishable key already, click **Create new API Keys**, and copy the value from the **Publishable key** section.
 
 </Admonition>
 
@@ -78,7 +77,7 @@ const supabase = createClient(SUPABASE_URL, SUPABASE_KEY)
 void main() {
   Supabase.initialize(
     url: 'https://<project>.supabase.co',
-    anonKey: '<sb_publishable_... key>',
+    publishableKey: '<sb_publishable_... key>',
   );
 
   runApp(MyApp());