@respectify/astro 0.1.0

package/components/respectify-comments.css

@@ -0,0 +1,373 @@
+/* Respectify Comments — drop-in styles. Override via CSS variables on .rf-comments. */
+.rf-comments {
+  --rf-accent: #2563eb;
+  --rf-accent-hover: #1d4ed8;
+  --rf-accent-soft: rgba(37, 99, 235, 0.08);
+  --rf-border: #d1d5db;
+  --rf-bg: #f9fafb;
+  --rf-bg-card: #ffffff;
+  --rf-text: #111827;
+  --rf-text-muted: #6b7280;
+  --rf-success-bg: #ecfdf5;
+  --rf-success-text: #065f46;
+  --rf-success-border: #6ee7b7;
+  --rf-warning-bg: #fffbeb;
+  --rf-warning-text: #92400e;
+  --rf-warning-border: #fcd34d;
+  --rf-error-bg: #fef2f2;
+  --rf-error-text: #991b1b;
+  --rf-error-border: #fca5a5;
+  --rf-radius: 0.5rem;
+  --rf-font: inherit;
+  font-family: var(--rf-font);
+  color: var(--rf-text);
+}
+
+@media (prefers-color-scheme: dark) {
+  .rf-comments {
+    --rf-border: #374151;
+    --rf-bg: #111827;
+    --rf-bg-card: #1f2937;
+    --rf-text: #f9fafb;
+    --rf-text-muted: #9ca3af;
+    --rf-accent-soft: rgba(37, 99, 235, 0.15);
+    --rf-success-bg: #064e3b;
+    --rf-success-text: #d1fae5;
+    --rf-success-border: #059669;
+    --rf-warning-bg: #78350f;
+    --rf-warning-text: #fef3c7;
+    --rf-warning-border: #d97706;
+    --rf-error-bg: #7f1d1d;
+    --rf-error-text: #fecaca;
+    --rf-error-border: #dc2626;
+  }
+}
+
+.rf-comments *,
+.rf-comments *::before,
+.rf-comments *::after {
+  box-sizing: border-box;
+}
+
+.rf-comments__section {
+  margin-top: 2rem;
+}
+
+.rf-comments__heading {
+  font-size: 1.5rem;
+  font-weight: 700;
+  margin: 0 0 1.5rem;
+}
+
+.rf-comments__loading,
+.rf-comments__empty {
+  color: var(--rf-text-muted);
+  font-style: italic;
+}
+
+.rf-comments__list {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.rf-comments__item {
+  padding: 1rem;
+  border: 1px solid var(--rf-border);
+  border-radius: var(--rf-radius);
+  background: var(--rf-bg-card);
+}
+
+.rf-comments__item-header {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 1rem;
+  margin-bottom: 0.5rem;
+}
+
+.rf-comments__author {
+  font-weight: 600;
+  font-size: 1.125rem;
+}
+
+.rf-comments__date {
+  font-size: 0.875rem;
+  color: var(--rf-text-muted);
+  white-space: nowrap;
+}
+
+.rf-comments__content {
+  white-space: pre-wrap;
+  line-height: 1.6;
+}
+
+.rf-comments__form-panel {
+  margin-top: 2rem;
+  padding: 1.5rem;
+  border: 1px solid var(--rf-border);
+  border-radius: var(--rf-radius);
+  background: var(--rf-bg);
+}
+
+.rf-comments__form-title {
+  font-size: 1.5rem;
+  font-weight: 700;
+  margin: 0 0 0.25rem;
+}
+
+.rf-comments__form-note {
+  margin: 0 0 1rem;
+  font-size: 0.875rem;
+  color: var(--rf-text-muted);
+}
+
+.rf-comments__form-note a {
+  color: var(--rf-accent);
+  font-weight: 500;
+  text-decoration: underline;
+}
+
+.rf-comments__field {
+  margin-bottom: 1rem;
+}
+
+.rf-comments__label {
+  display: block;
+  font-size: 0.875rem;
+  font-weight: 500;
+  margin-bottom: 0.25rem;
+}
+
+.rf-comments__required {
+  color: #ef4444;
+}
+
+.rf-comments__input,
+.rf-comments__textarea {
+  width: 100%;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--rf-border);
+  border-radius: var(--rf-radius);
+  background: var(--rf-bg-card);
+  color: var(--rf-text);
+  font: inherit;
+}
+
+.rf-comments__input:focus,
+.rf-comments__textarea:focus {
+  outline: 2px solid var(--rf-accent);
+  outline-offset: 1px;
+}
+
+.rf-comments__textarea {
+  min-height: 8rem;
+  resize: vertical;
+}
+
+.rf-comments__submit {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.5rem 1.5rem;
+  border: none;
+  border-radius: var(--rf-radius);
+  background: var(--rf-accent);
+  color: #fff;
+  font: inherit;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background 0.15s ease;
+}
+
+.rf-comments__submit:hover:not(:disabled) {
+  background: var(--rf-accent-hover);
+}
+
+.rf-comments__submit:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.rf-comments__submit--analyzing {
+  animation: rf-pulse 2s ease-in-out infinite;
+}
+
+@keyframes rf-pulse {
+  0%,
+  100% {
+    box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.4);
+  }
+  50% {
+    box-shadow: 0 0 0 8px rgba(37, 99, 235, 0);
+  }
+}
+
+.rf-comments__spinner {
+  display: none;
+  width: 1.25rem;
+  height: 1.25rem;
+  animation: rf-spin 1s linear infinite;
+}
+
+.rf-comments__submit--analyzing .rf-comments__spinner {
+  display: inline-block;
+}
+
+@keyframes rf-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.rf-comments__message {
+  margin-top: 1rem;
+  padding: 1rem;
+  border-radius: var(--rf-radius);
+  border: 2px solid transparent;
+}
+
+.rf-comments__message--success {
+  background: var(--rf-success-bg);
+  color: var(--rf-success-text);
+  border-color: var(--rf-success-border);
+}
+
+.rf-comments__message--warning {
+  background: var(--rf-warning-bg);
+  color: var(--rf-warning-text);
+  border-color: var(--rf-warning-border);
+}
+
+.rf-comments__message--error {
+  background: var(--rf-error-bg);
+  color: var(--rf-error-text);
+  border-color: var(--rf-error-border);
+}
+
+.rf-comments__suggestion {
+  margin-top: 0.75rem;
+  padding: 0.75rem;
+  border: 1px solid var(--rf-border);
+  border-radius: var(--rf-radius);
+  background: var(--rf-accent-soft);
+}
+
+.rf-comments__brand {
+  margin-bottom: 1.5rem;
+  padding: 0.75rem 1rem;
+  border: 1px solid color-mix(in srgb, var(--rf-accent) 30%, transparent);
+  border-radius: var(--rf-radius);
+  background: var(--rf-accent-soft);
+}
+
+.rf-comments__brand-inner {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 0.75rem;
+}
+
+.rf-comments__brand-title {
+  margin: 0;
+  font-size: 0.875rem;
+  font-weight: 600;
+}
+
+.rf-comments__brand-title a {
+  color: var(--rf-accent);
+  text-decoration: none;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+}
+
+.rf-comments__brand-title a:hover {
+  text-decoration: underline;
+}
+
+.rf-comments__brand-desc {
+  margin: 0.25rem 0 0;
+  font-size: 0.875rem;
+  color: var(--rf-text-muted);
+}
+
+.rf-comments__brand-cta {
+  flex-shrink: 0;
+  padding: 0.375rem 0.75rem;
+  border: 1px solid color-mix(in srgb, var(--rf-accent) 40%, transparent);
+  border-radius: var(--rf-radius);
+  color: var(--rf-accent);
+  font-size: 0.75rem;
+  font-weight: 500;
+  text-decoration: none;
+  white-space: nowrap;
+}
+
+.rf-comments__brand-cta:hover {
+  background: var(--rf-accent-soft);
+}
+
+.rf-comments__brand-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+  margin-top: 1rem;
+  font-size: 0.75rem;
+  color: var(--rf-text-muted);
+  text-decoration: none;
+}
+
+.rf-comments__brand-badge:hover {
+  color: var(--rf-accent);
+}
+
+.rf-comments__hidden {
+  display: none !important;
+}
+
+.rf-comments__delete-controls {
+  display: none;
+  align-items: center;
+  gap: 0.25rem;
+}
+
+.rf-comments__delete-controls--visible {
+  display: inline-flex;
+}
+
+.rf-comments__delete-btn {
+  padding: 0.125rem 0.5rem;
+  border: none;
+  border-radius: 0.25rem;
+  background: #dc2626;
+  color: #fff;
+  font-size: 0.75rem;
+  cursor: pointer;
+}
+
+.rf-comments__delete-btn:hover {
+  background: #b91c1c;
+}
+
+.rf-comments__delete-confirm {
+  display: none;
+  align-items: center;
+  gap: 0.25rem;
+  font-size: 0.75rem;
+}
+
+.rf-comments__delete-confirm--visible {
+  display: inline-flex;
+}
+
+.rf-comments__delete-cancel {
+  padding: 0.125rem 0.5rem;
+  border: none;
+  border-radius: 0.25rem;
+  background: var(--rf-border);
+  color: var(--rf-text);
+  font-size: 0.75rem;
+  cursor: pointer;
+}

