Use customer endpoint for RBAC AAD auth (#818)

src/hooks/useAADAuth.ts

@@ -1,6 +1,7 @@
 import * as msal from "@azure/msal-browser";
 import { useBoolean } from "@fluentui/react-hooks";
 import * as React from "react";
+import { DatabaseAccount } from "../Contracts/DataModels";
 
 const config: msal.Configuration = {
   cache: {
@@ -104,3 +105,22 @@ export function useAADAuth(): ReturnType {
     switchTenant,
   };
 }
+
+export function useAADDataPlane(databaseAccount: DatabaseAccount): { aadToken: string } {
+  const [aadToken, setAadToken] = React.useState<string>();
+
+  React.useEffect(() => {
+    if (databaseAccount?.properties?.documentEndpoint) {
+      const hrefEndpoint = new URL(databaseAccount.properties.documentEndpoint).href.replace(/\/$/, "/.default");
+      msalInstance
+        .acquireTokenSilent({
+          scopes: [hrefEndpoint],
+        })
+        .then((aadTokenResponse) => {
+          setAadToken(aadTokenResponse.accessToken);
+        });
+    }
+  }, [databaseAccount]);
+
+  return { aadToken };
+}