@wix/ditto-codegen-public 1.0.20 → 1.0.21

package/dist/examples-apps/survey-manager/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "wix-astro-blank",
+  "type": "module",
+  "version": "0.0.1",
+  "scripts": {
+    "astro": "astro",
+    "dev": "wix dev",
+    "build": "wix build",
+    "wix": "wix",
+    "preview": "wix preview",
+    "release": "wix release",
+    "generate": "wix generate",
+    "env": "wix env"
+  },
+  "dependencies": {
+    "@wix/astro": "^2.2.0",
+    "@wix/ecom": "^1.0.1392",
+    "@wix/data": "^1.0.291",
+    "@wix/design-system": "^1.219.0",
+    "@wix/wix-ui-icons-common": "^3.92.0",
+    "@wix/dashboard": "^1.3.36",
+    "@wix/essentials": "^0.1.23",
+    "@wix/sdk": "^1.15.23",
+    "astro": "^5.8.0",
+    "typescript": "^5.8.3"
+  },
+  "devDependencies": {
+    "@astrojs/cloudflare": "^12.5.3",
+    "@astrojs/react": "^4.3.0",
+    "@types/react": "^18.3.1",
+    "@types/react-dom": "^18.3.1",
+    "@wix/cli": "^1.1.92",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  }
+}

package/dist/examples-apps/survey-manager/src/dashboard/pages/page.tsx

