cleanup

facebook · Oct 30, 2023 · bbf70d9 · bbf70d9
1 parent e05261e
commit bbf70d9
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 43 deletions.
diff --git a/website-next/src/components/Playground/Editor.tsx b/website-next/src/components/Playground/Editor.tsx
@@ -34,7 +34,11 @@ export default function Editor(props: Props) {
   return (
     <div className={styles.editor}>
       <Tabs block={true}>
-        <TabItem value="flex" label="Flex" className={styles.tabItem} default={true}>
+        <TabItem
+          value="flex"
+          label="Flex"
+          className={styles.tabItem}
+          default={true}>
           <h2>Direction</h2>
           <EditValue
             property="direction"
@@ -49,8 +53,8 @@ export default function Editor(props: Props) {
             onChange={props.onChangeLayout}
           />
 
-          <div className='row margin--none'>
-            <div className='col col--4'>
+          <div className="row margin--none">
+            <div className="col col--4">
               <h2>Basis</h2>
               <EditValue
                 // @ts-ignore
@@ -62,7 +66,7 @@ export default function Editor(props: Props) {
                 onChange={props.onChangeLayout}
               />
             </div>
-            <div className='col col--4'>
+            <div className="col col--4">
               <h2>Grow</h2>
               <EditValue
                 // @ts-ignore
@@ -74,7 +78,7 @@ export default function Editor(props: Props) {
                 onChange={props.onChangeLayout}
               />
             </div>
-            <div className='col col--4'>
+            <div className="col col--4">
               <h2>Shrink</h2>
               <EditValue
                 // @ts-ignore
@@ -244,8 +248,18 @@ export default function Editor(props: Props) {
       </Tabs>
 
       <div className={styles.editorButtons}>
-        <button className="button button--block button--primary button--sm" disabled={!props.onRemove} onClick={props.onAdd}>add child</button>
-        <button className="button button--block button--danger button--sm" disabled={!props.onRemove} onClick={props.onAdd}>remove</button>
+        <button
+          className="button button--block button--primary button--sm"
+          disabled={!props.onRemove}
+          onClick={props.onAdd}>
+          add child
+        </button>
+        <button
+          className="button button--block button--danger button--sm"
+          disabled={!props.onRemove}
+          onClick={props.onAdd}>
+          remove
+        </button>
       </div>
     </div>
   );

diff --git a/website-next/src/components/Playground/YogaEnumSelect.tsx b/website-next/src/components/Playground/YogaEnumSelect.tsx
@@ -59,37 +59,18 @@ export default class YogaEnumSelect extends Component<Props> {
     return key.replace(replacer, '').replace('_', ' ').toLowerCase();
   };
 
- /* <Dropdown
-          trigger={['click']}
-          disabled={this.props.disabled}
-          overlay={
-            // @ts-ignore
-            <Menu onClick={this.handleMenuClick}>
-              {this.values.map(({key, value}) => (
-                // @ts-ignore
-                <Menu.Item key={key} value={value}>
-                  {this.getTitle(property, key)}
-                </Menu.Item>
-              ))}
-            </Menu>
-          }>
-          <Button>
-            {selected ? this.getTitle(property, selected.key) : ''}
-            <Icon type="down" />
-          </Button>
-        </Dropdown> */
-
   render() {
     const property = PROPERTY_LOOKUP[this.props.property];
     const selected = this.values.find(({value}) => value === this.props.value);
 
     return this.values.length > 3 ? (
-        <select className={styles.select} name={this.props.property}>
-          {this.values.map(({key, value}) => (
-           <option key={key} value={value}> {this.getTitle(property, key)}</option>
-          ))}
-        </select>
-
+      <select className={styles.select} name={this.props.property}>
+        {this.values.map(({key, value}) => (
+          <option key={key} value={value}>
+            {selected ? this.getTitle(property, key) : ''}
+          </option>
+        ))}
+      </select>
     ) : (
       <div className={clsx('button-group', styles.buttonGroup)}>
         {this.values.map(({key, value}) => (
@@ -102,8 +83,7 @@ export default class YogaEnumSelect extends Component<Props> {
               value === this.props.value && 'button--active',
               styles.button,
             )}
-            onClick={() => this.props.onChange(this.props.property, value)}
-            >
+            onClick={() => this.props.onChange(this.props.property, value)}>
             {this.getTitle(property, key)}
           </button>
         ))}

diff --git a/website-next/src/pages/index.tsx b/website-next/src/pages/index.tsx
@@ -57,14 +57,14 @@ const LazyPlayground = React.lazy(
 function PlaygroundSection() {
   return (
     <main className={styles.playgroundSection}>
-      <div className='container'>
-      <BrowserOnly fallback={null}>
-        {() => (
-          <Suspense fallback={null}>
-            <LazyPlayground className={styles.playground} />
-          </Suspense>
-        )}
-      </BrowserOnly>
+      <div className="container">
+        <BrowserOnly fallback={null}>
+          {() => (
+            <Suspense fallback={null}>
+              <LazyPlayground className={styles.playground} />
+            </Suspense>
+          )}
+        </BrowserOnly>
       </div>
     </main>
   );