microsoft / hack-together

Hack Together: Microsoft Graph and .NET is a hackathon for .NET developers to learn Microsoft Graph and Microsoft 365.
MIT License
523 stars 85 forks source link

Project: Displaying personal info and sending emails via Microsoft Graph #163

Open ron-zhong opened 1 year ago

ron-zhong commented 1 year ago

Project name

Displaying personal info and sending emails via Microsoft Graph

Description

Try it out here https://blazor-graph.azurewebsites.net Untitled video - Made with Clipchamp (3)

By participating Hack Together: Microsoft Graph and .NET hackathon as beginners, we downloaded the sample code from here

We created a new app registration Hackathon.Graph.Blazor under our coporate POC Azure subscription and configured the post-login-return-url as below: image

We enriched the sample application by retrieving additional personal info and display first 10 email subjects via Microsoft Graph .

1. Display personal info like: name, mobile number, job title, and etc

<table class="table table-striped table-condensed" style="font-family: monospace">
    <tr>
        <th>Property</th>
        <th>Value</th>
    </tr>
    <tr>
        <td>Name</td>
        <td>@_user.DisplayName</td>
    </tr>
    <tr>
        <td>Mail</td>
        <td>@_user.Mail</td>
    </tr>
    <tr>
        <td>MobilePhone</td>
        <td>@_user.MobilePhone</td>
    </tr>
    <tr>
        <td>OfficeLocation</td>
        <td>@_user.OfficeLocation</td>
    </tr>
    <tr>
        <td>JobTitle</td>
        <td>@_user.JobTitle</td>
    </tr>
</table>

2. Displaying first 25 email messages

<h4 class="text-primary">Top 25 Emails</h4>
<div class="table-responsive">
    <table class="table table-hover table-borderless">
    <thead>
        <tr>
            <td>From</td>
            <td>Subject</td>
            <td>Received at</td>
        </tr>
    </thead>
    <tbody>
        @foreach (var message in _messages)
        {
            <tr>
                <td class="text-primary text-decoration-underline">@(message.From.EmailAddress.Address)</td>
                <td>@message.Subject</td>
                <td class="text-nowrap">@(message.ReceivedDateTime.Value.ToLocalTime().ToString())</td>

            </tr>
        }
    </tbody>
</table>
</div>

image

3. Send an email via Microsoft Graph

var message = new Message
{
    Subject = subject,
    Body = new ItemBody
    {
        Content = body,
        ContentType = BodyType.Text
    },
    ToRecipients = new Recipient[]
    {
        new Recipient
        {
            EmailAddress = new EmailAddress
            {
                Address = to
            }
        }
    }
};
await _graphServiceClient.Me.SendMail(message).Request().PostAsync();

image

Thank you very much!! Happy coding!!!

Contributors

Ron Zhong Su Su Mirza Ghulam Rasyid Marxis Cabero

Repo URL

https://github.com/mimshub/hack-together-graph-blazor-net7

Team members

ron-zhong, mims-susu, mirzaevolution, mccabero

waldekmastykarz commented 1 year ago

Thank you for your submission @Ron-Zhong! Would you be willing to record a short video to demonstrate the app? It's not required for the hackathon but it would help us showcase your work internally at Microsoft and publicly in the community 😊

ron-zhong commented 1 year ago

Hi Sir @waldekmastykarz Yes, of course. I'd love to record a video to showcase our work. Would you let me know 1. which format shall I record and 2. where to upload? Thank you very much!!

waldekmastykarz commented 1 year ago

Any format will work. You can add it to a comment here, add it to your repo or upload to YouTube. Whichever is the most convenient for you. Thank you!

aycabas commented 1 year ago

Hi @Ron-Zhong, we are going through your submission and seems like members of your team mims-susu, mirzaevolution and mccabero are not registered to the hackathon. Can you please make sure that they are registered, so that they will be eligible for the prizes and a digital badge. Thank you.

ron-zhong commented 1 year ago

Hi @aycabas my team mates (mims-susu, mirzaevolution and mccabero) have all registered. Would you kindly check again and sorry for the inconvenience. Many thanks. ;)

ron-zhong commented 1 year ago

Hi @waldekmastykarz, I've updated the description section by uploading the video in gif format. Thank you. Untitled video - Made with Clipchamp (3)

aycabas commented 1 year ago

Hi @aycabas my team mates (mims-susu, mirzaevolution and mccabero) have all registered. Would you kindly check again and sorry for the inconvenience. Many thanks. ;)

Thanks @Ron-Zhong for your quick response, I can see mirzaevolution and mccabero are registered. Still can't find the registration information for mims-susu. Can you please double check with your teammate and let me know, thank you 🙏

ron-zhong commented 1 year ago

Hi @aycabas, Just check with my teammate "mims-susu", she registered with below info.

Would you advise us, anything else we may need to do in order to verify her registration? And sorry for the inconvenience. :) Thank you. image