Add an example for associating an AWS WAF Web ACL with a CloudFront distribution

[Apoorvjain09]

Hi SST team 👋

First off, huge fan of SST. We use SST v3 extensively in production.

While adding AWS WAF (Bot Control) in front of a sst.aws.Nextjs app, I ran into a docs gap that took a while to figure out. The behavior is correct, but undocumented, and it’s very easy to get wrong.

I'll be more than happy to add an example myself, and here is the code I'd expect to write:

---

1. Create a CloudFront Web ACL

const webAcl = new aws.wafv2.WebAcl("WebAcl", {
  scope: "CLOUDFRONT",
  defaultAction: { allow: {} },

  visibilityConfig: {
    cloudwatchMetricsEnabled: true,
    metricName: "web-acl",
    sampledRequestsEnabled: true,
  },

  rules: [
    {
      name: "AWSManagedRules",
      priority: 0,
      overrideAction: { none: {} },
      statement: {
        managedRuleGroupStatement: {
          vendorName: "AWS",
          name: "AWSManagedRulesCommonRuleSet",
        },
      },
      visibilityConfig: {
        cloudwatchMetricsEnabled: true,
        metricName: "managed-rules",
        sampledRequestsEnabled: true,
      },
    },
  ],
})

---

2. Attach the Web ACL to a Next.js CloudFront distribution

const site = new sst.aws.Nextjs("NextjsSite", {
  path: "web/",
  transform: {
    cdn: {
      transform: {
        distribution(args) {
          args.webAclId = webAcl.arn
        },
      },
    },
  },
})

If this is something the SST team feels would be useful to document, I’d be happy to open a PR adding this as an example to the docs.

[vimtor]

hey @Apoorvjain09

please feel free to contribute an example, i'll be happy to review it

you might also want to read #5846

i believe @straygar's comment is right, so maybe we could add this as a built-in thing

[Apoorvjain09]

hey @vimtor

I ended up putting together an example and opened a PR here:
#6323

[vimtor]

closing in favour of #6379