🎨UI Customization

enabledAuthProviders: if you want to enable only a specific provider you can do it easily by adding the parameter enabledProviders to the constructor of Eartho. Install the SDK and initialize Eartho

JS

const earthoOneConfig = {
                accessId: 'testid',
                enabledAuthProviders: ['facebook','google','apple']
};

const earthoOne = connectWithPopup(earthoOneConfig);

Or

const earthoOne = connectWithRedirect(earthoOneConfig);

React

// src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { EarthoOneProvider } from '@eartho/one-client-react';
import App from './App';

ReactDOM.render(

  <EarthoOneProvider
    clientId="YOUR_EARTHO_CLIENT_ID"
  >
  
    <button
    className="btn btn-outline-success"
    id="login"
    onClick={() => connectWithRedirect({
      accessId: process.env.NEXT_PUBLIC_ACCESS_ID,
      enabledAuthProviders: ['facebook','google','apple']
    })}
  >
    login
  </button>

  </EarthoOneProvider>,
  document.getElementById('app')
);

Vue

import { createEarthoOne } from '@eartho/one-client-vue';

const app = createApp(App);

app.use(
  createEarthoOne({
    client_id: '<YOUR_EARTHO_CLIENT_ID>',
    enabled_providers: ['facebook','google','twitter']
  })
);

app.mount('#app');

Angular

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

// Import the module from the SDK
import { AuthModule } from '@eartho/one-client-angular';

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,

    // Import the module into the application, with configuration
    AuthModule.forRoot({
      clientId: 'YOUR_EARTHO_CLIENT_ID',
      enabledProviders: ['facebook','google','apple']
    }),
  ],

  bootstrap: [AppComponent],
})
export class AppModule {}

Kotlin

const earthoOneConfig = {
                client_id: "YOUR_EARTHO_CLIENT_ID",
                redirect_uri: 'https://your.website',
                enabled_providers: ['facebook','google','apple']
};
const earthoOne = createEarthoOne(earthoOneConfig);

Swift

let earthoOne = EarthoOne(
"YOUR_EARTHO_CLIENT_ID", 
"YOUR_EARTHO_CLIENT_SECRET", 
enabledProvider:['facebook','google','twitter'])

Flutter

EarthoOne(
"YOUR_EARTHO_CLIENT_ID", 
"YOUR_EARTHO_CLIENT_SECRET", 
enabledProvider:['facebook','google','twitter'])

React Native

earthoInit(
  "YOUR_EARTHO_CLIENT_ID", 
  "YOUR_EARTHO_CLIENT_SECRET", 
enabledProvider: ['facebook','google']);  
}, []);