agora-appbuilder-core 3.0.13 → 3.0.28-beta-9

package/template/src/components/OAuth.native.tsx

@@ -1,53 +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 React from 'react';
-import {Linking} from 'react-native';
-import InAppBrowser from 'react-native-inappbrowser-reborn';
-import {useHistory} from './Router';
-import SelectOAuth from '../subComponents/SelectOAuth';
-
-import {url, oAuthSystemType} from './OAuthConfig';
-
-const processUrl = (url: string): string => {
-  return url
-    .replace(`${$config.PRODUCT_ID.toLowerCase()}://my-host`, '')
-    .replace($config.FRONTEND_ENDPOINT, '');
-};
-
-const Oauth = () => {
-  let history = useHistory();
-
-  const onSelectOAuthSystem = async ({
-    oAuthSystem,
-  }: {
-    oAuthSystem: oAuthSystemType;
-  }) => {
-    try {
-      // const url = `https://deep-link-tester.netlify.app`;
-      const oAuthUrl = url({platform: 'mobile'})[`${oAuthSystem}Url`];
-      if (await InAppBrowser.isAvailable()) {
-        const result = await InAppBrowser.openAuth(oAuthUrl, oAuthUrl);
-        if (result.type === 'success') {
-          history.push(processUrl(result.url));
-        }
-      } else {
-        Linking.openURL(oAuthUrl);
-      }
-    } catch (error) {
-      console.log(error.message);
-    }
-  };
-
-  return <SelectOAuth onSelectOAuth={onSelectOAuthSystem} />;
-};
-
-export default Oauth;

package/template/src/components/OAuth.tsx

@@ -1,29 +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 React from 'react';
-import {Linking} from 'react-native';
-import SelectOAuth from '../subComponents/SelectOAuth';
-import {url, oAuthSystemType} from './OAuthConfig';
-
-const Oauth = () => {
-  const onSelectOAuthSystem = ({
-    oAuthSystem,
-  }: {
-    oAuthSystem: oAuthSystemType;
-  }) => {
-    const oAuthUrl = url({platform: 'web'})[`${oAuthSystem}Url`];
-    Linking.openURL(oAuthUrl);
-  };
-  return <SelectOAuth onSelectOAuth={onSelectOAuthSystem} />;
-};
-
-export default Oauth;

package/template/src/components/OAuthConfig.ts

@@ -1,77 +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. 
-*********************************************
-*/
-export type oAuthSystemType = 'google' | 'microsoft' | 'slack' | 'apple';
-type platformType = 'web' | 'mobile' | 'desktop';
-type oAuthUrlType = {
-  googleUrl: string;
-  microsoftUrl: string;
-  slackUrl: string;
-  appleUrl: string;
-};
-
-const getRedirectFrontEndUrl = ({ platform}: {platform: platformType}) => platform === 'web' ? `${window.location.origin}`: `${$config.BACKEND_ENDPOINT}`
-
-export const oAuthGoogle = ({platform}: {platform: platformType}) => ({
-  client_id: $config.GOOGLE_CLIENT_ID,
-  auth_uri: 'https://accounts.google.com/o/oauth2/auth',
-  redirect_uri: `${$config.BACKEND_ENDPOINT}/oauth`,
-  scope: encodeURIComponent(
-    'https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/userinfo.email',
-  ),
-  state: encodeURIComponent(
-    `site=google&platform=${platform}&backend=${$config.BACKEND_ENDPOINT}&redirect=${getRedirectFrontEndUrl({platform})}/auth-token/`,
-  ),
-});
-
-export const oAuthMicrosoft = ({platform}: {platform: platformType}) => ({
-  client_id: $config.MICROSOFT_CLIENT_ID,
-  auth_uri: 'https://login.microsoftonline.com/common/oauth2/v2.0/authorize',
-  redirect_uri: `${$config.BACKEND_ENDPOINT}/oauth`,
-  scope: 'openid',
-  state: encodeURIComponent(
-    `site=microsoft&platform=${platform}&redirect=${getRedirectFrontEndUrl({platform})}/auth-token/&backend=${$config.BACKEND_ENDPOINT}`,
-  ),
-});
-
-export const oAuthSlack = ({platform}: {platform: platformType}) => ({
-  client_id: $config.SLACK_CLIENT_ID,
-  auth_uri: 'https://slack.com/oauth/authorize',
-  redirect_uri: `${$config.BACKEND_ENDPOINT}/oauth`,
-  scope: 'users.profile:read',
-  state: encodeURIComponent(
-    `site=slack&platform=${platform}&redirect=${getRedirectFrontEndUrl({platform})}/auth-token/&backend=${$config.BACKEND_ENDPOINT}`,
-  ),
-});
-
-export const oAuthApple = ({platform}: {platform: platformType}) => ({
-  client_id: $config.APPLE_CLIENT_ID,
-  auth_uri: 'https://appleid.apple.com/auth/authorize',
-  redirect_uri: `${$config.BACKEND_ENDPOINT}/oauth`,
-  scope: 'name email',
-  state: encodeURIComponent(
-    `site=apple&platform=${platform}&redirect=${getRedirectFrontEndUrl({platform})}/auth-token/&backend=${$config.BACKEND_ENDPOINT}`,
-  ),
-});
-
-
-export const url = ({platform}: {platform: platformType}): oAuthUrlType => {
-  const configGoogle = oAuthGoogle({platform});
-  const configMicrosoft = oAuthMicrosoft({platform});
-  const configSlack = oAuthSlack({platform});
-  const configApple = oAuthApple({platform});
-  return {
-    googleUrl: `${configGoogle.auth_uri}?response_type=code&scope=${configGoogle.scope}&include_granted_scopes=true&state=${configGoogle.state}&client_id=${configGoogle.client_id}&redirect_uri=${configGoogle.redirect_uri}`,
-    microsoftUrl: `${configMicrosoft.auth_uri}?response_type=code&scope=${configMicrosoft.scope}&include_granted_scopes=true&state=${configMicrosoft.state}&client_id=${configMicrosoft.client_id}&redirect_uri=${configMicrosoft.redirect_uri}`,
-    slackUrl: `${configSlack.auth_uri}?response_type=code&scope=${configSlack.scope}&include_granted_scopes=true&state=${configSlack.state}&client_id=${configSlack.client_id}&redirect_uri=${configSlack.redirect_uri}`,
-    appleUrl: `${configApple.auth_uri}?response_type=code&scope=${configApple.scope}&include_granted_scopes=true&state=${configApple.state}&response_mode=form_post&client_id=${configApple.client_id}&redirect_uri=${configApple.redirect_uri}`,
-  };
-};

