Merge branch 'main' into l10n-es

Author: Wituareard

.vscode/settings.json

@@ -6,5 +6,5 @@
 		}
 	],
 	"eslint.useFlatConfig": true,
-	"eslint.validate": ["svelte"]
+	"eslint.validate": ["svelte", "markdown"]
 }

README.md

@@ -88,6 +88,57 @@ The article (and automatic l10ns of same) will be previewable.
 
 If you are sufficiently changing prominent text, consider inspecting relevant l10ns as well as the original.
 
+### Image Optimization
+
+To improve performance, images are automatically processed and delivered in multiple formats (e.g., WebP, AVIF) and resolutions. This is handled by the `Image` Svelte component, which optimizes images located in the `src/assets/images` directory.
+
+#### Usage
+
+To use optimized images, first, ensure your image file (e.g., `my-image.png`) is located within the `src/assets/images` directory. Then, choose one of the following methods to embed it:
+
+- **In Markdown Files:** Use standard Markdown image syntax. The system will automatically process the image through the `Image` component. The path in the Markdown should be relative to `src/assets/images` and start with a forward slash `/`.
+
+  Example:
+
+  ```markdown
+  ![A description of my image](/my-image.png)
+  ```
+
+  If your image is in a subdirectory, for example `src/assets/images/illustrations/another-image.jpg`, the path would be:
+
+  ```markdown
+  ![Another image description](/illustrations/another-image.jpg)
+  ```
+
+- **In Svelte Components:** If you need to use the `Image` component directly in a Svelte component, import it and pass the `src` prop relative to `src/assets/images` and starting with a forward slash `/`.
+
+  Example:
+
+  ```svelte
+  <script>
+  	import Image from '$lib/components/Image.svelte'
+  </script>
+
+  <Image src="/my-image.png" alt="A description of my image" />
+  ```
+
+## Redirects
+
+The `src/lib/redirects.ts` file defines server-side redirects for specific paths. This is useful for handling cases like old URLs or vanity URLs.
+
+The `REDIRECTS` object maps incoming paths to their target paths. When a request comes in for a path defined in `REDIRECTS`, the `handleRedirects` function issues a 301 (Moved Permanently) redirect to the specified target.
+
+Example:
+
+```typescript
+const REDIRECTS: Record<string, string> = {
+	'/old-path': '/new-path',
+	'/legacy-page': '/current-page'
+}
+```
+
+To add a new redirect, simply add a new entry to the `REDIRECTS` object in `src/lib/redirects.ts`.
+
 ## Deployment
 
 The contents of the repository are continuously deployed to Netlify when code is pushed.

SELFIE_SETUP.md

