[Known Issues] v3.0.0 Previews and RCs

[sebastienlevert]

This lists all the current known issues of the latest v3.0.0-Preview.1 release of the Microsoft Graph Toolkit :

• [x] ToDo and Planner components are not updated to Fluent UI
• [x] Dark Mode is broken in when used with mgt-theme-toggle
• [x] Audio call on the Person Card is not issuing a call
• [x] #2117
• [x] #2158
• [x] #2217
• [x] #2333

Please use this issue to report other issues you are encountering while testing the v3.0.0-Preview.1 release!

[ghost]

Hello sebastienlevert, thank you for opening an issue with us!

I have automatically added a "needs triage" label to help get things started. Our team will analyze and investigate the issue, and escalate it to the relevant team if possible. Other community members may also look into the issue and provide feedback 🙌

[sohilbhalla]

The new Graph Toolkit 3 is looking amazing and very close to Microsoft OOB design.

I have tried integrating it with my custom implementation of teams chat and it has come out very well. Here is a screenshot of the old and new design of the people component.

Old Design

New Design

But what I noticed is the Audio call button does not work, as in it does not launch teams and make a call, as the video call option does. Is this a known issue ? If yes then probably I will try to fix it and create a PR.

[sebastienlevert]

It's something we were not aware. Would you mind creating a specific issue and if you can, provide a PR to fix it? Thanks!

[musale]

Failing to compile in Angular with @microsoft/mgt

I have an Angular 14 repo with basic setup. I use @microsoft/mgt but during compiling with npm start, I get the following error:

Build at: 2023-03-21T11:51:07.886Z - Hash: 70ecd431cd6c141f - Time: 13475ms

./node_modules/@microsoft/mgt/dist/es6/index.js:15:0-45 - Error: Module not found: Error: Can't resolve '@microsoft/mgt-mock-provider' in '/home/user/Projects/mgt-demo-angular/node_modules/@microsoft/mgt/dist/es6'

Error: node_modules/@microsoft/mgt/dist/es6/index.d.ts:15:15 - error TS2307: Cannot find module '@microsoft/mgt-mock-provider' or its corresponding type declarations.

15 export * from '@microsoft/mgt-mock-provider';
                 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

✖ Failed to compile.

My workaround

Install the provider(@microsoft/mgt-msal2-provider), provider config(@microsoft/mgt-element) and components(@microsoft/mgt-components) separately.

// src/app/app.component.ts file
import { Component, OnInit } from '@angular/core';
import { Msal2Provider } from '@microsoft/mgt-msal2-provider';
import { Providers } from '@microsoft/mgt-element';
import { environment } from '../environments/environment';
import '@microsoft/mgt-components'; // <- dont' forget this for the components to load

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit{
  title: string = "MGT V3 Preview 1";

  ngOnInit(): void {
      Providers.globalProvider = new Msal2Provider({
        clientId: environment.clientId
      })
  }
}

[ThomasPe]

Are there docs / storyboard for the React preview components already somewhere? I updated my app to preview but have some issues with the Person component (not showing email with twolines, not taking enough space)

[sebastienlevert]

They are the same as the web components. We don't have a specific storybook for React components... You can look here : https://mgt.dev/next/v3

Please post your issues and we'll be looking into them ASAP!

[ThomasPe]

I see, thx. Was a bit confused that the Person component now only shows the email with view=fourlines as I think this would be the most important after the name. I feel like react-specific docs would add some value since some things seem to be slightly different at time. e.g. currently I'm having trouble overriding the avatar size for a two-lined person which is called --person-avatar-size instead of --avatar-size but always take the components variable over mine.

[ThomasPe]

should new (potential) issues be collected here or in new issues? I feel like the person component should not be responsive. Currently the avatar gets squashed on lack of space and lines wrap depending on name length. this makes it hard to use the component for example in a grid with auto width where you want the column to give exaclty as much space to the person as it needs to be rendered correctly.

[saahilchawande123]

Hello, I just checked out the v3 version of mgt, we are using MGT PeoplePicker in our application (import { PeoplePicker } from '@microsoft/mgt-react'), but when trying to view the People Picker in our application, I just shows Object object in the suggestions flyout.

[sebastienlevert]

@ThomasPe please create an issue for this one, we will be referencing it here!

[sebastienlevert]

@saahilchawande123 we haven't seen this one. Can you provide a repro? And create a dedicated issue? Thanks!

[gavinbarron]

But what I noticed is the Audio call button does not work, as in it does not launch teams and make a call, as the video call option does. Is this a known issue ? If yes then probably I will try to fix it and create a PR.

In my testing the audio call button was working. I wonder if there's some specific software configuration required on the machine being used?

[gavinbarron]

Closing this as we have launched v3