package/default-respectify.config.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "./respectify.schema.json",
+  "enabled": true,
+  "moderation": {
+    "blockDisrespectful": true,
+    "showFeedbackToUser": true,
+    "allowOverride": false
+  },
+  "thresholds": {
+    "autoApprove": 0.7,
+    "warn": 0.5,
+    "block": 0.3
+  },
+  "feedback": {
+    "approved": "Thank you for your respectful comment!",
+    "warning": "Your comment may contain disrespectful language. Please consider revising it.",
+    "blocked": "Your comment does not meet our respectfulness standards. Please revise and try again."
+  }
+}

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@respectify/astro",
+  "version": "0.1.0",
+  "description": "Respectify-powered commenting for Astro — AI moderation, spam filtering, and beautiful UX out of the box.",
+  "type": "module",
+  "license": "MIT",
+  "author": "Respectify",
+  "homepage": "https://respectify.ai",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/NickHodges/Nick-Blog.git",
+    "directory": "packages/astro-respectify"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "astro",
+    "astro-integration",
+    "comments",
+    "respectify",
+    "moderation",
+    "ai"
+  ],
+  "exports": {
+    ".": "./src/index.ts",
+    "./actions": "./src/actions.ts",
+    "./schema": "./src/schema.ts",
+    "./routes/comments": "./src/routes/comments.ts",
+    "./components/CommentSection.astro": "./components/CommentSection.astro",
+    "./components/PoweredByRespectify.astro": "./components/PoweredByRespectify.astro",
+    "./client": "./client/comments.ts",
+    "./styles.css": "./components/respectify-comments.css"
+  },
+  "files": [
+    "src",
+    "components",
+    "client",
+    "default-respectify.config.json",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "@astrojs/db": "^0.20.0",
+    "@respectify/client": "^0.2.3",
+    "astro": "^5.0.0 || ^6.0.0",
+    "zod": "^3.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@astrojs/db": {
+      "optional": false
+    }
+  },
+  "dependencies": {
+    "zod": "^3.24.0"
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "@astrojs/db": "^0.20.0",
+    "@respectify/client": "^0.2.3",
+    "astro": "^6.0.4",
+    "typescript": "^5.4.3"
+  }
+}

