Missing routes for Slack oAuth

// Define specific routes first
route SlackAuthRoute { path: "/slack/auth", to: SlackAuthPage }
route SlackCallbackRoute { path: "/slack/callback", to: SlackCallbackPage }

// Any wildcard routes should come last
route WildcardRoute { path: "*", to: WildcardPage }

// Define specific routes first
route SlackAuthRoute { path: "/slack/auth", to: SlackAuthPage }
route SlackCallbackRoute { path: "/slack/callback", to: SlackCallbackPage }

// Any wildcard routes should come last
route WildcardRoute { path: "*", to: WildcardPage }

{serverUrl}/auth/{provider}/callback

{serverUrl}/auth/{provider}/callback

{clientUrl}/auth/login/{provider}

{clientUrl}/auth/login/{provider}

// in main.wasp
app MyApp {
  title: "My app",
  // ...
  server: {
    setupFn: import { mySetupFunction } from "@src/myServerSetupCode.js"
  }
}

// in main.wasp
app MyApp {
  title: "My app",
  // ...
  server: {
    setupFn: import { mySetupFunction } from "@src/myServerSetupCode.js"
  }
}

// src/myServerSetupCode.js
export const mySetupFunction = async ({ app }) => {
  // Add custom Slack OAuth routes
  app.get('/slack/auth', (req, res) => {
    // Your Slack auth logic
  })
  
  app.get('/slack/callback', (req, res) => {
    // Your Slack callback handling logic
  })
}

// src/myServerSetupCode.js
export const mySetupFunction = async ({ app }) => {
  // Add custom Slack OAuth routes
  app.get('/slack/auth', (req, res) => {
    // Your Slack auth logic
  })
  
  app.get('/slack/callback', (req, res) => {
    // Your Slack callback handling logic
  })
}

// src/server/setupSpaFallback.js
import express from 'express'
import { resolve } from 'path'
import { fileURLToPath } from 'url'
import { ServerSetupFn } from 'wasp/server'
import axios from 'axios' // You'll need to install this

/** @type {ServerSetupFn} */
export const setupSpaFallback = async ({ app }) => {
  // Static files setup as you have it...
  const __dirname = fileURLToPath(new URL('.', import.meta.url))
  const webAppDir = resolve(process.cwd(), '.wasp/out/web-app')
  const indexHtml = resolve(webAppDir, 'index.html')

  app.use('/assets', express.static(resolve(webAppDir, 'assets')))

  // Slack OAuth initiation
  app.get('/slack/auth', (req, res) => {
    const slackAuthUrl = `<https://slack.com/oauth/v2/authorize?client_id=${process.env.SLACK_CLIENT_ID}&scope=chat:write&redirect_uri=${encodeURIComponent(process.env.WASP_SERVER_URL> + '/slack/callback')}`
    res.redirect(slackAuthUrl)
  })
// Slack OAuth callback
  app.get('/slack/callback', async (req, res) => {
    const { code } = req.query
    
    if (!code) {
      return res.status(400).send('Missing authorization code')
    }

    try {
      // Exchange code for access token
      const response = await axios.post('<https://slack.com/api/oauth.v2.access',> null, {
        params: {
          client_id: process.env.SLACK_CLIENT_ID,
          client_secret: process.env.SLACK_CLIENT_SECRET,
          code,
          redirect_uri: process.env.WASP_SERVER_URL + '/slack/callback'
        }
      })

      // Store the token in your database for the user
      // You'll need to implement this part based on your app's needs
      
      // Redirect to a success page
      res.redirect('/slack-integration-success')
    } catch (error) {
      console.error('Slack OAuth error:', error)
      res.redirect('/slack-integration-error')
    }
  })

  // Catch-all for any other client-side route
  app.get('*', (_req, res) => {
    res.sendFile(indexHtml)
  })
}

// src/server/setupSpaFallback.js
import express from 'express'
import { resolve } from 'path'
import { fileURLToPath } from 'url'
import { ServerSetupFn } from 'wasp/server'
import axios from 'axios' // You'll need to install this