package/template/src/components/StoreToken.tsx

@@ -1,38 +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 React, {useContext, useState} from 'react';
-import {Redirect, useParams} from './Router';
-import StorageContext from './StorageContext';
-import {Text} from 'react-native';
-import useMount from './useMount';
-import {useString} from '../utils/useString';
-
-const Authenticated = () => {
-  //commented for v1 release
-  //const authenticationSuccessLabel = useString('authenticationSuccessLabel')();
-  const authenticationSuccessLabel = 'Authenticated Successfully!';
-  return <Text> {authenticationSuccessLabel} </Text>;
-};
-
-const StoreToken = () => {
-  const [ready, setReady] = useState(false);
-  const {token}: {token: string} = useParams();
-  const {setStore} = useContext(StorageContext);
-
-  useMount(() => {
-    setStore && setStore((store) => ({...store, token}));
-    setReady(true);
-  });
-  return ready ? <Redirect to={'/'} /> : <Authenticated />;
-};
-
-export default StoreToken;

package/template/src/components/chat-ui/useChatUIControl.tsx

@@ -1,69 +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 {createHook} from 'customization-implementation';
-import React, {SetStateAction, useState} from 'react';
-import {UidType} from '../../../agora-rn-uikit';
-
-export interface ChatUIControlInterface {
-  groupActive: boolean;
-  privateActive: boolean;
-  selectedChatUserId: UidType;
-  setGroupActive: React.Dispatch<SetStateAction<boolean>>;
-  setPrivateActive: React.Dispatch<SetStateAction<boolean>>;
-  setSelectedChatUserId: React.Dispatch<SetStateAction<UidType>>;
-  message: string;
-  setMessage: React.Dispatch<SetStateAction<string>>;
-}
-
-const ChatUIControlContext = React.createContext<ChatUIControlInterface>({
-  groupActive: false,
-  privateActive: false,
-  selectedChatUserId: 0,
-  message: '',
-  setGroupActive: () => {},
-  setPrivateActive: () => {},
-  setSelectedChatUserId: () => {},
-  setMessage: () => {},
-});
-
-interface ChatUIControlProviderProps {
-  children: React.ReactNode;
-}
-
-const ChatUIControlProvider = (props: ChatUIControlProviderProps) => {
-  const [groupActive, setGroupActive] = useState(false);
-  const [privateActive, setPrivateActive] = useState(false);
-  const [selectedChatUserId, setSelectedChatUserId] = useState<UidType>(0);
-  const [message, setMessage] = useState('');
-  return (
-    <ChatUIControlContext.Provider
-      value={{
-        groupActive,
-        privateActive,
-        selectedChatUserId,
-        setGroupActive,
-        setPrivateActive,
-        setSelectedChatUserId,
-        message,
-        setMessage,
-      }}>
-      {props.children}
-    </ChatUIControlContext.Provider>
-  );
-};
-
-/**
- * The ChatUIControl app state governs the chat ui.
- */
-const useChatUIControl = createHook(ChatUIControlContext);
-
-export {ChatUIControlProvider, useChatUIControl};