package/src/actions.ts

@@ -0,0 +1,77 @@
+import { defineAction, ActionError } from 'astro:actions';
+import { z } from 'astro/zod';
+import { db, Comment, eq } from 'astro:db';
+import { analyzeComment } from './lib/service';
+
+/**
+ * Merge into your src/actions/index.ts:
+ *
+ * ```ts
+ * import { respectifyCommentActions } from '@respectify/astro/actions';
+ *
+ * export const server = {
+ *   comments: respectifyCommentActions,
+ *   // ...your other actions
+ * };
+ * ```
+ */
+export const respectifyCommentActions = {
+  submit: defineAction({
+    accept: 'json',
+    input: z.object({
+      postSlug: z.string().min(1),
+      author: z.string().min(1).max(100),
+      email: z.string().email().optional(),
+      content: z.string().min(1).max(5000),
+      parentId: z.number().optional(),
+    }),
+    handler: async ({ postSlug, author, email, content, parentId }) => {
+      const analysis = await analyzeComment(content, postSlug);
+
+      if (!analysis.approved) {
+        return {
+          success: false as const,
+          approved: false as const,
+          feedback: analysis.feedback,
+          suggestion: analysis.suggestion,
+          score: analysis.score,
+        };
+      }
+
+      await db.insert(Comment).values({
+        postSlug,
+        author,
+        email,
+        content,
+        parentId,
+        approved: true,
+      });
+
+      return {
+        success: true as const,
+        approved: true as const,
+        feedback: analysis.feedback,
+        score: analysis.score,
+        message: 'Comment published successfully!',
+      };
+    },
+  }),
+
+  delete: defineAction({
+    accept: 'json',
+    input: z.object({
+      commentId: z.number(),
+    }),
+    handler: async ({ commentId }, context) => {
+      if (!context.locals.isAuthenticated) {
+        throw new ActionError({
+          code: 'UNAUTHORIZED',
+          message: 'You must be logged in to delete comments',
+        });
+      }
+
+      await db.delete(Comment).where(eq(Comment.id, commentId));
+      return { success: true as const };
+    },
+  }),
+};

package/src/index.ts

