AWS S3 Bucket policy editor access denied

"Manage public bucket policies for this bucket" section need to be unchecked for to introduce "Allow" policies.

But be cautious, unchecking these might enable you to introduce a policy but that policy is a public policy making your bucket public.

Having these checked - You won't be able to introduce "Allow" policies that for this bucket.

You can however introduce "Deny" policies, with these options checked.

The accepted answer works even if related comments suggest it's not a good idea for security reasons. In fact it is in line with AWS instructions for static website hosting here

https://docs.aws.amazon.com/AmazonS3/latest/userguide/HostingWebsiteOnS3Setup.html

which answers the OP's question.

To summarise the steps (given in the linked page) to configure a static website on Amazon S3:

1. Create a bucket
2. Enable static website hosting
3. Unblock all public access
4. Add the bucket policy that makes your content publicly available (the yaml config you have in your post)
5. Configure your index document (usually index.html)
6. Configure any error/redirect/no-auth documents (for React this is usually also index.html)

This could be due to recent changes in S3. To fix this issue, you need to assign Public Access to the bucket, follow the below steps:

1. In the Permissions tab click on the Block Public Access settings.

2. Click Edit to the right of these settings.

3. Make sure Block public access to buckets and objects granted through new public bucket or access point policies option is deselected.

4. Click Save.

5. Go back to the Bucket Policy and try again.