/** @type {ServerSetupFn} */
export const setupSpaFallback = async ({ app }) => {
  // Static files setup as you have it...
  const __dirname = fileURLToPath(new URL('.', import.meta.url))
  const webAppDir = resolve(process.cwd(), '.wasp/out/web-app')
  const indexHtml = resolve(webAppDir, 'index.html')

  app.use('/assets', express.static(resolve(webAppDir, 'assets')))

  // Slack OAuth initiation
  app.get('/slack/auth', (req, res) => {
    const slackAuthUrl = `<https://slack.com/oauth/v2/authorize?client_id=${process.env.SLACK_CLIENT_ID}&scope=chat:write&redirect_uri=${encodeURIComponent(process.env.WASP_SERVER_URL> + '/slack/callback')}`
    res.redirect(slackAuthUrl)
  })
// Slack OAuth callback
  app.get('/slack/callback', async (req, res) => {
    const { code } = req.query
    
    if (!code) {
      return res.status(400).send('Missing authorization code')
    }

    try {
      // Exchange code for access token
      const response = await axios.post('<https://slack.com/api/oauth.v2.access',> null, {
        params: {
          client_id: process.env.SLACK_CLIENT_ID,
          client_secret: process.env.SLACK_CLIENT_SECRET,
          code,
          redirect_uri: process.env.WASP_SERVER_URL + '/slack/callback'
        }
      })

      // Store the token in your database for the user
      // You'll need to implement this part based on your app's needs
      
      // Redirect to a success page
      res.redirect('/slack-integration-success')
    } catch (error) {
      console.error('Slack OAuth error:', error)
      res.redirect('/slack-integration-error')
    }
  })

  // Catch-all for any other client-side route
  app.get('*', (_req, res) => {
    res.sendFile(indexHtml)
  })
}

// main.wasp

// ...
api slackLogin {
  fn: import { login } from "@src/api/slack",
  httpRoute: (GET, "/slack/auth")
}

api slackCallback {
  fn: import { callback } from "@src/api/slack",
  httpRoute: (GET, "/slack/callback")
}
// ...

// main.wasp

// ...
api slackLogin {
  fn: import { login } from "@src/api/slack",
  httpRoute: (GET, "/slack/auth")
}

api slackCallback {
  fn: import { callback } from "@src/api/slack",
  httpRoute: (GET, "/slack/callback")
}
// ...

// src/api/slack.ts

import * as arctic from "arctic"
import {type SlackLogin, type SlackCallback} from "wasp/server/api"
import assert from "node:assert/strict"
import { config } from 'wasp/server'

const slack = new arctic.Slack(process.env.SLACK_CLIENT_ID!, process.env.SLACK_CLIENT_SECRET!, process.env.SLACK_REDIRECT_URI)

export const login: SlackLogin = async (req, res) => {
  const state = arctic.generateState()
  const url = slack.createAuthorizationURL(state, ['openid', 'profile', /* add any more scopes you need */]);
  res.cookie('oauth-state', state, {
    secure: true, // set to false in localhost
    path: "/",
    httpOnly: true,
    maxAge: 60 * 10 // 10 min
  })
  res.redirect(url.toString())
}

export const callback: SlackCallback = async (req, res) => {
  const {code, state: urlState} = req.query
  const {state: cookieState} = req.cookies
  assert.equals(urlState, cookieState, "State does not match")
  assert(code, "No code given")
  const tokens = await slack.validateAuthorizationCode(code);
  const accessToken = tokens.accessToken();
  const idToken = tokens.idToken();

  // now you can store the access and id tokens wherever you need them

  // and redirect to your `page`
  res.redirect(new URL('/slack-done', config.frontendUrl).toString())
}

// src/api/slack.ts

import * as arctic from "arctic"
import {type SlackLogin, type SlackCallback} from "wasp/server/api"
import assert from "node:assert/strict"
import { config } from 'wasp/server'

const slack = new arctic.Slack(process.env.SLACK_CLIENT_ID!, process.env.SLACK_CLIENT_SECRET!, process.env.SLACK_REDIRECT_URI)

export const login: SlackLogin = async (req, res) => {
  const state = arctic.generateState()
  const url = slack.createAuthorizationURL(state, ['openid', 'profile', /* add any more scopes you need */]);
  res.cookie('oauth-state', state, {
    secure: true, // set to false in localhost
    path: "/",
    httpOnly: true,
    maxAge: 60 * 10 // 10 min
  })
  res.redirect(url.toString())
}

export const callback: SlackCallback = async (req, res) => {
  const {code, state: urlState} = req.query
  const {state: cookieState} = req.cookies
  assert.equals(urlState, cookieState, "State does not match")
  assert(code, "No code given")
  const tokens = await slack.validateAuthorizationCode(code);
  const accessToken = tokens.accessToken();
  const idToken = tokens.idToken();

  // now you can store the access and id tokens wherever you need them

  // and redirect to your `page`
  res.redirect(new URL('/slack-done', config.frontendUrl).toString())
}

import { config } from 'wasp/client'

const installSlackHref = new URL("/slack/auth", config.apiUrl).toString()
export const InstallSlackLink = () => {
  return <a href={installSlackHref}>Install Slack</a>
}

import { config } from 'wasp/client'

const installSlackHref = new URL("/slack/auth", config.apiUrl).toString()
export const InstallSlackLink = () => {
  return <a href={installSlackHref}>Install Slack</a>
}