feat: support calendar (#56)

* chore: modified title sync

* chore: replace console.log to console.debug

* feat: add FullCalendar dependencies and improve code organization

* chore: update view name bugs

* chore: support no date row

* chore: layout by created time and modified time

* chore: adjust time

* chore: pnpm install

* chore: fix something

Author: qinluhe

.vscode/settings.json

@@ -1,5 +1,8 @@
 {
   "typescript.tsdk": "node_modules/typescript/lib",
+  "cursor.ai.language": "en",
+  "cursor.commitMessage.language": "english",
+  "locale": "en-US",
   "editor.rulers": [
     120
   ],

package.json

@@ -41,6 +41,12 @@
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
     "@floating-ui/react": "^0.26.27",
+    "@fullcalendar/core": "^6.1.19",
+    "@fullcalendar/daygrid": "^6.1.19",
+    "@fullcalendar/interaction": "^6.1.19",
+    "@fullcalendar/multimonth": "^6.1.19",
+    "@fullcalendar/react": "^6.1.19",
+    "@fullcalendar/timegrid": "^6.1.19",
     "@jest/globals": "^29.7.0",
     "@mui/icons-material": "^5.11.11",
     "@mui/material": "^6.0.0",

pnpm-lock.yaml

@@ -28,7 +28,7 @@ if (!fs.existsSync(fullTargetPath)) {
 
 if (fs.existsSync(fullTargetPath)) {
   // unlink existing symlink
-  console.log(chalk.yellow(`unlinking existing symlink: `) + chalk.blue(`${fullTargetPath}`));
+  console.debug(chalk.yellow(`unlinking existing symlink: `) + chalk.blue(`${fullTargetPath}`));
   fs.unlinkSync(fullTargetPath);
 }
 
@@ -38,6 +38,6 @@ fs.symlink(fullSourcePath, fullTargetPath, 'junction', (err) => {
     console.error(chalk.red(`error creating symlink: ${err.message}`));
     process.exit(1);
   }
-  console.log(chalk.green(`symlink created: `) + chalk.blue(`${fullSourcePath}`) + ' -> ' + chalk.blue(`${fullTargetPath}`));
+  console.debug(chalk.green(`symlink created: `) + chalk.blue(`${fullSourcePath}`) + ' -> ' + chalk.blue(`${fullTargetPath}`));
 
 });

scripts/create-symlink.cjs

@@ -58,4 +58,4 @@ fs.writeFileSync(tailwindConfigFilePath, tailwindColorTemplate, 'utf-8');
 const tailwindShadowFilePath = path.join(__dirname, '../tailwind/box-shadow.cjs');
 fs.writeFileSync(tailwindShadowFilePath, tailwindShadowTemplate, 'utf-8');
 
-console.log('Tailwind CSS colors configuration generated successfully.');
+console.debug('Tailwind CSS colors configuration generated successfully.');

scripts/generateTailwindColors.cjs

@@ -58,7 +58,7 @@ const main = () => {
   const categories = processSvgFiles(iconsDirPath);
   const outputFilePath = path.join(iconsDirPath, 'icons.json');
   outputJson(categories, outputFilePath);
-  console.log(`JSON data has been written to ${outputFilePath}`);
+  console.debug(`JSON data has been written to ${outputFilePath}`);
 };
 
 main();

scripts/generate_af_icons.cjs

@@ -29,7 +29,7 @@ fs.copyFileSync(path.join(__dirname, '../coverage/merged/coverage-final.json'),
 
 // Generate final merged report
 execSync('nyc report --reporter=html --reporter=text-summary --report-dir=coverage/merged --temp-dir=coverage/.nyc_output', { stdio: 'inherit' });
-console.log(`Merged coverage report written to coverage/merged`);
+console.debug(`Merged coverage report written to coverage/merged`);
 
 
 

scripts/merge-coverage.cjs

@@ -5,7 +5,7 @@ const path = require('path');
 function ensureDirectoryExists (dirPath) {
   if (!fs.existsSync(dirPath)) {
     fs.mkdirSync(dirPath, { recursive: true });
-    console.log(`Created directory: ${dirPath}`);
+    console.debug(`Created directory: ${dirPath}`);
   }
 }
 
@@ -219,7 +219,7 @@ function convertDesignTokens (primitiveFilePath, semanticFilePath, outputFilePat
 
   // Write file
   fs.writeFileSync(outputFilePath, css, 'utf8');
-  console.log(`CSS variables written to ${outputFilePath}`);
+  console.debug(`CSS variables written to ${outputFilePath}`);
 
   return { variableNames };
 }
@@ -237,7 +237,7 @@ ensureDirectoryExists(cssOutputDir);
 ensureDirectoryExists(tailwindOutputDir);
 
 // Execute conversion
-console.log('Converting design tokens to CSS variables...');
+console.debug('Converting design tokens to CSS variables...');
 
 // Collect all variable names
 let allVariableNames = [];
@@ -261,9 +261,9 @@ const darkResult = convertDesignTokens(
 // Dark theme variables are the same as light theme, no need to merge
 
 // Generate Tailwind color configuration
-console.log('Generating Tailwind color configuration with CSS variable references...');
+console.debug('Generating Tailwind color configuration with CSS variable references...');
 const tailwindColors = createTailwindColorsFromVariables(allVariableNames);
 fs.writeFileSync(path.join(tailwindOutputDir, 'new-colors.cjs'), tailwindColors);
-console.log(`Tailwind colors written to ${path.join(tailwindOutputDir, 'new-colors.cjs')}`);
+console.debug(`Tailwind colors written to ${path.join(tailwindOutputDir, 'new-colors.cjs')}`);
 
-console.log('Conversion completed successfully!');
+console.debug('Conversion completed successfully!');

scripts/system-token/convert-tokens.cjs

@@ -342,6 +342,7 @@
     "lightMode": "Switch to Light mode",
     "darkMode": "Switch to Dark mode",
     "openAsPage": "Open as a Page",
+    "openEvent": "Open event",
     "addNewRow": "Add a new row",
     "openMenu": "Click to open menu",
     "dragRow": "Drag to reorder the row",
@@ -1608,7 +1609,8 @@
       "action": "Action",
       "add": "Click add to below",
       "drag": "Drag to move",
-      "deleteRowPrompt": "Are you sure you want to delete {{count}} rows? This action cannot be undone.",
+      "deleteRowPrompt_one": "Are you sure you want to delete {{count}} row? This action cannot be undone.",
+      "deleteRowPrompt_many": "Are you sure you want to delete {{count}} rows? This action cannot be undone.",
       "deleteCardPrompt": "Are you sure you want to delete this card? This action cannot be undone.",
       "dragAndClick": "Drag to move, click to open menu",
       "insertRecordAbove": "Insert record above",
@@ -2201,18 +2203,24 @@
     "menuName": "Calendar",
     "defaultNewCalendarTitle": "Untitled",
     "newEventButtonTooltip": "Add a new event",
+    "deleteEvent": "Delete event",
+    "addEventOn": "Add event on",
+    "more": "{{num}}+ more",
     "navigation": {
       "today": "Today",
       "jumpToday": "Jump to Today",
-      "previousMonth": "Previous Month",
-      "nextMonth": "Next Month",
+      "previous": "Previous {{view}}",
+      "next": "Next {{view}}",
       "views": {
         "day": "Day",
         "week": "Week",
         "month": "Month",
         "year": "Year"
       }
     },
+    "week": "Week",
+    "month": "Month",
+    "multiMonth": "Multi-month",
     "mobileEventScreen": {
       "emptyTitle": "No events yet",
       "emptyBody": "Press the plus button to create an event on this day."
@@ -2232,7 +2240,8 @@
       "unscheduledEventsTitle": "Unscheduled events",
       "clickToAdd": "Click to add to the calendar",
       "name": "Calendar settings",
-      "clickToOpen": "Click to open the record"
+      "clickToOpen": "Click to open the record",
+      "noDatePopoverTitle": "Drag or click to assign a date"
     },
     "referencedCalendarPrefix": "View of",
     "quickJumpYear": "Jump to",

src/@types/translations/en.json

@@ -92,7 +92,7 @@ export function useRemoteSelectionsSelector(awareness?: Awareness) {
             timestamp: state.timestamp,
           });
         } else {
-          console.log(`🎯 No selection found for client ${clientId}`);
+          console.debug(`🎯 No selection found for client ${clientId}`);
         }
       });
 
@@ -120,7 +120,7 @@ export function useRemoteSelectionsSelector(awareness?: Awareness) {
       };
     });
 
-    console.log('🎯 Final cursors array:', result);
+    console.debug('🎯 Final cursors array:', result);
     return result;
   }, [cursors, editor]);