Нашел компонет на npm который регистрирует через гугл в приложении -
https://www.npmjs.com/package/react-google-auth
Кто нибудь помогите разобраться вот так выглядит example этого npm пакета
import React from 'react';
import ReactGoogleAuth from 'react-google-auth';
function Example(props) {
console.log("gapi exists", gapi);
return <div>
<h1>App goes here</h1>
<button onClick={props.onSignOutClick}>Sign out</button>
</div>;
}
function Loader(props) {
return <div>Loading...</div>;
}
function SignIn(props) {
if(props.initializing) {
return <div className="Text Text-emphasis">Initializing...</div>;
}
if(props.error) {
console.log('Error', props.error);
return <div className="Text Text-strong">Error!</div>;
}
return <div>
<button className="Button Button-primary" onClick={props.onSignInClick}>Sign in</button>
{props.signingIn && <div>Signing in...</div>}
</div>;
}
export default ReactGoogleAuth({
clientId: "828692616521-a30cidgltv5cfhg8fbi344i9sqquj138.apps.googleusercontent.com",
discoveryDocs: ["https://sheets.googleapis.com/$discovery/rest?version=v4"],
loader: Loader,
scope: "https://www.googleapis.com/auth/spreadsheets",
signIn: SignIn
})(Example);
Там где
unction Example(props) {
console.log("gapi exists", gapi);
return <div>
<h1>App goes here</h1>
<button onClick={props.onSignOutClick}>Sign out</button>
</div>;
}
Я так понял отображается после авторизации , но как сделать если у меня в react приложении вот такая иерархия
То есть все копоненты подключены в index.js через провайдер и роуты
А хотелось бы что бы после авторизации выводились как раз таки и они - то есть например авторизовался пользователь и у него появляется тот же сайт что он видел только уже например без кнопи 'зарегистрироваться '??? пожалуйста помогите , посоветуйте как это сделать , демка npm пакета
https://dxinteractive.github.io/react-google-auth/