<template>
  <div class="container">
    <el-button 
      type="primary" 
      class="aad-login-btn" 
      @click="handleAADLogin">
      <my-icon name="microsoft" />
      {{ $t('message.label.aad_login') }}
    </el-button>
  </div>
</template>

<script setup lang="ts">
import { PublicClientApplication } from "@azure/msal-browser";

const msalConfig = {
  auth: {
    clientId: import.meta.env.VITE_AAD_CLIENT_ID,
    authority: `https://login.microsoftonline.com/${import.meta.env.VITE_AAD_TENANT_ID}`,
    redirectUri: import.meta.env.VITE_AAD_REDIRECT_URI
  }
};

const msalInstance = new PublicClientApplication(msalConfig);
const handleAADLogin = async () => {
    
};
</script>

<style scoped>
.aad-login-btn {
  width: 100%;
  margin-top: 20px;
  background: #2F2F2F;
  border-color: #2F2F2F;
  
  &:hover {
    background: #505050;
    border-color: #505050;
  }
}
</style>