OAuth: Update examples

Author: fe9lix

examples/api-examples/assets/google-logo.png

@@ -4,6 +4,7 @@ import * as google from "./oauth/google";
 import * as twitter from "./oauth/twitter";
 import * as dropbox from "./oauth/dropbox";
 
+// Update the service name here for testing different providers
 const serviceName = "twitter";
 
 export default function Command() {
@@ -44,11 +45,11 @@ export default function Command() {
 function getService(serviceName: string): Service {
   switch (serviceName) {
     case "google":
-      return google as unknown as Service;
+      return google as Service;
     case "twitter":
-      return twitter as unknown as Service;
+      return twitter as Service;
     case "dropbox":
-      return dropbox as unknown as Service;
+      return dropbox as Service;
     default:
       throw new Error("Unsupported service: " + serviceName);
   }
@@ -57,5 +58,4 @@ function getService(serviceName: string): Service {
 interface Service {
   authorize(): Promise<void>;
   fetchItems(): Promise<{ id: string; title: string }[]>;
-  logout(): void;
 }

examples/api-examples/src/oauth.tsx

@@ -1,7 +1,11 @@
 import { OAuth } from "@raycast/api";
 import fetch from "node-fetch";
 
+// Create an OAuth app via https://www.dropbox.com/developers/apps
+// As redirect URL add: https://raycast.com/redirect?packageName=Extension
+// Make sure to select and save the permissions that you add via the scope request parameter
 const clientId = "YourClientId";
+
 const client = new OAuth.PKCEClient({
   redirectMethod: OAuth.RedirectMethod.Web,
   providerName: "Dropbox",

examples/api-examples/src/oauth/dropbox.tsx

@@ -1,7 +1,11 @@
 import { OAuth } from "@raycast/api";
 import fetch from "node-fetch";
 
+// Create an OAuth client ID via https://console.developers.google.com/apis/credentials
+// As application type choose "iOS" (required for PKCE)
+// As Bundle ID enter: com.raycast
 const clientId = "YourClientId";
+
 const client = new OAuth.PKCEClient({
   redirectMethod: OAuth.RedirectMethod.AppURI,
   providerName: "Google",

examples/api-examples/src/oauth/google.tsx

@@ -1,7 +1,13 @@
 import { OAuth } from "@raycast/api";
 import fetch from "node-fetch";
 
+// Register a new OAuth app via https://developer.twitter.com/en/portal/dashboard
+// Select OAuth 2.0
+// As type of app choose: Native App
+// For the redirect URL enter: https://raycast.com/redirect
+// For the website URL enter: https://raycast.com
 const clientId = "YourClientId";
+
 const client = new OAuth.PKCEClient({
   redirectMethod: OAuth.RedirectMethod.Web,
   providerName: "Twitter",