From c4f16fce5ccfd15ef0626c8fbde408fd6d1296ab Mon Sep 17 00:00:00 2001
From: Sathya Gunasekaran <gsathya.ceg@gmail.com>
Date: Thu, 15 Dec 2022 18:38:03 +0000
Subject: [PATCH] [playground] Remove handlebar to resize input

The only use of this is to resize the input tab immediately to be smaller.
Instead, a follow on PR will just make the input tab smaller by default.
---
 .../packages/playground/components/Editor/index.tsx  | 12 ++----------
 1 file changed, 2 insertions(+), 10 deletions(-)

diff --git a/compiler/forget/packages/playground/components/Editor/index.tsx b/compiler/forget/packages/playground/components/Editor/index.tsx
index d9c5069730..6b0140cb06 100644
--- a/compiler/forget/packages/playground/components/Editor/index.tsx
+++ b/compiler/forget/packages/playground/components/Editor/index.tsx
@@ -33,10 +33,6 @@ export default function Editor() {
   const [showOutputOnMobile, setShowOutputOnMobile] = useState(false);
   const { width: windowWidth } = useWindowSize();
   const isMobile = windowWidth < 640;
-  const [inputWidthInPct, setInputWidthInPct] = useState(50);
-  const handleDrag = useDrag(({ delta: [x], xy: [currentPos] }) => {
-    if (x !== 0) setInputWidthInPct(((currentPos + x) / windowWidth) * 100);
-  });
   const [diagnostics, setDiagnostics] = useState<Diagnostic[]>([]);
   const updateDiagnostics = useCallback(
     (newDiags: Diagnostic[]) => setDiagnostics(newDiags),
@@ -74,20 +70,16 @@ export default function Editor() {
       <div className="flex grow">
         <div
           style={{
-            width: isMobile ? "100%" : `${inputWidthInPct}%`,
+            width: isMobile ? "100%" : "50%",
           }}
           className={clsx("relative sm:min-w-[300px] sm:block", {
             hidden: showOutputOnMobile,
           })}
         >
           <Input diagnostics={diagnostics} />
-          <div
-            {...handleDrag()}
-            className="absolute w-[5px] top-0 h-full right-[-2px] flex-none hidden transition-opacity duration-300 ease-out opacity-0 hover:opacity-100 bg-gray-300 sm:block cursor-col-resize touch-pan-x z-50"
-          />
         </div>
         <div
-          style={{ width: isMobile ? "100%" : `${100 - inputWidthInPct}%` }}
+          style={{ width: isMobile ? "100%" : `${50}%` }}
           className={clsx("flex sm:flex sm:min-w-[300px]", {
             hidden: !showOutputOnMobile,
           })}