Agave User

Usage

User logged

Hola

Agave User

pages/index.tsx
  <AgaveHeader
    endAdornment={
      <AgaveUser name="Agave User" />
    }
  />

User logged with menu options

Hola

Agave User

pages/index.tsx
export function AgaveHeader() {
  const handleClick = () => {
    console.log('hola');
  };
  return (
    <AgaveHeader
      endAdornment={
        <AgaveUser
          name="Agave User"
          userOptions={[
            {
              link: (
                <Link href="/hola" color="text.primary">
                  Cerrar sesión
                </Link>
              ),
            },
            { label: 'Texto ejemplo', onClick: handleClick },
          ]}
        />
      }
    />
  );
}

Current station

Hola

Agave User

Estás trabajando en: MX

pages/index.tsx
  <AgaveHeader
    endAdornment={
      <AgaveUser
        name="Agave User"
        stationId="MX"
      />
    }
  />

Live editor

https://providers-price-engine.vercel.app/

Live Editor
  <div style={{position: 'relative', height: '50px'}}>
    <AgaveHeader
      appBarProps={{position: 'absolute'}}
      endAdornment={
      <AgaveUser
        name="Agave User"
        stationId="MX"
      />
    }
    />
  </div>
Result
Loading...

Props

Props

Name	Type	Default	Description
name	string		The name of user logged.
stationId	string		The station where the logged in user is located.
userOptions	Array	[]	Options related to the logged in user.