assets added based on categoryin builder

app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx

@@ -16,7 +16,7 @@ import {
   useWallVisibility,
 } from "../../../../store/store";
 import { setEnvironment } from "../../../../services/factoryBuilder/environment/setEnvironment";
-
+import * as CONSTANTS from "../../../../types/world/worldConstants";
 const GlobalProperties: React.FC = () => {
   const { toggleView, setToggleView } = useToggleView();
   const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem();
@@ -29,18 +29,20 @@ const GlobalProperties: React.FC = () => {
   const { renderDistance, setRenderDistance } = useRenderDistance();
   const { socket } = useSocketStore();
   const [limitDistance, setLimitDistance] = useState(false);
-  const [distance, setDistance] = useState<number>(5);
+  const [distance, setDistance] = useState<number>(30);
 
   const [limitGridDistance, setLimitGridDistance] = useState(false);
   const [gridDistance, setGridDistance] = useState<number>(5);
 
   function optimizeScene() {
     setLimitDistance(true);
-    setDistance(5);
+    setDistance(30);
   }
 
   function updateDistance(value: number) {
+    console.log("value: ", value);
     setDistance(value);
+    setRenderDistance(value);
   }
 
   function updateGridDistance(value: number) {
@@ -134,6 +136,15 @@ const GlobalProperties: React.FC = () => {
     }
   };
 
+  // function changeRenderDistance(e: any) {
+  //   if (parseInt(e.target.value) < 20) {
+  //     setRenderDistance(20);
+  //   } else if (parseInt(e.target.value) > 75) {
+  //     setRenderDistance(75);
+  //   } else {
+  //     setRenderDistance(parseInt(e.target.value));
+  //   }
+  // }
   return (
     <div className="global-properties-container">
       <div className="header">Environment</div>
@@ -169,7 +180,7 @@ const GlobalProperties: React.FC = () => {
       />
 
       <div className="split"></div>
-
+      {/* //visibleEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor} */}
       <InputToggle
         inputKey="4"
         label="Limit Render Distance"
@@ -183,6 +194,8 @@ const GlobalProperties: React.FC = () => {
         disabled={!limitDistance}
         value={distance}
         key={"5"}
+        min={CONSTANTS.distanceConfig.minDistance}
+        max={CONSTANTS.distanceConfig.maxDistance}
         onChange={(value: number) => updateDistance(value)}
       />