commit for the purpose of working on another machine

webapp/src/router/index.ts

@@ -103,6 +103,14 @@ const router = createRouter({
         title: 'Contact | DeFlock'
       }
     },
+    {
+      path: '/ai-email-classification',
+      name: 'ai-email-classification',
+      component: () => import('../views/AiEmailClassificationView.vue'),
+      meta: {
+        title: 'AI Email Classification | DeFlock'
+      }
+    },
     {
       path: '/terms',
       name: 'terms',

webapp/src/services/apiService.ts

@@ -95,6 +95,7 @@ export interface ContactMessagePayload {
   subject: string;
   message: string;
   turnstileToken: string;
+  aiScreeningOptOut: boolean;
 }
 
 export const postContactMessage = async (payload: ContactMessagePayload) => {

webapp/src/views/AiEmailClassificationView.vue

@@ -0,0 +1,45 @@
+<template>
+  <DefaultLayout>
+    <v-container class="narrow-text">
+      <h1>AI Email Classification</h1>
+      
+      <p>
+        We get a lot of emails, too many for our volunteers to respond to. To keep up with demand during this period of increased public interest, we've implemented AI classification of emails.
+      </p>
+
+      <p class="font-weight-bold">
+        Responses will still be from a human.
+      </p>
+
+      <h4>What it Does</h4>
+      <ul>
+          <li>Classifies the email into one of several categories</li>
+          <li>Filters out spam</li>
+          <li>Summarizes the email</li>
+          <li>Suggests a response for common questions</li>
+      </ul>
+
+      <h4>What is Sent</h4>
+      <ul>
+        <li>Message body</li>
+        <li>Message subject</li>
+        <li>Domain name of the email address (e.g. gmail.com)</li>
+      </ul>
+
+      <h3>How to Opt Out</h3>
+
+      <p>
+        The classification code is only run on form submissions. If you'd like to opt out, simply email us at <a href="mailto:contact@deflock.org">contact@deflock.org</a>, and it will not be processed by AI.
+      </p>
+
+      <h3>More Info</h3>
+      <p>
+        We're an open-source project. If you'd like to see how our classification system works, check out our <a target="_blank" href="https://github.com/FoggedLens/deflock">GitHub</a>.
+      </p>
+    </v-container>
+  </DefaultLayout>
+</template>
+
+<script setup lang="ts">
+import DefaultLayout from '@/layouts/DefaultLayout.vue';
+</script>

webapp/src/views/ContactView.vue

@@ -36,6 +36,17 @@
             <a href="mailto:contact@deflock.org" class="text-decoration-none font-weight-bold">contact@deflock.org</a>.
           </v-alert>
 
+          <v-alert
+            type="info"
+            variant="tonal"
+            class="mb-6"
+            icon="mdi-robot-outline"
+          >
+            We use AI to classify messages sent through this form, but you can
+            <router-link to="/ai-email-classification">opt out</router-link>.
+            Do not include PII in this form.
+          </v-alert>
+
           <v-form ref="form" @submit.prevent="handleSubmit">
             <v-row>
               <v-col cols="12" sm="6">
@@ -97,6 +108,19 @@
                   auto-grow
                 ></v-textarea>
               </v-col>
+              <v-col cols="12">
+                <v-checkbox
+                  v-model="aiScreeningOptOut"
+                  density="comfortable"
+                  hide-details
+                  label="Don't use AI to help triage my message"
+                ></v-checkbox>
+                <p class="text-caption text-medium-emphasis">
+                  By default, an AI assistant helps our team sort incoming messages and draft replies to
+                  common questions. A human always reviews everything before you hear back — nothing is
+                  ever sent automatically. You can opt out above.
+                </p>
+              </v-col>
               <v-col cols="12">
                 <VueTurnstile
                   ref="turnstileRef"
@@ -189,6 +213,7 @@ const form = ref<{ validate: () => Promise<{ valid: boolean }>; resetValidation:
 const turnstileRef = ref<InstanceType<typeof VueTurnstile> | null>(null);
 const turnstileToken = ref('');
 const turnstileError = ref(false);
+const aiScreeningOptOut = ref(false);
 
 const isSubmitting = ref(false);
 const isSuccess = ref(false);
@@ -230,6 +255,7 @@ const handleSubmit = async () => {
       subject: fields.subject,
       message: fields.message,
       turnstileToken: turnstileToken.value,
+      aiScreeningOptOut: aiScreeningOptOut.value,
     });
 
     isSuccess.value = true;
@@ -240,6 +266,7 @@ const handleSubmit = async () => {
     fields.topic = null;
     fields.subject = '';
     fields.message = '';
+    aiScreeningOptOut.value = false;
     await nextTick();
     form.value!.resetValidation();
     resetTurnstile();