fix: show real date and remember survey list orientation (#2108)

packages/ui/SurveysList/components/SurveyCard.tsx

@@ -3,7 +3,7 @@ import Link from "next/link";
 import { useEffect, useMemo, useState } from "react";
 
 import { cn } from "@formbricks/lib/cn";
-import { timeSince } from "@formbricks/lib/time";
+import { convertDateString, timeSince } from "@formbricks/lib/time";
 import { TEnvironment } from "@formbricks/types/environment";
 import { TSurvey } from "@formbricks/types/surveys";
 
@@ -130,7 +130,7 @@ export default function SurveyCard({
 
         <div className="col-span-4 grid w-full grid-cols-5 place-items-center">
           <div className="col-span-2 overflow-hidden text-ellipsis whitespace-nowrap text-sm text-slate-600">
-            {timeSince(survey.createdAt.toString())}
+            {convertDateString(survey.createdAt.toString())}
           </div>
           <div className="col-span-2 overflow-hidden text-ellipsis whitespace-nowrap text-sm text-slate-600">
             {timeSince(survey.updatedAt.toString())}

packages/ui/SurveysList/index.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { PlusIcon } from "lucide-react";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 import { TEnvironment } from "@formbricks/types/environment";
 import { TSurvey } from "@formbricks/types/surveys";
@@ -28,7 +28,14 @@ export default function SurveysList({
   userId,
 }: SurveysListProps) {
   const [filteredSurveys, setFilteredSurveys] = useState<TSurvey[]>(surveys);
-  const [orientation, setOrientation] = useState("grid");
+  // Initialize orientation state from localStorage or default to 'grid'
+  const [orientation, setOrientation] = useState(() => localStorage.getItem("surveyOrientation") || "grid");
+
+  // Save orientation to localStorage
+  useEffect(() => {
+    localStorage.setItem("surveyOrientation", orientation);
+  }, [orientation]);
+
   return (
     <div className="space-y-4">
       <div className="flex justify-between">