agora-appbuilder-core 4.1.7-beta.8 → 4.1.8-beta.1

package/template/src/utils/useGetMeetingPhrase.ts

@@ -1,31 +1,15 @@
 import {useContext} from 'react';
-import {gql} from '@apollo/client';
 import {RoomInfoContextInterface} from '../components/room-info/useRoomInfo';
 import {useSetRoomInfo} from '../components/room-info/useSetRoomInfo';
-import {GraphQLContext} from '../components/GraphQLProvider';
 import getUniqueID from './getUniqueID';
 import {LogSource, logger} from '../logger/AppBuilderLogger';
+import StorageContext from '../components/StorageContext';
 
-const SHARE = gql`
-  query share($passphrase: String!) {
-    share(passphrase: $passphrase) {
-      passphrase {
-        host
-        view
-      }
-      channel
-      title
-      pstn {
-        number
-        dtmf
-      }
-    }
-  }
-`;
+const SHARE_URL = `${$config.BACKEND_ENDPOINT}/v1/channel/share`;
 
 export default function useGetMeetingPhrase() {
   const {setRoomInfo} = useSetRoomInfo();
-  const {client} = useContext(GraphQLContext);
+  const {store} = useContext(StorageContext);
   return async (phrase: string) => {
     const requestId = getUniqueID();
     const startReqTs = Date.now();
@@ -38,25 +22,77 @@ export default function useGetMeetingPhrase() {
         startReqTs,
       },
     );
-    const response = await client.query({
-      context: {
+    try {
+      const payload = JSON.stringify({
+        passphrase: phrase,
+      });
+      const res = await fetch(`${SHARE_URL}`, {
+        method: 'POST',
         headers: {
+          'Content-Type': 'application/json',
+          authorization: store.token ? `Bearer ${store.token}` : '',
           'X-Request-Id': requestId,
           'X-Session-Id': logger.getSessionId(),
         },
-      },
-      query: SHARE,
-      variables: {
-        passphrase: phrase,
-      },
-    });
-    const endReqTs = Date.now();
-    if (response.error) {
+        body: payload,
+      });
+      const response = await res.json();
+      if (response?.error) {
+        throw response.error;
+      } else {
+        const endReqTs = Date.now();
+        logger.log(
+          LogSource.Internals,
+          'GET_MEETING_PHRASE',
+          'Query GET_MEETING_PHRASE success',
+          {
+            responseData: response,
+            requestId,
+            startReqTs,
+            endReqTs,
+            latency: endReqTs - startReqTs,
+          },
+        );
+        try {
+          if (response) {
+            let data = response;
+            let roomInfo: Partial<RoomInfoContextInterface['data']> = {
+              roomId: {attendee: ''},
+            };
+            if (data?.passphrases?.attendee) {
+              roomInfo.roomId.attendee = data.passphrases.attendee;
+            }
+            if (data?.passphrases?.host) {
+              roomInfo.roomId.host = data.passphrases.host;
+            }
+            if (data?.pstn) {
+              roomInfo.pstn = {
+                number: data.pstn.number,
+                pin: data.pstn.dtmf,
+              };
+            }
+            setRoomInfo(prevState => {
+              return {
+                ...prevState,
+                data: {
+                  ...prevState.data,
+                  roomId: roomInfo.roomId,
+                  pstn: roomInfo?.pstn,
+                },
+              };
+            });
+          }
+        } catch (error) {
+          throw new Error('An error occurred in parsing the channel data.');
+        }
+      }
+    } catch (error) {
+      const endReqTs = Date.now();
       logger.error(
         LogSource.Internals,
         'GET_MEETING_PHRASE',
         'Query GET_MEETING_PHRASE failed',
-        JSON.stringify(response?.error || {}),
+        JSON.stringify(error || {}),
         {
           requestId,
           startReqTs,
@@ -64,52 +100,7 @@ export default function useGetMeetingPhrase() {
           latency: endReqTs - startReqTs,
         },
       );
-      throw response.error;
-    } else {
-      logger.log(
-        LogSource.Internals,
-        'GET_MEETING_PHRASE',
-        'Query GET_MEETING_PHRASE success',
-        {
-          responseData: response,
-          requestId,
-          startReqTs,
-          endReqTs,
-          latency: endReqTs - startReqTs,
-        },
-      );
-      try {
-        if (response && response.data) {
-          let data = response.data;
-          let roomInfo: Partial<RoomInfoContextInterface['data']> = {
-            roomId: {attendee: ''},
-          };
-          if (data?.share?.passphrase?.view) {
-            roomInfo.roomId.attendee = data.share.passphrase.view;
-          }
-          if (data?.share?.passphrase?.host) {
-            roomInfo.roomId.host = data.share.passphrase.host;
-          }
-          if (data?.share?.pstn) {
-            roomInfo.pstn = {
-              number: data.share.pstn.number,
-              pin: data.share.pstn.dtmf,
-            };
-          }
-          setRoomInfo(prevState => {
-            return {
-              ...prevState,
-              data: {
-                ...prevState.data,
-                roomId: roomInfo.roomId,
-                pstn: roomInfo?.pstn,
-              },
-            };
-          });
-        }
-      } catch (error) {
-        throw new Error('An error occurred in parsing the channel data.');
-      }
+      throw error;
     }
   };
 }

package/template/src/utils/useJoinRoom.ts

@@ -1,10 +1,7 @@
 import {useContext} from 'react';
-import {gql} from '@apollo/client';
 import StorageContext from '../components/StorageContext';
 import {RoomInfoContextInterface} from '../components/room-info/useRoomInfo';
 import {useSetRoomInfo} from '../components/room-info/useSetRoomInfo';
-import {GraphQLContext} from '../components/GraphQLProvider';
-import useGetName from './useGetName';
 import useWaitingRoomAPI from '../subComponents/waiting-rooms/useWaitingRoomAPI';
 import {base64ToUint8Array} from '../utils';
 import {LogSource, logger} from '../logger/AppBuilderLogger';

package/template/src/utils/useMutePSTN.ts

@@ -1,23 +1,18 @@
-import {gql, useMutation} from '@apollo/client';
 import {UidType} from '../../agora-rn-uikit';
 import {useRoomInfo} from '../components/room-info/useRoomInfo';
 import useIsPSTN from './useIsPSTN';
 import getUniqueID from './getUniqueID';
 import {LogSource, logger} from '../logger/AppBuilderLogger';
-const MUTE_PSTN = gql`
-  mutation mutePSTN($uid: Int!, $passphrase: String!, $mute: Boolean!) {
-    mutePSTN(uid: $uid, passphrase: $passphrase, mute: $mute) {
-      uid
-      mute
-    }
-  }
-`;
+import {useContext} from 'react';
+import StorageContext from '../components/StorageContext';
+
+const MUTE_PSTN_URL = `${$config.BACKEND_ENDPOINT}/v1/channel/pstn/mute`;
 
 const useMutePSTN = () => {
-  const [mutePSTN, {data, loading, error}] = useMutation(MUTE_PSTN);
   const {
     data: {isHost, roomId},
   } = useRoomInfo();
+  const {store} = useContext(StorageContext);
   const isPSTN = useIsPSTN();
   return async (uid: UidType) => {
     const startReqTs = Date.now();
@@ -30,48 +25,55 @@ const useMutePSTN = () => {
           'Mutation try to call MUTE_PSTN ',
           {startReqTs, requestId},
         );
-        await mutePSTN({
-          context: {
+        const payload = JSON.stringify({
+          uid: uid?.toString(),
+          passphrase: roomId?.host,
+          mute: true,
+        });
+        try {
+          const res = await fetch(`${MUTE_PSTN_URL}`, {
+            method: 'POST',
             headers: {
+              'Content-Type': 'application/json',
+              authorization: store.token ? `Bearer ${store.token}` : '',
               'X-Request-Id': requestId,
               'X-Session-Id': logger.getSessionId(),
             },
-          },
-          variables: {
-            uid: uid,
-            passphrase: roomId?.host,
-            //todo: hari need to test mute flag for PSTN
-            mute: 1,
-          },
-        });
+            body: payload,
+          });
+          const response = await res.json();
+
+          if (response?.error) {
+            throw response?.error;
+          } else {
+            const endReqTs = Date.now();
+            logger.log(
+              LogSource.Internals,
+              'MUTE_PSTN',
+              'Mutation MUTE_PSTN success',
+              {startReqTs, endReqTs, latency: endReqTs - startReqTs, requestId},
+            );
+            return response;
+          }
+        } catch (error) {
+          const endReqTs = Date.now();
+          logger.error(
+            LogSource.Internals,
+            'MUTE_PSTN',
+            'Mutation MUTE_PSTN success',
+            JSON.stringify(error || {}),
+            {
+              startReqTs,
+              endReqTs,
+              latency: endReqTs - startReqTs,
+              requestId,
+            },
+          );
+          throw error;
+        }
       } else {
         console.error('UID does not belong to the PSTN user.');
       }
-      if (!loading && error) {
-        const endReqTs = Date.now();
-        logger.error(
-          LogSource.Internals,
-          'MUTE_PSTN',
-          'Mutation MUTE_PSTN success',
-          JSON.stringify(error || {}),
-          {
-            startReqTs,
-            endReqTs,
-            latency: endReqTs - startReqTs,
-            requestId,
-          },
-        );
-        throw error;
-      } else {
-        const endReqTs = Date.now();
-        logger.log(
-          LogSource.Internals,
-          'MUTE_PSTN',
-          'Mutation MUTE_PSTN success',
-          {startReqTs, endReqTs, latency: endReqTs - startReqTs, requestId},
-        );
-        return data;
-      }
     } else {
       console.error('A host can only mute audience audio or video.');
     }

package/template/webpack.rsdk.config.js

@@ -1,6 +1,6 @@
 const commons = require('./webpack.commons');
 const path = require('path');
-const { merge } = require('webpack-merge');
+const {merge} = require('webpack-merge');
 
 const isDevelopment = process.env.NODE_ENV === 'development';
 
@@ -16,7 +16,6 @@ module.exports = merge(commons, {
     'react-dom': 'react-dom',
     'react-router': 'react-router',
     'react-router-dom': 'react-router-dom',
-    '@apollo/client': '@apollo/client',
   },
   // Main entry point for the web application
   entry: {

package/template/src/components/GraphQLProvider.tsx

@@ -1,122 +0,0 @@
-/*
-********************************************
- Copyright © 2021 Agora Lab, Inc., all rights reserved.
- AppBuilder and all associated components, source code, APIs, services, and documentation 
- (the “Materials”) are owned by Agora Lab, Inc. and its licensors. The Materials may not be 
- accessed, used, modified, or distributed for any purpose without a license from Agora Lab, Inc.  
- Use without a license or in violation of any license terms and conditions (including use for 
- any purpose competitive to Agora Lab, Inc.’s business) is strictly prohibited. For more 
- information visit https://appbuilder.agora.io. 
-*********************************************
-*/
-import {
-  ApolloClient,
-  createHttpLink,
-  InMemoryCache,
-  ApolloProvider,
-  NormalizedCacheObject,
-  ApolloLink,
-  // from,
-} from '@apollo/client';
-import React, {createContext, useContext, useEffect, useState} from 'react';
-import getUniqueID from '../../src/utils/getUniqueID';
-import StorageContext from './StorageContext';
-
-export const GraphQLContext = createContext<{
-  client: ApolloClient<NormalizedCacheObject>;
-}>({
-  //@ts-ignore
-  client: {},
-});
-
-const httpLink = createHttpLink({
-  uri: `${$config.BACKEND_ENDPOINT}/v1/query`,
-  credentials: 'include',
-});
-
-const cache = new InMemoryCache();
-
-const DEFAULT_CLIENT = new ApolloClient({
-  link: httpLink,
-  cache: cache,
-});
-
-const authLink = (token: string) => {
-  /**
-   * Below we create a new link, whenever a token changes, set
-   * context with headers and forward the link so as to
-   * execute the next link in the chain
-   */
-  return new ApolloLink((operation, forward) => {
-    if (token) {
-      operation.setContext(({headers = {}}) => ({
-        headers: {
-          ...headers,
-          'X-Project-ID': $config.PROJECT_ID,
-          'X-Platform-ID': 'turnkey_web',
-          ...(token && {
-            authorization: token ? `Bearer ${token}` : '',
-          }),
-        },
-      }));
-    }
-    return forward(operation);
-  });
-};
-
-const GraphQLProvider = (props: {children: React.ReactNode}) => {
-  const {store} = useContext(StorageContext);
-  const [client, setClient] = useState(DEFAULT_CLIENT);
-
-  // useEffect(() => {
-  //   setClient(
-  //     new ApolloClient({
-  //       link: authLink(store?.token).concat(httpLink),
-  //       cache: new InMemoryCache(),
-  //     }),
-  //   );
-  // }, [store?.token]);
-
-  useEffect(() => {
-    if (!store?.token) {
-      return;
-    }
-    (async () => {
-      const link = authLink(store?.token).concat(httpLink);
-      setClient(new ApolloClient({link, cache}));
-    })();
-  }, [store?.token]);
-
-  // const errorLink = onError(
-  //   ({graphQLErrors, networkError, operation, forward}) => {
-  //     // To retry on network errors, we recommend the RetryLink
-  //     // instead of the onError link. This just logs the error.
-  //     if (networkError) {
-
-  //       // switch (err.extensions.code) {
-  //       //   // Apollo Server sets code to UNAUTHENTICATED
-  //       //   // when an AuthenticationError is thrown in a resolver
-  //       //   case 'UNAUTHENTICATED':
-  //       //     // Modify the operation context with a new token
-  //       //     const oldHeaders = operation.getContext().headers;
-  //       //     operation.setContext({
-  //       //       headers: {
-  //       //         ...oldHeaders,
-  //       //         authorization: getNewToken(),
-  //       //       },
-  //       //     });
-  //       //     // Retry the request, returning the new observable
-  //       //     return forward(operation);
-  //       // }
-  //     }
-  //   },
-  // );
-
-  return (
-    <GraphQLContext.Provider value={{client: client}}>
-      <ApolloProvider client={client}>{props.children}</ApolloProvider>
-    </GraphQLContext.Provider>
-  );
-};
-
-export default GraphQLProvider;