@@ -0,0 +1,34 @@
+import type { AstroIntegration } from 'astro';
+import { envField } from 'astro/config';
+import { setIntegrationOptions } from './runtime-config';
+import type { RespectifyIntegrationOptions } from './types';
+
+export default function respectify(userOptions: RespectifyIntegrationOptions = {}): AstroIntegration {
+  setIntegrationOptions(userOptions);
+
+  const commentsApiPath = userOptions.commentsApiPath ?? '/api/respectify/comments';
+  const routePattern = commentsApiPath.replace(/^\//, '');
+
+  return {
+    name: '@respectify/astro',
+    hooks: {
+      'astro:config:setup': ({ injectRoute, updateConfig }) => {
+        updateConfig({
+          env: {
+            schema: {
+              RESPECTIFY_EMAIL: envField.string({ context: 'server', access: 'secret' }),
+              RESPECTIFY_API_KEY: envField.string({ context: 'server', access: 'secret' }),
+            },
+          },
+        });
+
+        injectRoute({
+          pattern: routePattern,
+          entrypoint: '@respectify/astro/routes/comments',
+        });
+      },
+    },
+  };
+}
+
+export type { RespectifyIntegrationOptions, RespectifyAnalysisResult } from './types';

package/src/lib/config.ts

@@ -0,0 +1,76 @@
+import { z } from 'zod';
+import fs from 'node:fs';
+import path from 'node:path';
+import { getIntegrationOptions } from '../runtime-config';
+
+const RespectifyConfigSchema = z.object({
+  enabled: z.boolean(),
+  apiEndpoint: z.string().url().optional(),
+  requiresAuth: z.boolean().optional(),
+  autoPublish: z
+    .object({
+      enabled: z.boolean(),
+      minimumScore: z.number().min(0).max(1),
+    })
+    .optional(),
+  moderation: z.object({
+    blockDisrespectful: z.boolean(),
+    showFeedbackToUser: z.boolean().optional(),
+    allowOverride: z.boolean(),
+  }),
+  thresholds: z.object({
+    autoApprove: z.number().min(0).max(1),
+    warn: z.number().min(0).max(1),
+    block: z.number().min(0).max(1),
+  }),
+  feedback: z.object({
+    approved: z.string(),
+    warning: z.string(),
+    blocked: z.string(),
+  }),
+});
+
+export type RespectifyConfig = z.infer<typeof RespectifyConfigSchema>;
+
+let cachedConfig: RespectifyConfig | null = null;
+
+export function loadRespectifyConfig(): RespectifyConfig {
+  const isDevelopment = import.meta.env.DEV;
+
+  if (cachedConfig && !isDevelopment) {
+    return cachedConfig;
+  }
+
+  const { configPath } = getIntegrationOptions();
+  const resolvedPath = path.isAbsolute(configPath) ? configPath : path.join(process.cwd(), configPath);
+
+  try {
+    const configFile = fs.readFileSync(resolvedPath, 'utf-8');
+    const config = JSON.parse(configFile) as unknown;
+    cachedConfig = RespectifyConfigSchema.parse(config);
+    return cachedConfig;
+  } catch (error) {
+    throw new Error(`Failed to load Respectify config from ${resolvedPath}: ${error}`);
+  }
+}
+
+export function getDefaultConfig(): RespectifyConfig {
+  return {
+    enabled: true,
+    moderation: {
+      blockDisrespectful: true,
+      showFeedbackToUser: true,
+      allowOverride: false,
+    },
+    thresholds: {
+      autoApprove: 0.7,
+      warn: 0.5,
+      block: 0.3,
+    },
+    feedback: {
+      approved: 'Thank you for your respectful comment!',
+      warning: 'Your comment may contain disrespectful language. Please consider revising it.',
+      blocked: 'Your comment does not meet our respectfulness standards. Please revise and try again.',
+    },
+  };
+}

package/src/lib/logger.ts

@@ -0,0 +1,20 @@
+type LogLevel = 'debug' | 'info' | 'warn' | 'error';
+
+function log(level: LogLevel, message: string, data?: Record<string, unknown>): void {
+  if (level === 'debug' && !import.meta.env.DEV) return;
+  if (level === 'warn' && !import.meta.env.DEV) return;
+
+  const prefix = `[respectify:${level}]`;
+  if (data) {
+    console[level === 'debug' ? 'log' : level](prefix, message, data);
+  } else {
+    console[level === 'debug' ? 'log' : level](prefix, message);
+  }
+}
+
+export const logger = {
+  debug: (message: string, data?: Record<string, unknown>) => log('debug', message, data),
+  info: (message: string, data?: Record<string, unknown>) => log('info', message, data),
+  warn: (message: string, data?: Record<string, unknown>) => log('warn', message, data),
+  error: (message: string, data?: Record<string, unknown>) => log('error', message, data),
+};