@@ -0,0 +1,176 @@
+# Selfie Upload Feature Setup
+
+This feature allows supporters to upload selfies for the AI safety book campaign collage.
+
+(touched to provoke PR deploy)
+
+## Quick Start for Developers
+
+You have two options:
+
+### Option A: Use Anthony's Shared Test Account (Easiest)
+
+- Cloud name and API key are already in `.env`
+- Get the `CLOUDINARY_API_SECRET` from Psono (shared password manager)
+- You're sharing Anthony's test account - that's fine for prototyping!
+- Note: Production will use a different account once we're done testing
+
+### Option B: Use Your Own Free Cloudinary Account
+
+Follow the setup below if you want your own isolated testing environment.
+
+#### Creating Your Own Free Account:
+
+1. Sign up at https://cloudinary.com/users/register_free (use GitHub login if you prefer)
+2. You'll get:
+   - 25GB storage
+   - 25GB bandwidth/month
+   - 3 user accounts
+   - All features we need for testing
+
+### 2. Configure Upload Preset
+
+In your Cloudinary dashboard:
+
+1. Go to **Settings** → **Upload** → **Upload Presets**
+2. Click **Add upload preset**
+3. Configure with these EXACT settings:
+   - **Preset name**: `selfie`
+   - **Signing Mode**: **Unsigned**
+   - **Folder**: Leave empty (we set in code)
+   - **Access control**: Leave as is
+
+4. Under **Upload Manipulations** → **Incoming Transformation**:
+   - Edit → Add transformation
+   - Enter: `c_fill,g_face,ar_3:4,w_1500,h_2000,q_auto`
+   - This auto-detects faces and creates consistent 3:4 portraits
+
+5. Under **Upload Control** → **Moderation**:
+   - Set to **Manual**
+   - This makes photos appear in the Moderation tab for review
+
+6. Save the preset
+
+### 3. Get Your Credentials
+
+From your Cloudinary dashboard homepage, you'll see:
+
+- **Cloud Name**: (e.g., `dyjlw1syg`)
+- **API Key**: (e.g., `123456789012345`)
+- **API Secret**: (keep this private!)
+
+### 4. Environment Variables
+
+Add to your `.env` file:
+
+```bash
+# Selfie Campaign - Cloudinary settings
+PUBLIC_CLOUDINARY_CLOUD_NAME="your-cloud-name"  # Can be shared
+CLOUDINARY_API_KEY="your-api-key"               # Can be shared
+CLOUDINARY_API_SECRET="your-api-secret"         # KEEP PRIVATE - never commit!
+```
+
+**Important**:
+
+- `API_SECRET` must NEVER be committed to source control
+- `CLOUD_NAME` and `API_KEY` are safe to share
+- For production, all three will be set in Netlify environment variables
+
+### 5. Optional: Create Second Preset for Blurred Images
+
+If you want blur to create a permanent blurred version (not just display blur):
+
+1. Create another preset called `selfie_masked`
+2. Same settings as above, but incoming transformation:
+   - `c_fill,g_face,ar_3:4,w_1500,h_2000,q_auto/e_blur_faces:2000`
+
+## Testing the Feature
+
+1. Run development server: `pnpm dev`
+2. Visit: http://localhost:5173/selfie
+3. Upload a photo (camera, file, or social media)
+4. Test the flow:
+   - Photo should auto-crop to face
+   - Blur button should work (requires API credentials)
+   - Remove button should delete from Cloudinary
+   - Email submission should add to metadata
+
+## How It Works
+
+### Upload Flow:
+
+1. **Client**: Unsigned upload via widget → Cloudinary
+2. **Cloudinary**: Applies face detection & crop
+3. **Client**: Shows confirmation screen
+4. **User** can:
+   - Blur face (server endpoint replaces image)
+   - Add email (server endpoint updates metadata)
+   - Remove (server endpoint deletes from Cloudinary)
+
+### File Organization in Cloudinary:
+
+```
+test_prototype/    # Test phase uploads (all in one folder)
+```
+
+### Moderation Status (Automatic):
+
+Photos uploaded with `moderation: 'manual'` automatically get:
+
+- `pending` status - Shows in Moderation tab for review
+- Can be changed to `approved` or `rejected` via Cloudinary UI
+
+### Tags Applied:
+
+- `test_prototype` - Development/testing phase
+- `selfie` - Identifies as selfie upload
+- `has_email` - User provided email (added if email provided)
+- `face_masked` - User requested blur
+
+### Metadata Stored:
+
+- `uploaded_at` - Timestamp
+- `email` - If provided by user
+- Plus EXIF data (camera, location if present)
+
+## Review Process
+
+1. Log into Cloudinary Console
+2. Go to **Media Library → Moderation** tab
+3. Photos appear automatically with "pending" status
+4. Review and click to approve or reject each photo
+5. Approved photos remain in the library
+6. Rejected photos can be deleted or kept separate
+
+## Troubleshooting
+
+**"Server configuration error"**:
+
+- Check your API credentials in `.env`
+- Ensure `CLOUDINARY_API_SECRET` is set
+
+**Face detection not working**:
+
+- Check upload preset has the incoming transformation
+- Some angles/lighting may challenge detection
+
+**Blur not applying**:
+
+- Requires valid API credentials
+- Check server console for errors
+
+## Production Notes
+
+For production deployment:
+
+- Cloudinary nonprofit discount available (typically 25-50% off)
+- Set environment variables in Netlify dashboard
+- Consider webhook integration for automated approval workflow
+- Email service integration for notifications
+
+## Privacy & GDPR
+
+- Emails stored in Cloudinary metadata (not publicly accessible)
+- Users can request removal via the interface
+- Face blur option provided for privacy
+- Consider adding privacy policy link

eslint.config.js

@@ -1,16 +1,16 @@
 /* https://sveltejs.github.io/eslint-plugin-svelte/user-guide/ */
 import js from '@eslint/js'
+import markdown from '@eslint/markdown'
 import prettier from 'eslint-config-prettier'
 import svelte from 'eslint-plugin-svelte'
-import { globalIgnores } from 'eslint/config'
+import { defineConfig, globalIgnores } from 'eslint/config'
 import globals from 'globals'
 import ts from 'typescript-eslint'
 import svelteConfig from './svelte.config.js'
 