package/template/src/components/meeting-info/useMeetingInfo.tsx

@@ -1,70 +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 React, {createContext} from 'react';
-import {createHook} from 'customization-implementation';
-import {UidType} from '../../../agora-rn-uikit';
-export interface MeetingInfoContextInterface {
-  isJoinDataFetched?: boolean;
-  data?: {
-    isHost: boolean;
-    meetingTitle: string;
-    roomId: {
-      attendee: string;
-      host?: string;
-    };
-    pstn?: {
-      number: string;
-      pin: string;
-    };
-    isSeparateHostLink: boolean;
-    channel?: string;
-    uid?: UidType;
-    token?: string;
-    rtmToken?: string;
-    encryptionSecret?: string;
-    screenShareUid?: string;
-    screenShareToken?: string;
-  };
-}
-
-export const MeetingInfoDefaultValue: MeetingInfoContextInterface = {
-  isJoinDataFetched: false,
-  data: {
-    isHost: false,
-    meetingTitle: '',
-    roomId: {
-      attendee: '',
-    },
-    isSeparateHostLink: true,
-  },
-};
-
-const MeetingInfoContext = createContext(MeetingInfoDefaultValue);
-
-interface MeetingInfoProviderProps {
-  children: React.ReactNode;
-  value: MeetingInfoContextInterface;
-}
-
-const MeetingInfoProvider = (props: MeetingInfoProviderProps) => {
-  return (
-    <MeetingInfoContext.Provider value={{...props.value}}>
-      {props.children}
-    </MeetingInfoContext.Provider>
-  );
-};
-/**
- * The MeetingInfo app state contains information about the active meeting.
- */
-const useMeetingInfo = createHook(MeetingInfoContext);
-
-export {MeetingInfoProvider, useMeetingInfo};

package/template/src/components/participants/MeParticipant.tsx

@@ -1,38 +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 React from 'react';
-import {View} from 'react-native';
-import {ButtonTemplateName} from '../../utils/useButtonTemplate';
-import LocalAudioMute from '../../subComponents/LocalAudioMute';
-import LocalVideoMute from '../../subComponents/LocalVideoMute';
-import ParticipantName from './ParticipantName';
-
-const MeParticipant = (props: any) => {
-  const {p_style, name} = props;
-
-  return (
-    <View style={p_style.participantRow}>
-      <ParticipantName value={name} />
-      <View style={p_style.participantActionContainer}>
-        <View style={[p_style.actionBtnIcon, {marginRight: 10}]}>
-          <LocalAudioMute buttonTemplateName={ButtonTemplateName.topBar} />
-        </View>
-        {!$config.AUDIO_ROOM && (
-          <View style={p_style.actionBtnIcon}>
-            <LocalVideoMute buttonTemplateName={ButtonTemplateName.topBar} />
-          </View>
-        )}
-      </View>
-    </View>
-  );
-};
-export default MeParticipant;

package/template/src/components/participants/RemoteParticipants.tsx

@@ -1,71 +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 React from 'react';
-import {View} from 'react-native';
-import RemoteAudioMute from '../../subComponents/RemoteAudioMute';
-import RemoteVideoMute from '../../subComponents/RemoteVideoMute';
-import {ApprovedLiveStreamControlsView} from '../../subComponents/livestream';
-import RemoteEndCall from '../../subComponents/RemoteEndCall';
-import ParticipantName from './ParticipantName';
-import {RenderInterface} from '../../../agora-rn-uikit';
-
-interface remoteParticipantsInterface {
-  p_styles: any;
-  name: string;
-  user: RenderInterface;
-  showControls: boolean;
-  isHost: boolean;
-}
-
-const RemoteParticipants = (props: remoteParticipantsInterface) => {
-  const {p_styles, user, name, showControls, isHost} = props;
-  return (
-    <View style={p_styles.participantRow}>
-      <ParticipantName value={name} />
-      {showControls ? (
-        <View style={p_styles.participantActionContainer}>
-          {$config.EVENT_MODE && (
-            <ApprovedLiveStreamControlsView
-              p_styles={p_styles}
-              uid={user.uid}
-            />
-          )}
-          <View style={[p_styles.actionBtnIcon, {marginRight: 10}]}>
-            <RemoteEndCall uid={user.uid} isHost={isHost} />
-          </View>
-          <View style={[p_styles.actionBtnIcon, {marginRight: 10}]}>
-            <RemoteAudioMute
-              uid={user.uid}
-              audio={user.audio}
-              isHost={isHost}
-            />
-          </View>
-          {!$config.AUDIO_ROOM && (
-            <View style={[p_styles.actionBtnIcon]}>
-              <RemoteVideoMute
-                uid={user.uid}
-                video={user.video}
-                isHost={isHost}
-              />
-            </View>
-          )}
-        </View>
-      ) : (
-        <></>
-        // <View style={p_styles.dummyView}>
-        //   <Text>Remote screen sharing</Text>
-        // </View>
-      )}
-    </View>
-  );
-};
-export default RemoteParticipants;

