feat: Unified icon picker (#7038)

server/commands/documentCreator.ts

@@ -12,7 +12,8 @@ type Props = Optional<
     | "title"
     | "text"
     | "content"
-    | "emoji"
+    | "icon"
+    | "color"
     | "collectionId"
     | "parentDocumentId"
     | "importId"
@@ -36,7 +37,8 @@ type Props = Optional<
 export default async function documentCreator({
   title = "",
   text = "",
-  emoji,
+  icon,
+  color,
   state,
   id,
   urlId,
@@ -96,9 +98,9 @@ export default async function documentCreator({
       importId,
       sourceMetadata,
       fullWidth: templateDocument ? templateDocument.fullWidth : fullWidth,
-      emoji: templateDocument ? templateDocument.emoji : emoji,
-      icon: templateDocument ? templateDocument.emoji : emoji,
-      color: templateDocument ? templateDocument.color : null,
+      emoji: templateDocument ? templateDocument.emoji : icon,
+      icon: templateDocument ? templateDocument.emoji : icon,
+      color: templateDocument ? templateDocument.color : color,
       title: TextHelper.replaceTemplateVariables(
         templateDocument ? templateDocument.title : title,
         user

server/commands/documentDuplicator.test.ts

@@ -26,7 +26,8 @@ describe("documentDuplicator", () => {
     expect(response[0].title).toEqual(original.title);
     expect(response[0].text).toEqual(original.text);
     expect(response[0].emoji).toEqual(original.emoji);
-    expect(response[0].icon).toEqual(original.emoji);
+    expect(response[0].icon).toEqual(original.icon);
+    expect(response[0].color).toEqual(original.color);
     expect(response[0].publishedAt).toBeInstanceOf(Date);
   });
 
@@ -35,7 +36,7 @@ describe("documentDuplicator", () => {
     const original = await buildDocument({
       userId: user.id,
       teamId: user.teamId,
-      emoji: "👋",
+      icon: "👋",
     });
 
     const response = await sequelize.transaction((transaction) =>
@@ -52,8 +53,9 @@ describe("documentDuplicator", () => {
     expect(response).toHaveLength(1);
     expect(response[0].title).toEqual("New title");
     expect(response[0].text).toEqual(original.text);
-    expect(response[0].emoji).toEqual(original.emoji);
-    expect(response[0].icon).toEqual(original.emoji);
+    expect(response[0].emoji).toEqual(original.icon);
+    expect(response[0].icon).toEqual(original.icon);
+    expect(response[0].color).toEqual(original.color);
     expect(response[0].publishedAt).toBeInstanceOf(Date);
   });
 
@@ -62,7 +64,7 @@ describe("documentDuplicator", () => {
     const original = await buildDocument({
       userId: user.id,
       teamId: user.teamId,
-      emoji: "👋",
+      icon: "👋",
     });
 
     await buildDocument({
@@ -108,7 +110,8 @@ describe("documentDuplicator", () => {
     expect(response[0].title).toEqual(original.title);
     expect(response[0].text).toEqual(original.text);
     expect(response[0].emoji).toEqual(original.emoji);
-    expect(response[0].icon).toEqual(original.emoji);
+    expect(response[0].icon).toEqual(original.icon);
+    expect(response[0].color).toEqual(original.color);
     expect(response[0].publishedAt).toBeNull();
   });
 });

server/commands/documentDuplicator.ts

@@ -45,7 +45,8 @@ export default async function documentDuplicator({
 
   const duplicated = await documentCreator({
     parentDocumentId: parentDocumentId ?? document.parentDocumentId,
-    emoji: document.emoji,
+    icon: document.icon ?? document.emoji,
+    color: document.color,
     template: document.template,
     title: title ?? document.title,
     content: document.content,
@@ -78,7 +79,8 @@ export default async function documentDuplicator({
     for (const childDocument of childDocuments) {
       const duplicatedChildDocument = await documentCreator({
         parentDocumentId: duplicated.id,
-        emoji: childDocument.emoji,
+        icon: childDocument.icon ?? childDocument.emoji,
+        color: childDocument.color,
         title: childDocument.title,
         text: childDocument.text,
         ...sharedProperties,

server/commands/documentImporter.ts

@@ -28,7 +28,7 @@ async function documentImporter({
   ip,
   transaction,
 }: Props): Promise<{
-  emoji?: string;
+  icon?: string;
   text: string;
   title: string;
   state: Buffer;
@@ -43,9 +43,9 @@ async function documentImporter({
   // find and extract emoji near the beginning of the document.
   const regex = emojiRegex();
   const matches = regex.exec(text.slice(0, 10));
-  const emoji = matches ? matches[0] : undefined;
-  if (emoji) {
-    text = text.replace(emoji, "");
+  const icon = matches ? matches[0] : undefined;
+  if (icon) {
+    text = text.replace(icon, "");
   }
 
   // If the first line of the imported text looks like a markdown heading
@@ -96,7 +96,7 @@ async function documentImporter({
     text,
     state,
     title,
-    emoji,
+    icon,
   };
 }
 

server/commands/documentUpdater.ts

@@ -9,8 +9,10 @@ type Props = {
   document: Document;
   /** The new title */
   title?: string;
-  /** The document emoji */
-  emoji?: string | null;
+  /** The document icon */
+  icon?: string | null;
+  /** The document icon's color */
+  color?: string | null;
   /** The new text content */
   text?: string;
   /** Whether the editing session is complete */
@@ -46,7 +48,8 @@ export default async function documentUpdater({
   user,
   document,
   title,
-  emoji,
+  icon,
+  color,
   text,
   editorVersion,
   templateId,
@@ -65,9 +68,12 @@ export default async function documentUpdater({
   if (title !== undefined) {
     document.title = title.trim();
   }
-  if (emoji !== undefined) {
-    document.emoji = emoji;
-    document.icon = emoji;
+  if (icon !== undefined) {
+    document.emoji = icon;
+    document.icon = icon;
+  }
+  if (color !== undefined) {
+    document.color = color;
   }
   if (editorVersion) {
     document.editorVersion = editorVersion;