Edit packages/database/migrations/20240229062232_adds_styling_column_to_product_model/migration.sql

apps/web/app/(app)/environments/[environmentId]/settings/lookandfeel/components/UnifiedStyling.tsx

@@ -122,23 +122,23 @@ const previewSurvey = {
   segment: null,
 };
 
-const StylingSettings = ({...props}) => {
-  // ... styling settings code ...
-};
-
-const SurveyPreview = ({...props}) => {
-  // ... survey preview code ...
-};
-
 const UnifiedStyling = ({ product }: UnifiedStylingProps) => {
-  // ...
-  return (
-    <div className="flex">
-      <StylingSettings {...props} />
-      <SurveyPreview {...props} />
-    </div>
+  const router = useRouter();
+  const [unifiedStyling, setUnifiedStyling] = useState(product.styling?.unifiedStyling ?? false);
+  const [allowStyleOverwrite, setAllowStyleOverwrite] = useState(
+    product.styling?.allowStyleOverwrite ?? false
   );
-};
+  const [brandColor, setBrandColor] = useState(
+    product.styling?.brandColor?.light ?? colorDefaults.brandColor
+  );
+  const [questionColor, setQuestionColor] = useState(
+    product.styling?.questionColor?.light ?? colorDefaults.questionColor
+  );
+  const [inputColor, setInputColor] = useState(
+    product.styling?.inputColor?.light ?? colorDefaults.inputColor
+  );
+  const [inputBorderColor, setInputBorderColor] = useState(
+    product.styling?.inputBorderColor?.light ?? colorDefaults.inputBorderColor
   );
   const [cardBackgroundColor, setCardBackgroundColor] = useState(
     product.styling?.cardBackgroundColor?.light ?? colorDefaults.cardBackgroundColor

packages/database/migrations/20240229062232_adds_styling_column_to_product_model/migration.sql

@@ -1,2 +1,3 @@
 -- AlterTable
-ALTER TABLE "Product" ADD COLUMN     "styling" JSONB DEFAULT '{"unifiedStyling":true,"allowStyleOverwrite":true,"brandColor":{"light":"#64748b"}}';
+ALTER TABLE "Product" ADD COLUMN "styling" JSONB DEFAULT '{"unifiedStyling":true,"allowStyleOverwrite":true,"brandColor":{"light":"#64748b"}}';
+CREATE INDEX idx_product_styling ON "Product" USING gin ("styling");