@@ -0,0 +1,551 @@
+import React, { useState, useEffect, type FC } from 'react';
+import { dashboard } from '@wix/dashboard';
+import { items } from '@wix/data';
+import {
+  Button,
+  Page,
+  WixDesignSystemProvider,
+  Table,
+  TableActionCell,
+  TableToolbar,
+  Modal,
+  CustomModalLayout,
+  FormField,
+  Input,
+  ToggleSwitch,
+  Layout,
+  Cell,
+  Badge,
+  Box,
+  Text,
+  EmptyState,
+  Loader,
+  Card,
+  Heading,
+} from '@wix/design-system';
+import '@wix/design-system/styles.global.css';
+import * as Icons from '@wix/wix-ui-icons-common';
+
+export type WixDataItem = items.WixDataItem;
+
+// Type definitions based on the CMS collections
+interface SurveyQuestion extends WixDataItem {
+  questionText: string;
+  maxRating: number;
+  isActive: boolean;
+}
+
+interface SurveyResponse extends WixDataItem {
+  questionId: string;
+  rating: number;
+  submittedAt: Date;
+}
+
+interface QuestionStats {
+  totalResponses: number;
+  averageRating: number;
+  ratingDistribution: { [rating: number]: number };
+}
+
+/**
+ * Creates a new survey question
+ */
+async function createQuestion(questionData: Omit<SurveyQuestion, '_id' | '_createdDate' | '_updatedDate' | '_owner'>): Promise<SurveyQuestion> {
+  try {
+    const result = await items.insert('survey-questions', questionData);
+    return result as SurveyQuestion;
+  } catch (error) {
+    console.error('Error creating survey question:', error);
+    throw new Error(
+      error instanceof Error ? error.message : 'Failed to create survey question'
+    );
+  }
+}
+
+/**
+ * Retrieves all survey questions
+ */
+async function getAllQuestions(): Promise<items.WixDataResult<SurveyQuestion>> {
+  try {
+    const result = await items.query('survey-questions')
+      .descending('_createdDate')
+      .find();
+    return result as items.WixDataResult<SurveyQuestion>;
+  } catch (error) {
+    console.error('Error fetching survey questions:', error);
+    throw new Error(
+      error instanceof Error ? error.message : 'Failed to fetch survey questions'
+    );
+  }
+}
+
+/**
+ * Updates an existing survey question
+ */
+async function updateQuestion(questionData: SurveyQuestion): Promise<SurveyQuestion> {
+  try {
+    if (!questionData._id) {
+      throw new Error('Question ID is required for update');
+    }
+    const result = await items.update('survey-questions', questionData);
+    return result as SurveyQuestion;
+  } catch (error) {
+    console.error('Error updating survey question:', error);
+    throw new Error(
+      error instanceof Error ? error.message : 'Failed to update survey question'
+    );
+  }
+}
+
+/**
+ * Deletes a survey question by ID
+ */
+async function deleteQuestion(questionId: string): Promise<SurveyQuestion> {
+  try {
+    if (!questionId) {
+      throw new Error('Question ID is required for deletion');
+    }
+    const result = await items.remove('survey-questions', questionId);
+    return result as SurveyQuestion;
+  } catch (error) {
+    console.error('Error deleting survey question:', error);
+    throw new Error(
+      error instanceof Error ? error.message : 'Failed to delete survey question'
+    );
+  }
+}
+
+/**
+ * Gets statistics for a specific question
+ */
+async function getQuestionStats(questionId: string): Promise<QuestionStats> {
+  try {
+    const responses = await items.query('survey-responses')
+      .eq('questionId', questionId)
+      .find();
+    
+    const responseItems = responses.items as SurveyResponse[];
+    const totalResponses = responseItems.length;
+    
+    if (totalResponses === 0) {
+      return {
+        totalResponses: 0,
+        averageRating: 0,
+        ratingDistribution: {}
+      };
+    }
+    
+    const ratings = responseItems.map(r => r.rating);
+    const averageRating = ratings.reduce((sum, rating) => sum + rating, 0) / totalResponses;
+    
+    const ratingDistribution: { [rating: number]: number } = {};
+    ratings.forEach(rating => {
+      ratingDistribution[rating] = (ratingDistribution[rating] || 0) + 1;
+    });
+    
+    return {
+      totalResponses,
+      averageRating: Math.round(averageRating * 100) / 100,
+      ratingDistribution
+    };
+  } catch (error) {
+    console.error('Error fetching question stats:', error);
+    return {
+      totalResponses: 0,
+      averageRating: 0,
+      ratingDistribution: {}
+    };
+  }
+}
+
+const SurveyManager: FC = () => {
+  const [questions, setQuestions] = useState<SurveyQuestion[]>([]);
+  const [questionStats, setQuestionStats] = useState<{ [questionId: string]: QuestionStats }>({});
+  const [loading, setLoading] = useState(true);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [editingQuestion, setEditingQuestion] = useState<SurveyQuestion | null>(null);
+  const [formData, setFormData] = useState({
+    questionText: '',
+    maxRating: 5,
+    isActive: true
+  });
+
+  // Load questions and their stats
+  const loadQuestions = async () => {
+    try {
+      setLoading(true);
+      const result = await getAllQuestions();
+      setQuestions(result.items);
+      
+      // Load stats for each question
+      const stats: { [questionId: string]: QuestionStats } = {};
+      for (const question of result.items) {
+        if (question._id) {
+          stats[question._id] = await getQuestionStats(question._id);
+        }
+      }
+      setQuestionStats(stats);
+    } catch (error) {
+      dashboard.showToast({
+        message: 'Failed to load survey questions',
+        type: 'error'
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    loadQuestions();
+  }, []);
+
+  const openModal = (question?: SurveyQuestion) => {
+    setEditingQuestion(question || null);
+    
+    if (question) {
+      setFormData({
+        questionText: question.questionText,
+        maxRating: question.maxRating,
+        isActive: question.isActive
+      });
+    } else {
+      setFormData({
+        questionText: '',
+        maxRating: 5,
+        isActive: true
+      });
+    }
+    
+    setIsModalOpen(true);
+  };
+
+  const closeModal = () => {
+    setIsModalOpen(false);
+    setEditingQuestion(null);
+    setFormData({
+      questionText: '',
+      maxRating: 5,
+      isActive: true
+    });
+  };
+
+  const handleSave = async () => {
+    try {
+      if (!formData.questionText.trim()) {
+        dashboard.showToast({
+          message: 'Question text is required',
+          type: 'error'
+        });
+        return;
+      }
+
+      if (editingQuestion) {
+        // Update existing question
+        const updatedQuestion: SurveyQuestion = {
+          ...editingQuestion,
+          questionText: formData.questionText,
+          maxRating: formData.maxRating,
+          isActive: formData.isActive
+        };
+        await updateQuestion(updatedQuestion);
+        dashboard.showToast({
+          message: 'Question updated successfully',
+          type: 'success'
+        });
+      } else {
+        // Create new question
+        await createQuestion({
+          questionText: formData.questionText,
+          maxRating: formData.maxRating,
+          isActive: formData.isActive
+        });
+        dashboard.showToast({
+          message: 'Question created successfully',
+          type: 'success'
+        });
+      }
+      
+      closeModal();
+      loadQuestions();
+    } catch (error) {
+      dashboard.showToast({
+        message: editingQuestion ? 'Failed to update question' : 'Failed to create question',
+        type: 'error'
+      });
+    }
+  };
+
+  const handleDelete = async (questionId: string, questionText: string) => {
+    try {
+      await deleteQuestion(questionId);
+      dashboard.showToast({
+        message: `"${questionText}" deleted successfully`,
+        type: 'success'
+      });
+      loadQuestions();
+    } catch (error) {
+      dashboard.showToast({
+        message: 'Failed to delete question',
+        type: 'error'
+      });
+    }
+  };
+
+  const toggleQuestionStatus = async (question: SurveyQuestion) => {
+    try {
+      const updatedQuestion: SurveyQuestion = {
+        ...question,
+        isActive: !question.isActive
+      };
+      await updateQuestion(updatedQuestion);
+      dashboard.showToast({
+        message: `Question ${updatedQuestion.isActive ? 'activated' : 'deactivated'}`,
+        type: 'success'
+      });
+      loadQuestions();
+    } catch (error) {
+      dashboard.showToast({
+        message: 'Failed to update question status',
+        type: 'error'
+      });
+    }
+  };
+
+  const columns = [
+    {
+      title: 'Question',
+      render: (question: SurveyQuestion) => (
+        <Box direction="vertical" gap="3px">
+          <Text size="medium" weight="normal">
+            {question.questionText}
+          </Text>
+          <Box gap="6px">
+            <Badge 
+              skin={question.isActive ? 'success' : 'neutral'} 
+              size="small"
+            >
+              {question.isActive ? 'Active' : 'Inactive'}
+            </Badge>
+            <Text size="tiny" secondary>
+              Max Rating: {question.maxRating}
+            </Text>
+          </Box>
+        </Box>
+      ),
+      width: 'auto'
+    },
+    {
+      title: 'Responses',
+      render: (question: SurveyQuestion) => {
+        const stats = question._id ? questionStats[question._id] : null;
+        return (
+          <Box direction="vertical" gap="3px">
+            <Text size="medium" weight="bold">
+              {stats?.totalResponses || 0}
+            </Text>
+            <Text size="tiny" secondary>
+              Total responses
+            </Text>
+          </Box>
+        );
+      },
+      width: '120px'
+    },
+    {
+      title: 'Average Rating',
+      render: (question: SurveyQuestion) => {
+        const stats = question._id ? questionStats[question._id] : null;
+        return (
+          <Box direction="vertical" gap="3px">
+            <Text size="medium" weight="bold">
+              {stats?.averageRating || 0}
+            </Text>
+            <Text size="tiny" secondary>
+              out of {question.maxRating}
+            </Text>
+          </Box>
+        );
+      },
+      width: '120px'
+    },
+    {
+      title: 'Created',
+      render: (question: SurveyQuestion) => (
+        <Text size="small">
+          {question._createdDate ? new Date(question._createdDate).toLocaleDateString() : ''}
+        </Text>
+      ),
+      width: '100px'
+    },
+    {
+      title: 'Actions',
+      render: (question: SurveyQuestion) => (
+        <TableActionCell
+          primaryAction={{
+            text: 'Edit',
+            onClick: () => openModal(question)
+          }}
+          secondaryActions={[
+            {
+              text: question.isActive ? 'Deactivate' : 'Activate',
+              icon: question.isActive ? <Icons.Hidden /> : <Icons.Visible />,
+              onClick: () => toggleQuestionStatus(question)
+            },
+            {
+              text: 'Delete',
+              icon: <Icons.Delete />,
+              onClick: () => {
+                if (question._id) {
+                  handleDelete(question._id, question.questionText);
+                }
+              }
+            }
+          ]}
+        />
+      ),
+      width: '120px'
+    }
+  ];
+
+  if (loading) {
+    return (
+      <WixDesignSystemProvider features={{ newColorsBranding: true }}>
+        <Page height="100vh">
+          <Page.Header title="Survey Manager" />
+          <Page.Content>
+            <Box align="center" verticalAlign="middle" height="50vh">
+              <Loader text="Loading survey questions..." />
+            </Box>
+          </Page.Content>
+        </Page>
+      </WixDesignSystemProvider>
+    );
+  }
+
+  return (
+    <WixDesignSystemProvider features={{ newColorsBranding: true }}>
+      <Page height="100vh">
+        <Page.Header
+          title="Survey Manager"
+          subtitle="Create and manage rating survey questions, view aggregated results"
+          actionsBar={
+            <Button
+              onClick={() => openModal()}
+              prefixIcon={<Icons.Add />}
+            >
+              Add Question
+            </Button>
+          }
+        />
+        <Page.Content>
+          {questions.length === 0 ? (
+            <EmptyState
+              title="No survey questions yet"
+              subtitle="Create your first rating question to start collecting feedback from visitors"
+              skin="page"
+            >
+              <Button
+                onClick={() => openModal()}
+                prefixIcon={<Icons.Add />}
+              >
+                Create First Question
+              </Button>
+            </EmptyState>
+          ) : (
+            <>
+              {/* Summary Cards */}
+              <Box gap="24px" marginBottom="24px">
+                <Card>
+                  <Card.Content>
+                    <Box direction="vertical" gap="6px">
+                      <Heading size="small">Total Questions</Heading>
+                      <Text size="medium" weight="bold">{questions.length}</Text>
+                    </Box>
+                  </Card.Content>
+                </Card>
+                <Card>
+                  <Card.Content>
+                    <Box direction="vertical" gap="6px">
+                      <Heading size="small">Active Questions</Heading>
+                      <Text size="medium" weight="bold">
+                        {questions.filter(q => q.isActive).length}
+                      </Text>
+                    </Box>
+                  </Card.Content>
+                </Card>
+                <Card>
+                  <Card.Content>
+                    <Box direction="vertical" gap="6px">
+                      <Heading size="small">Total Responses</Heading>
+                      <Text size="medium" weight="bold">
+                        {Object.values(questionStats).reduce((sum, stats) => sum + stats.totalResponses, 0)}
+                      </Text>
+                    </Box>
+                  </Card.Content>
+                </Card>
+              </Box>
+
+              {/* Questions Table */}
+              <Table data={questions} columns={columns}>
+                <TableToolbar>
+                  <TableToolbar.ItemGroup position="start">
+                    <TableToolbar.Item>
+                      <TableToolbar.Title>Survey Questions</TableToolbar.Title>
+                    </TableToolbar.Item>
+                  </TableToolbar.ItemGroup>
+                </TableToolbar>
+                <Table.Content />
+              </Table>
+            </>
+          )}
+        </Page.Content>
+      </Page>
+
+      {/* Add/Edit Question Modal */}
+      <Modal isOpen={isModalOpen} onRequestClose={closeModal}>
+        <CustomModalLayout
+          primaryButtonText="Save"
+          secondaryButtonText="Cancel"
+          onCloseButtonClick={closeModal}
+          primaryButtonOnClick={handleSave}
+          secondaryButtonOnClick={closeModal}
+          title={`${editingQuestion ? 'Edit' : 'Add'} Survey Question`}
+          content={
+            <Layout gap="24px">
+              <Cell span={12}>
+                <FormField label="Question Text" required>
+                  <Input
+                    value={formData.questionText}
+                    onChange={(e) => setFormData({ ...formData, questionText: e.target.value })}
+                    placeholder="How would you rate our service?"
+                  />
+                </FormField>
+              </Cell>
+              <Cell span={6}>
+                <FormField label="Maximum Rating">
+                  <Input
+                    type="number"
+                    value={formData.maxRating.toString()}
+                    onChange={(e) => setFormData({ ...formData, maxRating: Math.max(1, Math.min(10, Number(e.target.value))) })}
+                    min={1}
+                    max={10}
+                  />
+                </FormField>
+              </Cell>
+              <Cell span={6}>
+                <FormField label="Active" labelPlacement="right" stretchContent={false}>
+                  <ToggleSwitch
+                    checked={formData.isActive}
+                    onChange={() => setFormData({ ...formData, isActive: !formData.isActive })}
+                  />
+                </FormField>
+              </Cell>
+            </Layout>
+          }
+        />
+      </Modal>
+    </WixDesignSystemProvider>
+  );
+};
+
+export default SurveyManager;

package/dist/examples-apps/survey-manager/src/dashboard/pages/wix_logo.svg

@@ -0,0 +1,18 @@
+<svg width="166" height="64" viewBox="0 0 166 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#clip0_14809_9463)">
+    <path
+      d="M165.304 0H156.173C153.64 0 151.273 1.25433 149.85 3.35199L137.639 21.3662C137.313 21.844 136.608 21.844 136.283 21.3662L124.071 3.35199C122.651 1.25433 120.281 0 117.748 0H108.617L130.371 32.0894L108.737 64H117.868C120.401 64 122.769 62.7457 124.192 60.648L136.283 42.8126C136.608 42.3349 137.313 42.3349 137.639 42.8126L149.73 60.648C151.15 62.7457 153.52 64 156.053 64H165.184L143.551 32.0894L165.304 0Z"
+      fill="black" />
+    <path
+      d="M89.8281 6.54652V64H94.1922C97.8088 64 100.74 61.0697 100.74 57.4535V0H96.3755C92.7588 0 89.8281 2.93032 89.8281 6.54652Z"
+      fill="black" />
+    <path
+      d="M81.8276 0H77.944C73.6681 0 69.9633 2.95701 69.0158 7.12564L60.3278 45.3185L52.7234 9.66632C51.3168 3.0771 44.5559 -1.36641 37.6375 0.544431C33.2307 1.76139 29.9637 5.48434 29.0108 9.95455L21.4839 45.2705L12.8118 7.12831C11.8616 2.95968 8.15687 0 3.88092 0H0L14.5548 63.9973H20.0692C25.0738 63.9973 29.3978 60.4986 30.4415 55.604L39.7461 11.9401C39.8608 11.3984 40.3466 11.006 40.8991 11.006C41.4516 11.006 41.9374 11.3984 42.0522 11.9401L51.3648 55.6067C52.4084 60.5012 56.7324 63.9973 61.7371 63.9973H67.2702L81.8276 0Z"
+      fill="black" />
+  </g>
+  <defs>
+    <clipPath id="clip0_14809_9463">
+      <rect width="165.305" height="64" fill="white" />
+    </clipPath>
+  </defs>
+</svg>

package/dist/examples-apps/survey-manager/src/extensions.ts

@@ -0,0 +1,12 @@
+import { app } from '@wix/astro/builders';
+import * as extensions from '@wix/astro/builders';
+
+export default app()
+  .use(
+    extensions.backofficePage({
+      component: './dashboard/pages/page.tsx',
+      id: '4344c4a2-1864-4587-87e9-5e4109b16999',
+      routePath: 'survey-manager',
+      title: 'Survey Manager',
+    })
+  );

package/dist/examples-apps/survey-manager/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "jsx": "react"
+  },
+  "extends": "astro/tsconfigs/strict",
+  "include": [".astro/types.d.ts", "**/*"],
+  "exclude": ["dist"]
+}

package/dist/examples-apps/survey-manager/wix.config.json

@@ -0,0 +1,4 @@
+{
+  "appId": "f24d09af-4473-430b-b9bc-6550bc08b268",
+  "siteId": "2593d2c4-5fee-42a5-b81c-f487d4e8ed64"
+}