Fix environment params duplicate text

Author: Jacobdeanr

app/ui/fogparameters.tsx

@@ -6,17 +6,8 @@ type Fog = { primaryFogColor?: number[]; secondaryFogColor?: number[] };
 export default function FogParams(f: Fog) {
   const { primaryFogColor, secondaryFogColor } = f ?? {};
 
-  const noData = !primaryFogColor && !secondaryFogColor;
-
   return (
-    <ParamSection title="Fog Parameters">
-      {noData ? (
-        <ParamRow label="">
-          <span className="italic text-neutral-500">
-            No data available.
-          </span>
-        </ParamRow>
-      ) : (
+    <ParamSection title="">
         <>
           <ParamRow label="Primary Fog Color">
             {primaryFogColor && <Swatch rgb={primaryFogColor} />}
@@ -25,7 +16,6 @@ export default function FogParams(f: Fog) {
             {secondaryFogColor && <Swatch rgb={secondaryFogColor} />}
           </ParamRow>
         </>
-      )}
     </ParamSection>
   );
 }

app/ui/modal.tsx

@@ -125,8 +125,20 @@ export default function Modal({ slug, meta, onClose }: { slug: string; meta: Sky
                 <div className="space-y-6">
                   <h3 className="font-medium text-neutral-200">Environment Parameters</h3>
                   <div className="grid gap-6 lg:grid-cols-2 lg:gap-x-8 items-start">
-                    {meta?.sunParameters && <SunParams {...meta.sunParameters} />}
-                    {meta?.fogParameters && <FogParams {...meta.fogParameters} />}
+                    {/* Fog Parameters */}
+                              {meta?.fogParameters && (
+                                <div className="bg-neutral-900/50 backdrop-blur-sm rounded-xl p-6 border border-neutral-800">
+                                  <h2 className="text-xl font-semibold text-white mb-4">Fog Parameters</h2>
+                                  <FogParams {...meta.fogParameters} />
+                                </div>
+                              )}
+                              {/* Sun Parameters */}
+                              {meta?.sunParameters && (
+                                <div className="bg-neutral-900/50 backdrop-blur-sm rounded-xl p-6 border border-neutral-800">
+                                  <h2 className="text-xl font-semibold text-white mb-4">Sun Parameters</h2>
+                                  <SunParams {...meta.sunParameters} />
+                                </div>
+                              )}
                   </div>
                 </div>
               )}

app/ui/sunparameters.tsx

@@ -11,22 +11,9 @@ export type Sun = {
   export default function SunParams(s: Sun) {
     const { sunAngle, pitch, brightness, ambience } = s ?? {};
 
-    const noData =
-      sunAngle === undefined &&
-      pitch     === undefined &&
-      !brightness &&
-      !ambience;
-  
     return (
-      <ParamSection title="Sun Parameters">
-        {noData ? (
-          <ParamRow label="">
-            <span className="italic text-neutral-500">
-              No data available.
-            </span>
-          </ParamRow>
-        ) : (
-          <>
+      <ParamSection title="">
+        <>
             <ParamRow label="Sun Angle">{sunAngle}</ParamRow>
             <ParamRow label="Pitch">{pitch}</ParamRow>
             <ParamRow label="Brightness">
@@ -36,7 +23,6 @@ export type Sun = {
               {ambience && <Swatch rgb={ambience} />}
             </ParamRow>
           </>
-        )}
       </ParamSection>
     );
   }