-export default ts.config(
+export default defineConfig(
 	js.configs.recommended,
 	...ts.configs.recommended,
-	...svelte.configs.recommended,
 	prettier,
 	{
 		languageOptions: {
@@ -20,8 +20,20 @@ export default ts.config(
 			}
 		}
 	},
+	{
+		files: ['**/*.md'],
+		extends: [markdown.configs.recommended],
+		rules: {
+			'markdown/fenced-code-language': 'off',
+			'markdown/no-missing-atx-heading-space': 'off', // rule is broken
+			'markdown/no-missing-label-refs': 'off',
+			'markdown/require-alt-text': 'warn',
+			'no-irregular-whitespace': 'off' // not supported by markdown parser
+		}
+	},
 	{
 		files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],
+		extends: [svelte.configs.recommended],
 		// See more details at: https://typescript-eslint.io/packages/parser/
 		languageOptions: {
 			parserOptions: {
@@ -41,26 +53,47 @@ export default ts.config(
 				// explicitly specifying it ensures better compatibility and functionality.
 				svelteConfig
 			}
+		},
+		rules: {
+			// Override or add rule settings here, such as:
+			// 'svelte/rule-name': 'error'
+
+			// disabled
+			'svelte/no-navigation-without-resolve': 'off',
+			'svelte/require-each-key': 'off',
+
+			// enabled
+			'svelte/no-restricted-html-elements': [
+				'warn',
+				{
+					elements: ['a'],
+					message:
+						'Use $lib/components/Link.svelte or $lib/components/LinkWithoutIcon.svelte instead'
+				}
+			],
+			'no-restricted-imports': [
+				'error',
+				{
+					patterns: [
+						{
+							group: ['**/custom'],
+							message:
+								'This component serves as an adapter for mdsvex, import the corresponding component directly instead'
+						}
+					]
+				}
+			]
 		}
 	},
 	{
 		rules: {
-			// Override or add rule settings here, such as:
-			// 'svelte/rule-name': 'error'
+			// configured
 			'@typescript-eslint/no-unused-vars': [
 				'error',
 				{
 					argsIgnorePattern: '^_',
 					destructuredArrayIgnorePattern: '^_'
 				}
-			],
-			'svelte/require-each-key': 'off',
-			'svelte/no-restricted-html-elements': [
-				'warn',
-				{
-					elements: ['a'],
-					message: 'Use $lib/components/custom/a.svelte instead'
-				}
 			]
 		}
 	},

messages/en.json

@@ -23,14 +23,17 @@
 	"home_quotes_all": "See all quotes",
 	"home_quotes_bengio_text": "Rogue AI may be dangerous for the whole of humanity. Banning powerful AI systems (say beyond the abilities of GPT-4) that are given autonomy and agency would be a good start.",
 	"home_quotes_bengio_title": "AI Turing Award winner",
+	"home_quotes_asi_statement_text": "We call for a prohibition on the development of superintelligence, not lifted before there is broad scientific consensus that it will be done safely and controllably, and strong public buy-in",
+	"home_quotes_asi_statement_author": "Statement on Superintelligence",
+	"home_quotes_asi_statement_title": "110,000+ signatories including AI researchers, political, faith and industry leaders, artists and media celebrities",
 	"home_quotes_cais_text": "Mitigating the risk of extinction from AI should be a global priority alongside other societal-scale risks such as pandemics and nuclear war.",
 	"home_quotes_cais_author": "Statement on AI Risk",
 	"home_quotes_cais_title": "Signed by hundreds of experts, including the top AI labs and scientists",
 	"home_quotes_hawking_text": "The development of full artificial intelligence could spell the end of the human race.",
 	"home_quotes_hawking_title": "Theoretical physicist and cosmologist",
 	"home_quotes_hinton_text": "If you take the existential risk seriously, as I now do, it might be quite sensible to just stop developing these things any further.",
 	"home_quotes_hinton_title": "Nobel Prize winner & \"Godfather of AI\"",
-	"home_quotes_russell_text": "If we pursue [our current approach], then we will eventually lose control over the machines",
+	"home_quotes_russell_text": "If we pursue [our current approach], then we will eventually lose control over the machines.",
 	"home_quotes_russell_title": "Writer of the AI textbook",
 	"home_quotes_turing_text": "... we should have to expect the machines to take control.",
 	"home_quotes_turing_title": "Inventor of the modern computer",
@@ -88,13 +91,9 @@
 	"footer_other_l10n": "Suggest translation improvement",
 	"newsletter_heading": "Subscribe to our newsletter",
 	"newsletter_description": "Stay updated on our efforts to advocate for AI safety.",
-	"newsletter_disclaimer": "Our newsletter is completely free. No paid subscription necessary. You can close Substack once signed up.",
 	"newsletter_email_placeholder": "Your email",
 	"newsletter_button": "Subscribe",
-	"newsletter_success": "Thank you for subscribing!",
-	"newsletter_error_default": "Failed to subscribe. Please try again.",
-	"newsletter_error_network": "Network error. Please try again later.",
-	"newsletter_loading": "Loading...",
+	"newsletter_success": "Done. Expect email from Substack.",
 	"uk_email_mp_title": "Email Your MP",
 	"uk_email_mp_description": "Contact your Member of Parliament about AI safety",
 	"uk_email_mp_uk_only_notice": "<b>This tool is for the UK only.</b> For other countries, use the [global email builder](/email-builder).",