src/config.html from nandenjin/gmail-to-slack

src/config.html
Summary

Maintainability

Test Coverage

Issues
<!doctype html>
<html>
  <head>
    <link rel="preconnect" href="https://fonts.gstatic.com" />
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <meta name="robots" content="noindex" />
    <title>Gmail to Slack</title>
    <link
      href="https://fonts.googleapis.com/css2?family=Roboto&display=swap"
      rel="stylesheet"
    />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <style>
      html,
      body {
        background-color: #fff;
        color: #444;
        font:
          normal 14px 'Roboto',
          sans-serif;
      }

      h1,
      h2 {
        font-weight: normal;
      }
    </style>
  </head>
  <body>
    <h1>Gmail to Slack</h1>
    <p id="session"></p>

    <h2>Gmail Label</h2>
    <p>
      Select a label and compose filters to set label to emails to be forwarded.
    </p>
    <select id="gmail-label"></select>
    <button id="save-gmail-label">Save</button>

    <h2>Slack URL</h2>
    <p>Copy-paste Incoming Webhook URL</p>
    <input
      type="url"
      id="slack-url"
      size="80"
      placeholder="https://hooks.slack.com/services/XXXXXXXXXXXXXXXXXXXXX"
    />
    <button id="save-slack-url">Save</button>

    <hr />
    <p>
      Generated by
      <a
        href="https://github.com/nandenjin/gmail-to-slack"
        target="_blank"
        rel="noopener"
        >gmail-to-slack</a
      >
    </p>

    <script>
      function runAsync(funcName) {
        return new Promise((resolve) => {
          google.script.run.withSuccessHandler(resolve)[funcName]()
        })
      }

      google.script.run
        .withSuccessHandler((email) => {
          $('#session').text(`Logged in as ${email}`)
        })
        .withUserObject(this)
        .getUserEmail()

      Promise.all([
        runAsync('getUserGmailLabels'),
        runAsync('getGmailLabelName'),
      ]).then(([labels, currentLabel]) => {
        $('#gmail-label').append(
          labels.map((label) =>
            $('<option>', {
              value: label,
              selected: label === currentLabel,
            }).text(label)
          )
        )
      })

      google.script.run
        .withSuccessHandler((url) => {
          $('#slack-url').val(url)
        })
        .getSlackUrl()

      // onClick
      $('#save-slack-url').on('click', () => {
        google.script.run
          .withSuccessHandler(() => {
            alert('Successfly updated')
          })
          .setSlackUrl($('#slack-url').val())
      })

      $('#save-gmail-label').on('click', () => {
        google.script.run
          .withSuccessHandler(() => alert('Successfly updated'))
          .setGmailLabel($('#gmail-label').val())
      })
    </script>
  </body>
</html>