<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
    xmlns:o="urn:schemas-microsoft-com:office:office">

<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="format-detection" content="date=no" />
    <meta name="format-detection" content="address=no" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="x-apple-disable-message-reformatting" />
    <link
        href="https://fonts.googleapis.com/css?family=Fira+Sans:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Oxygen:300,400,700|Roboto:300,300i,400,400i,500,500i,700,700i,900,900i|Ubuntu:300,300i,400,400i,500,500i,700,700i&amp;display=swap"
        rel="stylesheet" />
    <style type="text/css" media="screen">
        @font-face {
            font-family: 'Graphik';
            src: url('https://d3e54v103j8qbb.cloudfront.net/fonts/Graphik-Regular-Web.5a0c1a002e.woff') format('woff'),
                url('https://d3e54v103j8qbb.cloudfront.net/fonts/Graphik-Regular-Web.5e78809d4d.eot') format('embedded-opentype'),
                url('https://d3e54v103j8qbb.cloudfront.net/fonts/Graphik-Regular-Web.9806bc37bf.woff') format('woff');
            font-weight: 400;
            font-style: normal;
        }

        @font-face {
            font-family: 'Graphik';
            src: url('https://d3e54v103j8qbb.cloudfront.net/fonts/Graphik-Medium-Web.abf6e1188f.woff') format('woff'),
                url('https://d3e54v103j8qbb.cloudfront.net/fonts/Graphik-Medium-Web.2523d1a466.eot') format('embedded-opentype'),
                url('https://d3e54v103j8qbb.cloudfront.net/fonts/Graphik-Medium-Web.4327644773.woff') format('woff');
            font-weight: 500;
            font-style: normal;
        }

        body {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 100vh;
            width: 100%;
            margin: 0;
            font-family: 'Graphik', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI',
                'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
                'Droid Sans', 'Helvetica', sans-serif;
        }

        a {
            color: #4353ff;
            text-decoration: none;
        }

        img {
            -ms-interpolation-mode: bicubic;
        }

        table {
            border-collapse: collapse;
            width: 98%;
            margin-bottom: 28px;
            margin-top: 18px;
        }

        h3 {
            padding-bottom: 8px;
            color: #000000;
            font-size: 36px;
            line-height: 44px;
            text-align: left;
            font-weight: 500;
            font-family: 'Graphik', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI',
                'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
                'Droid Sans', 'Helvetica', sans-serif;
            margin-bottom: 18px;
        }

        th,
        td {
            padding: 18px;
            text-align: left;
            border-bottom: 1px solid #ddd;
            font-family: 'Graphik', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI',
                'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
                'Droid Sans', 'Helvetica', sans-serif;
        }

        th {
            border-bottom: 1px solid #ddd;
            color: black;
        }

        span {
            padding-bottom: 30px;
            font-size: 14px;
            line-height: 24px;
            color: #000001;
            text-align: center;
        }

        .header {
            margin-top: 32px;
        }

        .header span {
            padding-bottom: 16px;
            color: #000001;
            font-family: 'Graphik',
                '-apple-system',
                'BlinkMacSystemFont', 'Segoe UI',
                'Roboto', 'Oxygen', 'Ubuntu',
                'Cantarell', 'Fira Sans',
                'Droid Sans', 'Helvetica',
                sans-serif !important;
            font-size: 20px;
            line-height: 30px;
            text-align: left;
            min-width: auto !important;
        }

        .button {
            mso-padding-alt: 16px 20px;
            color: #ffffff;
            font-family: 'Graphik',
                '-apple-system',
                'BlinkMacSystemFont',
                'Segoe UI', 'Roboto',
                'Oxygen', 'Ubuntu',
                'Cantarell', 'Fira Sans',
                'Droid Sans',
                'Helvetica', sans-serif !important;
            font-size: 14px;
            line-height: 18px;
            text-align: center;
            font-weight: 500;
            margin-bottom: 18px;
            width: 10% !important;
            background: #6e41e2;
        }
    </style>
</head>

<body>
    <div class="header">
        <a href="https://www.activepieces.com" target="_blank" style="
                                                color: #4353ff;
                                                text-decoration: none;
                                              "><img
                src="http://cdn.mcauto-images-production.sendgrid.net/515abc4911512d94/8915d91a-9ecd-4dd9-9cea-21b061e1a97f/427x66.png"
                width="160" border="0" alt="Activepieces logo" style="
                                                  -ms-interpolation-mode: bicubic;
                                                " /></a>
        <h3>{{projectName}} issues summary</h3>
        <span>There are {{issuesCount}} unresolved issues for {{projectName}}.</span>
    </div>

    <table>
        <thead>
            <tr>
                <th>Flow Name</th>
                <th>Count</th>
                <th>First Seen</th>
                <th>Last Seen</th>
            </tr>
        </thead>
        <tbody>
            {{#renderIssues}}
            <tr>
                <td>{{flowDisplayName}}</td>
                <td>{{count}}</td>
                <td>{{created}}</td>
                <td>{{lastOccurrence}}</td>
            </tr>
            {{/renderIssues}}
        </tbody>
    </table>
    <div class="text-button black-button button">
        <a href="{{issuesUrl}}" target="_blank" class="link-button button-inner" style="
                                                              text-decoration: none;
                                                              padding: 16px 20px;
                                                              display: block;
                                                              color: #ffffff;
                                                            ">
            <span class="link-button" style="color: #ffffff">
                View Issues
            </span></a>
    </div>

     {{> footer}}
</body>

</html>