package/template/src/pages/video-call/CustomUserContextHolder.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import {useCustomization} from 'customization-implementation';
-
-const CustomUserContextHolder: React.FC<{children: any}> = (props) => {
-  const useUserContext = useCustomization((config) => {
-    if (
-      config?.components?.videoCall &&
-      typeof config?.components?.videoCall === 'object' &&
-      config?.components?.videoCall?.useUserContext &&
-      typeof config?.components?.videoCall?.useUserContext === 'function'
-    ) {
-      return config?.components?.videoCall?.useUserContext;
-    } else {
-      return () => {};
-    }
-  });
-  useUserContext();
-  return props.children;
-};
-export default CustomUserContextHolder;

package/template/src/utils/useCreateMeeting.ts

@@ -1,88 +0,0 @@
-import {gql, useMutation} from '@apollo/client';
-import {MeetingInfoContextInterface} from '../components/meeting-info/useMeetingInfo';
-import {useSetMeetingInfo} from '../components/meeting-info/useSetMeetingInfo';
-import SDKEvents from '../utils/SdkEvents';
-
-const CREATE_CHANNEL = gql`
-  mutation CreateChannel(
-    $title: String!
-    $backendURL: String!
-    $enablePSTN: Boolean
-  ) {
-    createChannel(
-      title: $title
-      backendURL: $backendURL
-      enablePSTN: $enablePSTN
-    ) {
-      passphrase {
-        host
-        view
-      }
-      channel
-      title
-      pstn {
-        number
-        dtmf
-      }
-    }
-  }
-`;
-/**
- * Returns an asynchronous function to create a meeting with the given options.
- */
-export default function useCreateMeeting() {
-  const [createChannel, {error}] = useMutation(CREATE_CHANNEL);
-  const {setMeetingInfo} = useSetMeetingInfo();
-  return async (
-    roomTitle: string,
-    enablePSTN?: boolean,
-    isSeparateHostLink?: boolean,
-  ) => {
-    const res = await createChannel({
-      variables: {
-        title: roomTitle,
-        backendURL: $config.BACKEND_ENDPOINT,
-        enablePSTN: enablePSTN,
-      },
-    });
-    if (error) {
-      throw error;
-    }
-    if (res && res?.data && res?.data?.createChannel) {
-      let meetingInfo: Partial<MeetingInfoContextInterface['data']> = {
-        roomId: {
-          attendee: '',
-        },
-      };
-      if (res?.data?.createChannel?.passphrase?.view) {
-        meetingInfo.roomId.attendee = res.data.createChannel.passphrase.view;
-      }
-      if (res?.data?.createChannel?.passphrase?.host) {
-        meetingInfo.roomId.host = res.data.createChannel.passphrase.host;
-      }
-      if (enablePSTN === true && res?.data?.createChannel?.pstn) {
-        meetingInfo.pstn = {
-          number: res.data.createChannel.pstn.number,
-          pin: res.data.createChannel.pstn.dtmf,
-        };
-      }
-      setMeetingInfo({
-        data: {
-          isHost: true,
-          isSeparateHostLink: isSeparateHostLink ? true : false,
-          meetingTitle: roomTitle,
-          roomId: meetingInfo?.roomId,
-          pstn: meetingInfo?.pstn,
-        },
-      });
-      SDKEvents.emit(
-        'create',
-        meetingInfo.roomId.host,
-        meetingInfo.roomId.attendee,
-        meetingInfo?.pstn,
-      );
-    } else {
-      throw new Error(`An error occurred in parsing the channel data.`);
-    }
-  };
-}