CodeEditorOptions() — react Function Reference

Architecture documentation for the CodeEditorOptions() function in CodeEditorOptions.js from the react codebase.

Function javascript BabelCompiler Validation

Entity Profile

BabelCompiler→ Validation→ CodeEditorOptions() — react Function Reference

Dependency Diagram

graph TD
  09ea2535_a107_bb02_d62f_c47ef5914da8["CodeEditorOptions()"]
  3360bd40_244b_03ad_208a_10c8b4341347["CodeEditorOptions.js"]
  09ea2535_a107_bb02_d62f_c47ef5914da8 -->|defined in| 3360bd40_244b_03ad_208a_10c8b4341347
  style 09ea2535_a107_bb02_d62f_c47ef5914da8 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-shared/src/devtools/views/Settings/CodeEditorOptions.js lines 23–61

export default function CodeEditorOptions({
  environmentNames,
}: {
  environmentNames: Promise<Array<string>>,
}): React.Node {
  const [openInEditorURLPreset, setOpenInEditorURLPreset] = useLocalStorage<
    'vscode' | 'custom',
  >(LOCAL_STORAGE_OPEN_IN_EDITOR_URL_PRESET, getDefaultPreset());

  const [openInEditorURL, setOpenInEditorURL] = useLocalStorage<string>(
    LOCAL_STORAGE_OPEN_IN_EDITOR_URL,
    getDefaultOpenInEditorURL(),
  );

  return (
    <>
      <select
        value={openInEditorURLPreset}
        onChange={({currentTarget}) => {
          const selectedValue = currentTarget.value;
          setOpenInEditorURLPreset(selectedValue);
        }}>
        <option value="vscode">VS Code</option>
        <option value="custom">Custom</option>
      </select>
      {openInEditorURLPreset === 'custom' && (
        <input
          className={styles.Input}
          type="text"
          placeholder={getDefaultOpenInEditorURL()}
          value={openInEditorURL}
          onChange={event => {
            setOpenInEditorURL(event.target.value);
          }}
        />
      )}
    </>
  );
}