diff --git a/mamba_gator/envmanager.py b/mamba_gator/envmanager.py
index 3b010d85..1b4af97b 100644
--- a/mamba_gator/envmanager.py
+++ b/mamba_gator/envmanager.py
@@ -395,15 +395,19 @@ async def import_env(
         Returns:
             Dict[str, str]: Create command output
         """
-        with tempfile.NamedTemporaryFile(mode="w", delete=False, suffix=file_name) as f:
+        regex = re.compile('^@EXPLICIT$', re.MULTILINE)
+        is_explicit_list = regex.search(file_content)
+
+        env_argument = [] if is_explicit_list else ["env"]
+
+        with tempfile.NamedTemporaryFile(mode="w", suffix=file_name) as f:
             name = f.name
             f.write(file_content)
+            f.flush()
 
-        ans = await self._execute(
-            self.manager, "env", "create", "-q", "--json", "-n", env, "--file", name
-        )
-        # Remove temporary file
-        os.unlink(name)
+            ans = await self._execute(
+                self.manager, *env_argument, "create", "-q", "--json", "-n", env, "--file", name
+            )
 
         rcode, output = ans
         if rcode > 0:
@@ -995,3 +999,13 @@ async def remove_packages(self, env: str, packages: List[str]) -> Dict[str, str]
         )
         _, output = ans
         return self._clean_conda_json(output)
+
+    async def get_subdir(self):
+        rcode, output = await self._execute(
+            self.manager, "list", "--explicit"
+        )
+        if rcode == 0:
+            regex = re.compile('^# platform: ([a-z\-0-9]+)$', re.MULTILINE)
+            return {'subdir': regex.findall(output)[0]}
+
+        raise RuntimeError('subdir not found')
diff --git a/mamba_gator/handlers.py b/mamba_gator/handlers.py
index b722e759..87d7570c 100644
--- a/mamba_gator/handlers.py
+++ b/mamba_gator/handlers.py
@@ -475,6 +475,15 @@ def delete(self, index: int):
             self.finish()
 
 
+class SubdirHandler(EnvBaseHandler):
+    @tornado.web.authenticated
+    async def get(self):
+        """`GET /subdir` Get the conda-subdir.
+        """
+        idx = self._stack.put(self.env_manager.get_subdir)
+
+        self.redirect_to_task(idx)
+
 # -----------------------------------------------------------------------------
 # URL to handler mappings
 # -----------------------------------------------------------------------------
@@ -488,6 +497,7 @@ def delete(self, index: int):
     (r"/channels", ChannelsHandler),
     (r"/environments", EnvironmentsHandler),  # GET / POST
     (r"/environments/%s" % _env_regex, EnvironmentHandler),  # GET / PATCH / DELETE
+    (r"/subdir", SubdirHandler),  # GET
     # PATCH / POST / DELETE
     (r"/environments/%s/packages" % _env_regex, PackagesEnvironmentHandler),
     (r"/packages", PackagesHandler),  # GET
diff --git a/mamba_gator/navigator/main.py b/mamba_gator/navigator/main.py
index 53cca0c5..479eb64d 100644
--- a/mamba_gator/navigator/main.py
+++ b/mamba_gator/navigator/main.py
@@ -9,7 +9,9 @@
     ExtensionHandlerMixin,
 )
 from jupyter_server.utils import url_path_join as ujoin
+from jupyter_core.application import base_aliases
 from jupyterlab_server import LabServerApp
+from traitlets import Unicode, Dict, Bool
 from mamba_gator._version import __version__
 from mamba_gator.handlers import _load_jupyter_server_extension
 from mamba_gator.log import get_logger
@@ -20,6 +22,12 @@
 class MambaNavigatorHandler(
     ExtensionHandlerJinjaMixin, ExtensionHandlerMixin, JupyterHandler
 ):
+    extra_settings = None
+
+    def initialize(self, extra_settings, **kwargs):
+        self.extra_settings = extra_settings
+        super().initialize(**kwargs)
+
     def get(self):
         config_data = {
             "appVersion": __version__,
@@ -27,6 +35,7 @@ def get(self):
             "token": self.settings["token"],
             "fullStaticUrl": ujoin(self.base_url, "static", self.name),
             "frontendUrl": ujoin(self.base_url, "gator/"),
+            **self.extra_settings
         }
         return self.write(
             self.render_template(
@@ -56,8 +65,65 @@ class MambaNavigator(LabServerApp):
     user_settings_dir = os.path.join(HERE, "user_settings")
     workspaces_dir = os.path.join(HERE, "workspaces")
 
+    quetz_url = Unicode(
+        '',
+        config=True,
+        help="The Quetz server to use for creating new environments"
+    )
+
+    quetz_solver_url = Unicode(
+        '',
+        config=True,
+        help="The Quetz server to use for solving, if this is a different server than 'quetzUrl'",
+    )
+
+    companions = Dict(
+        {},
+        config=True,
+        help="{'package name': 'semver specification'} - pre and post releases not supported",
+    )
+
+    from_history = Bool(
+        False,
+        config=True,
+        help="Use --from-history or not for `conda env export`",
+    )
+
+    types = Dict(
+        {
+            "Python 3": ["python=3", "ipykernel"],
+            "R": ["r-base", "r-essentials"]
+        },
+        config=True,
+        help="Type of environment available when creating it from scratch.",
+    )
+
+    white_list = Bool(
+        False,
+        config=True,
+        help="Show only environment corresponding to whitelisted kernels",
+    )
+
+    aliases = dict(base_aliases)
+    aliases.update({
+        'quetz_url': 'MambaNavigator.quetz_url',
+        'quetz_solver_url': 'MambaNavigator.quetz_solver_url',
+        'companions': 'MambaNavigator.companions',
+        'from_history': 'MambaNavigator.from_history',
+        'types': 'MambaNavigator.types',
+        'white_list': 'MambaNavigator.white_list'
+    })
+
     def initialize_handlers(self):
-        self.handlers.append(("/gator", MambaNavigatorHandler))
+        self.handlers.append(("/gator", MambaNavigatorHandler, dict(
+            extra_settings=dict(
+                quetzUrl=self.quetz_url,
+                quetzSolverUrl=self.quetz_solver_url,
+                companions=self.companions,
+                fromHistory=self.from_history,
+                types=self.types,
+                whiteList=self.white_list
+            ))))
         super().initialize_handlers()
 
     def start(self):
diff --git a/packages/common/package.json b/packages/common/package.json
index 131588df..7bc2ba4d 100644
--- a/packages/common/package.json
+++ b/packages/common/package.json
@@ -48,6 +48,8 @@
     "@lumino/coreutils": "^1.5.3",
     "@lumino/signaling": "^1.4.3",
     "@lumino/widgets": "^1.16.1",
+    "codemirror": "^5.60.0",
+    "codemirror-show-hint": "^5.58.3",
     "jupyterlab_toastify": "^4.1.3",
     "d3": "^5.5.0",
     "react-d3-graph": "^2.5.0",
@@ -60,6 +62,7 @@
     "@babel/core": "^7.0.0",
     "@babel/preset-env": "^7.0.0",
     "@jupyterlab/testutils": "^3.0.0",
+    "@types/codemirror": "^0.0.108",
     "@types/jest": "^26.0.0",
     "@types/react": "^17.0.0",
     "@types/react-d3-graph": "^2.3.4",
diff --git a/packages/common/src/components/CondaEnvList.tsx b/packages/common/src/components/CondaEnvList.tsx
index 4c651f4e..b84edfdc 100644
--- a/packages/common/src/components/CondaEnvList.tsx
+++ b/packages/common/src/components/CondaEnvList.tsx
@@ -55,6 +55,10 @@ export interface IEnvListProps {
    * Environment remove handler
    */
   onRemove(): void;
+  /**
+   * Environment solve handler
+   */
+  onSolve?: (() => void) | false;
 }
 
 /**
@@ -92,6 +96,7 @@ export const CondaEnvList: React.FunctionComponent<IEnvListProps> = (
         onExport={props.onExport}
         onRefresh={props.onRefresh}
         onRemove={props.onRemove}
+        onSolve={props.onSolve}
       />
       <div
         id={CONDA_ENVIRONMENT_PANEL_ID}
diff --git a/packages/common/src/components/CondaEnvSolve.tsx b/packages/common/src/components/CondaEnvSolve.tsx
new file mode 100644
index 00000000..956d4a5b
--- /dev/null
+++ b/packages/common/src/components/CondaEnvSolve.tsx
@@ -0,0 +1,192 @@
+import * as React from 'react';
+import CodeMirror, { Editor } from 'codemirror';
+import 'codemirror/lib/codemirror.css';
+import './yaml';
+import * as condaHint from './CondaHint';
+import { IEnvironmentManager } from '../tokens';
+import { INotification } from 'jupyterlab_toastify';
+
+/**
+ * Conda solve properties
+ */
+export interface ICondaEnvSolveProps {
+  /**
+   *  The URL of the Quetz server
+   */
+  quetzUrl: string;
+  /**
+   *  The URL of the Quetz server with the solver plugin, if different from quetzUrl
+   */
+  quetzSolverUrl: string;
+  /**
+   * The Conda subdir (or platform e.g. osx-64, linux-32) of the backend
+   */
+  subdir: string;
+  /**
+   * The initial content of the editors text area
+   */
+  content?: string;
+  /**
+   * Should the channel name be expanded to the channel URL in the editors text area
+   */
+  expandChannelUrl?: boolean;
+  /**
+   *  Callback to get notified of changes to the editors text area
+   */
+  onContentChange?(content: string): void;
+}
+
+export function CondaEnvSolve(props: ICondaEnvSolveProps): JSX.Element {
+  condaHint.register(props.quetzUrl, props.expandChannelUrl);
+  const codemirrorElem = React.useRef(null);
+
+  const [editor, setEditor] = React.useState(null);
+
+  React.useEffect(() => {
+    if (editor) {
+      if (props.content !== undefined && props.content !== editor.getValue()) {
+        editor.setValue(props.content);
+        editor.refresh();
+      }
+      return;
+    }
+    const newEditor = CodeMirror(codemirrorElem.current, {
+      value: props.content || '',
+      lineNumbers: true,
+      extraKeys: {
+        'Ctrl-Space': 'autocomplete',
+        'Ctrl-Tab': 'autocomplete'
+      },
+      tabSize: 2,
+      mode: 'yaml',
+      autofocus: true
+    });
+    if (props.onContentChange) {
+      newEditor.on('change', (instance: Editor) =>
+        props.onContentChange(instance.getValue())
+      );
+    }
+    setEditor(newEditor);
+
+    /* Apply lab styles to this codemirror instance */
+    codemirrorElem.current.childNodes[0].classList.add('cm-s-jupyter');
+  });
+  return (
+    <div
+      ref={codemirrorElem}
+      className="conda-complete-panel"
+      onMouseEnter={() => editor && editor.refresh()}
+    />
+  );
+}
+
+/**
+ * Solve the environment provided in environment_yml on the Quetz server and create it on the
+ * backend.
+ *
+ * @param environment_yml - The environment.yml content
+ * @param environmentManager - The Conda environment manager
+ * @param expandChannelUrl - The environment_yml contains channel names that should be expanded to
+ *  channel URLS
+ * @param onMessage - Callback to provide feedback about the process
+ */
+export async function solveAndCreateEnvironment(
+  environment_yml: string,
+  environmentManager: IEnvironmentManager,
+  expandChannelUrl: boolean,
+  onMessage?: (msg: string) => void
+): Promise<void> {
+  const name = condaHint.getName(environment_yml);
+  const { quetzUrl, quetzSolverUrl, subdir } = environmentManager;
+
+  let message = 'Solving environment...';
+  onMessage && onMessage(message);
+  let toastId = await INotification.inProgress(message);
+  try {
+    const explicitList = await condaHint.fetchSolve(
+      quetzUrl,
+      quetzSolverUrl,
+      (await subdir()).subdir,
+      environment_yml,
+      expandChannelUrl
+    );
+    await INotification.update({
+      toastId,
+      message: 'Environment has been solved.',
+      type: 'success',
+      autoClose: 5000
+    });
+
+    message = `creating environment ${name}...`;
+    onMessage && onMessage(message);
+    toastId = await INotification.inProgress(message);
+    await environmentManager.import(name, explicitList);
+
+    message = `Environment ${name} created.`;
+    onMessage && onMessage(message);
+    await INotification.update({
+      toastId,
+      message,
+      type: 'success',
+      autoClose: 5000
+    });
+  } catch (error) {
+    onMessage && onMessage(error.message);
+    if (toastId) {
+      await INotification.update({
+        toastId,
+        message: error.message,
+        type: 'error',
+        autoClose: 0
+      });
+    }
+  }
+}
+
+export interface ICondaEnvSolveDialogProps {
+  /**
+   * The Conda subdir (or platform e.g. osx-64, linux-32) of the backend
+   */
+  subdir: string;
+  /**
+   * The Conda environment manager
+   */
+  environmentManager: IEnvironmentManager;
+}
+
+export function CondaEnvSolveDialog(
+  props: ICondaEnvSolveDialogProps
+): JSX.Element {
+  const [environment_yml, setEnvironment_yml] = React.useState('');
+  const [solveState, setSolveState] = React.useState(null);
+
+  return (
+    <div className="condaCompleteDialog__panel">
+      <div style={{ flexGrow: 1 }}>
+        <CondaEnvSolve
+          expandChannelUrl={false}
+          subdir={props.subdir}
+          quetzUrl={props.environmentManager.quetzUrl}
+          quetzSolverUrl={props.environmentManager.quetzSolverUrl}
+          onContentChange={setEnvironment_yml}
+        />
+      </div>
+      <div style={{ padding: '12px' }}>
+        <button
+          onClick={() =>
+            solveAndCreateEnvironment(
+              environment_yml,
+              props.environmentManager,
+              true,
+              setSolveState
+            )
+          }
+          className="jp-Dialog-button jp-mod-accept jp-mod-styled"
+        >
+          Create
+        </button>
+        <span style={{ marginLeft: '12px' }}>{solveState}</span>
+      </div>
+    </div>
+  );
+}
diff --git a/packages/common/src/components/CondaEnvToolBar.tsx b/packages/common/src/components/CondaEnvToolBar.tsx
index 061e3100..3ff5a1dd 100644
--- a/packages/common/src/components/CondaEnvToolBar.tsx
+++ b/packages/common/src/components/CondaEnvToolBar.tsx
@@ -4,6 +4,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { ToolbarButtonComponent } from '@jupyterlab/apputils';
 import {
   addIcon,
+  buildIcon,
   Button,
   closeIcon,
   downloadIcon,
@@ -52,6 +53,10 @@ export interface ICondaEnvToolBarProps {
    * Remove environment handler
    */
   onRemove(): void;
+  /**
+   * Solve environment handler
+   */
+  onSolve?: (() => void) | false;
 }
 
 export const CondaEnvToolBar = (props: ICondaEnvToolBarProps): JSX.Element => {
@@ -80,6 +85,13 @@ export const CondaEnvToolBar = (props: ICondaEnvToolBarProps): JSX.Element => {
           tooltip="Create"
           onClick={props.onCreate}
         />
+        {props.onSolve && (
+          <ToolbarButtonComponent
+            icon={buildIcon}
+            tooltip="Solve new"
+            onClick={props.onSolve}
+          />
+        )}
         <Button
           className="jp-ToolbarButtonComponent"
           disabled={props.isBase}
diff --git a/packages/common/src/components/CondaHint.ts b/packages/common/src/components/CondaHint.ts
new file mode 100644
index 00000000..4acb6e54
--- /dev/null
+++ b/packages/common/src/components/CondaHint.ts
@@ -0,0 +1,356 @@
+import CodeMirror, { Editor } from 'codemirror';
+import 'codemirror/addon/hint/show-hint';
+import 'codemirror/addon/hint/show-hint.css';
+
+function getChannels(environment_yml: string) {
+  const matches = [
+    ...environment_yml.matchAll(/^channels:\s*\n((?:\s+- \S+\s*\n)+)\S/gm)
+  ];
+  if (!matches[0] || matches[0].length < 2) {
+    return;
+  }
+  const channels = matches[0][1];
+  if (!channels) {
+    return;
+  }
+  return channels
+    .split('\n')
+    .filter(x => x)
+    .map(line => line.match(/\s+- (.+)\s*/)[1]);
+}
+
+function getDependencies(environment_yml: string) {
+  const matches = [
+    ...environment_yml.matchAll(/^dependencies:\s*\n((?:\s+- .*(\n|$))+)/gm)
+  ];
+  if (!matches[0] || matches[0].length < 2) {
+    return;
+  }
+  const dependencies = matches[0][1];
+  if (!dependencies) {
+    return;
+  }
+  return dependencies
+    .split('\n')
+    .filter(x => x)
+    .map(line => line.match(/\s+- (.+)/)[1]);
+}
+
+/**
+ * Gets the name of the environment from environment_yml.
+ *
+ * @param environment_yml - The content of environment.yml
+ */
+export function getName(environment_yml: string): string | null {
+  const matches = [...environment_yml.matchAll(/^name:\s*(.*?)\s*(?:\n|$)/gm)];
+  if (!matches[0] || matches[0].length < 2) {
+    return;
+  }
+  return matches[0][1];
+}
+
+async function loadChannels(quetzUrl: string): Promise<string[]> {
+  const response = await fetch(`${quetzUrl}/api/channels`);
+  if (response.status !== 200) {
+    throw new Error(`Unexpected status code: ${response.status}`);
+  }
+  const data: { name: string }[] = await response.json();
+  return data.map(channel => channel.name);
+}
+
+type PackageList = { result: { name: string; summary: string }[] };
+
+async function loadPackages(
+  quetzUrl: string,
+  channel: string,
+  q: string
+): Promise<PackageList> {
+  const response = await fetch(
+    `${quetzUrl}/api/paginated/channels/${channel}/packages?limit=20${
+      q ? `&q=${q}` : ''
+    }`
+  );
+  if (response.status !== 200) {
+    throw new Error(`Unexpected status code: ${response.status}`);
+  }
+  return response.json();
+}
+
+async function loadPackagesOfChannels(
+  quetzUrl: string,
+  channels: string[],
+  q: string
+) {
+  const data: PackageList[] = await Promise.all(
+    channels.map(channel => loadPackages(quetzUrl, channel, q))
+  );
+  const mapping = data
+    .map((d, i) =>
+      d.result.map(packageInfo => ({ ...packageInfo, channel: channels[i] }))
+    )
+    .flat();
+  return mapping;
+}
+
+async function loadVersions(
+  quetzUrl: string,
+  channel: string,
+  packageName: string
+) {
+  const url = `${quetzUrl}/api/channels/${channel}/packages/${packageName}/versions`;
+  const response = await fetch(url);
+  if (response.status === 404) {
+    return [];
+  }
+  if (response.status === 200) {
+    return response.json();
+  }
+  throw new Error(`Unexpected status code: ${response.status}`);
+}
+
+async function loadVersionsOfChannels(
+  quetzUrl: string,
+  channels: string[],
+  packageName: string,
+  q: string
+) {
+  const data: { version: string }[][] = await Promise.all(
+    channels.map(channel => loadVersions(quetzUrl, channel, packageName))
+  );
+  const seen: any = {};
+  const mapping = data
+    .map((d, i) => d.map(version => version.version))
+    .flat()
+    .filter(e => !q || e.startsWith(q))
+    .filter(e => (seen[e] ? false : (seen[e] = true)));
+  return mapping;
+}
+
+/**
+ * Registers the autocompletion hints for Conda environment files
+ *
+ * @param quetzUrl - The URL of the Quetz server
+ * @param expandChannelUrl - Should channel names be expanded to channel URLs in the editors text
+ *   area?
+ */
+export function register(quetzUrl: string, expandChannelUrl = false): void {
+  const condaHint = async (editor: Editor, callback: any, options: any) => {
+    const topLevel = [
+      {
+        displayText: 'name',
+        text: 'name: '
+      },
+      {
+        displayText: 'channels',
+        text: 'channels:\n\t- '
+      },
+      {
+        displayText: 'dependencies',
+        text: 'dependencies:\n\t- '
+      }
+    ];
+
+    const cur = editor.getCursor();
+    const curLine = editor.getLine(cur.line);
+
+    let list = [];
+    let start = 0;
+
+    if (!curLine.startsWith(' ') && !curLine.startsWith('\t')) {
+      list = topLevel.filter(e => e.displayText.startsWith(curLine));
+      callback({
+        list: list,
+        from: CodeMirror.Pos(cur.line, start),
+        to: CodeMirror.Pos(cur.line, cur.ch)
+      });
+      return;
+    }
+
+    let top = undefined;
+    let lineNr = cur.line;
+    do {
+      lineNr -= 1;
+      top = editor.getLine(lineNr);
+    } while (top !== undefined && !top.match(/^\S/));
+
+    const wrapErrorMsg = (errorMsg: string) => [
+      { displayText: errorMsg, text: '' },
+      ''
+    ];
+
+    if (top === 'channels:') {
+      const re = /^(\s+- )(.*)/;
+      const groups = curLine.match(re);
+      if (groups && groups.length > 1) {
+        const [, pre, name] = groups;
+        start = pre.length;
+        try {
+          list = (await loadChannels(quetzUrl))
+            .filter(channel => channel.startsWith(name || ''))
+            .map(channel => ({
+              displayText: channel,
+              text: expandChannelUrl ? `${quetzUrl}/get/${channel}` : channel
+            }));
+        } catch (e) {
+          console.error(e);
+          list = wrapErrorMsg('Loading of channels failed');
+        }
+
+        callback({
+          list: list,
+          from: CodeMirror.Pos(cur.line, start),
+          to: CodeMirror.Pos(cur.line, cur.ch)
+        });
+      }
+      return;
+    }
+
+    if (top === 'dependencies:') {
+      const re = /^(?<pre>\s+- )(?<packageName>.+?)?(?<comp1>$|[\s>=<]+)(?<version1>.*?)?(?<comp2>$|[\s,>=<]+)(?<version2>.+?)?($|\s*$)/g;
+
+      const groups = [...curLine.matchAll(re)];
+
+      if (groups && groups.length > 0) {
+        const {
+          pre,
+          packageName,
+          comp1,
+          version1,
+          comp2,
+          version2
+        } = groups[0].groups;
+
+        const matchLengths = [
+          pre,
+          packageName,
+          comp1,
+          version1,
+          comp2,
+          version2
+        ]
+          .map(e => (e !== undefined ? e.length : 0))
+          .reduce(
+            (list, e) =>
+              list.length ? [...list, list[list.length - 1] + e] : [e],
+            [] as number[]
+          );
+
+        const [
+          preEnd,
+          packageEnd,
+          comp1End,
+          version1End,
+          comp2End,
+          version2End
+        ] = matchLengths;
+
+        const channels = getChannels(editor.getValue()).map(channel =>
+          expandChannelUrl ? channel.slice(quetzUrl.length + 5) : channel
+        );
+
+        const loadVersions = async (query: string) => {
+          try {
+            return await loadVersionsOfChannels(
+              quetzUrl,
+              channels,
+              packageName,
+              query
+            );
+          } catch (e) {
+            console.error(e);
+            return wrapErrorMsg('Loading of versions failed');
+          }
+        };
+
+        if (
+          cur.ch >= preEnd &&
+          (!packageEnd || cur.ch <= packageEnd) /* package */
+        ) {
+          const packagePart = packageName
+            ? packageName.slice(0, cur.ch - preEnd)
+            : undefined;
+
+          try {
+            list = (
+              await loadPackagesOfChannels(quetzUrl, channels, packagePart)
+            ).map(p => ({
+              displayText: `${p.name} [${p.channel}] ${p.summary}`,
+              text: `${p.name}`
+            }));
+          } catch (e) {
+            console.error(e);
+            list = wrapErrorMsg('Loading of packages failed');
+          }
+
+          callback({
+            list: list,
+            from: CodeMirror.Pos(cur.line, preEnd),
+            to: CodeMirror.Pos(cur.line, packageName ? packageEnd : preEnd)
+          });
+        } else if (
+          cur.ch >= comp1End &&
+          (!version1End || cur.ch <= version1End) /* version1 */
+        ) {
+          list = await loadVersions(version1);
+          callback({
+            list: list,
+            from: CodeMirror.Pos(cur.line, comp1End),
+            to: CodeMirror.Pos(cur.line, version1 ? version1End : comp1End)
+          });
+        } else if (
+          cur.ch >= comp2End &&
+          (!version2End || cur.ch <= version2End) /* version2 */
+        ) {
+          list = await loadVersions(version2);
+          callback({
+            list: list,
+            from: CodeMirror.Pos(cur.line, comp2End),
+            to: CodeMirror.Pos(cur.line, version2 ? version2End : comp2End)
+          });
+        }
+      }
+    }
+  };
+  condaHint.async = true;
+  CodeMirror.registerHelper('hint', 'yaml', condaHint);
+}
+
+/**
+ * Fetches the solved environment from the Quetz server
+ *
+ * @param quetzUrl - The URL of the Quetz server
+ * @param quetzSolverUrl - The URL of the Quetz server with the solver plugin
+ * @param subdir - The Conda subdir (or platform e.g. osx-64, linux-32)
+ * @param environment_yml - The environment.yml content
+ * @param expandChannelUrl - The environment_yml contains channel names that should be expanded to
+ *  channel URLS
+ */
+export async function fetchSolve(
+  quetzUrl: string,
+  quetzSolverUrl: string,
+  subdir: string,
+  environment_yml: string,
+  expandChannelUrl = true
+): Promise<string> {
+  const data = {
+    subdir,
+    channels: expandChannelUrl
+      ? getChannels(environment_yml).map(
+          channel => `${quetzUrl}/get/${channel}`
+        )
+      : getChannels(environment_yml),
+    spec: getDependencies(environment_yml)
+  };
+  const response = await fetch(
+    `${quetzSolverUrl || quetzUrl}/api/mamba/solve`,
+    {
+      method: 'POST',
+      body: JSON.stringify(data)
+    }
+  );
+  if (response.status === 200) {
+    return response.text();
+  } else {
+    throw Error(`error [${response.status}]`);
+  }
+}
diff --git a/packages/common/src/components/NbConda.tsx b/packages/common/src/components/NbConda.tsx
index 8848b653..a945507b 100644
--- a/packages/common/src/components/NbConda.tsx
+++ b/packages/common/src/components/NbConda.tsx
@@ -6,6 +6,7 @@ import { style } from 'typestyle';
 import { Conda, IEnvironmentManager } from '../tokens';
 import { CondaEnvList, ENVIRONMENT_PANEL_WIDTH } from './CondaEnvList';
 import { CondaPkgPanel } from './CondaPkgPanel';
+import { CondaEnvSolveDialog } from './CondaEnvSolve';
 
 /**
  * Jupyter Conda Component properties
@@ -47,6 +48,13 @@ export interface ICondaEnvState {
   isLoading: boolean;
 }
 
+class NonKeypressStealingDialog<T> extends Dialog<T> {
+  protected onAfterAttach(msg: any) {
+    super.onAfterAttach(msg);
+    this.node.removeEventListener('keydown', this, true);
+  }
+}
+
 /** Top level React component for Jupyter Conda Manager */
 export class NbConda extends React.Component<ICondaEnvProps, ICondaEnvState> {
   constructor(props: ICondaEnvProps) {
@@ -65,6 +73,7 @@ export class NbConda extends React.Component<ICondaEnvProps, ICondaEnvState> {
     this.handleExportEnvironment = this.handleExportEnvironment.bind(this);
     this.handleRefreshEnvironment = this.handleRefreshEnvironment.bind(this);
     this.handleRemoveEnvironment = this.handleRemoveEnvironment.bind(this);
+    this.handleSolveEnvironment = this.handleSolveEnvironment.bind(this);
   }
 
   async handleEnvironmentChange(name: string): Promise<void> {
@@ -355,6 +364,24 @@ export class NbConda extends React.Component<ICondaEnvProps, ICondaEnvState> {
     }
   }
 
+  async handleSolveEnvironment(): Promise<void> {
+    const { subdir } = await this.props.model.subdir();
+    const dialog = new NonKeypressStealingDialog({
+      title: 'Solve Environment',
+      body: (
+        <div className="condaCompleteDialog">
+          <CondaEnvSolveDialog
+            subdir={subdir}
+            environmentManager={this.props.model}
+          />
+        </div>
+      ),
+      buttons: [Dialog.okButton()]
+    });
+
+    await dialog.launch();
+  }
+
   async loadEnvironments(): Promise<void> {
     if (!this.state.isLoading) {
       this.setState({ isLoading: true });
@@ -402,6 +429,7 @@ export class NbConda extends React.Component<ICondaEnvProps, ICondaEnvState> {
           onExport={this.handleExportEnvironment}
           onRefresh={this.handleRefreshEnvironment}
           onRemove={this.handleRemoveEnvironment}
+          onSolve={this.props.model.quetzUrl && this.handleSolveEnvironment}
         />
         <CondaPkgPanel
           height={this.props.height}
diff --git a/packages/common/src/components/yaml.js b/packages/common/src/components/yaml.js
new file mode 100644
index 00000000..2760b2f9
--- /dev/null
+++ b/packages/common/src/components/yaml.js
@@ -0,0 +1,137 @@
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+import CodeMirror from 'codemirror';
+
+CodeMirror.defineMode('yaml', function () {
+  var cons = ['true', 'false', 'on', 'off', 'yes', 'no'];
+  var keywordRegex = new RegExp('\\b((' + cons.join(')|(') + '))$', 'i');
+
+  return {
+    token: function (stream, state) {
+      var ch = stream.peek();
+      var esc = state.escaped;
+      state.escaped = false;
+      /* comments */
+      if (
+        ch == '#' &&
+        (stream.pos == 0 || /\s/.test(stream.string.charAt(stream.pos - 1)))
+      ) {
+        stream.skipToEnd();
+        return 'comment';
+      }
+
+      if (stream.match(/^('([^']|\\.)*'?|"([^"]|\\.)*"?)/)) return 'string';
+
+      if (state.literal && stream.indentation() > state.keyCol) {
+        stream.skipToEnd();
+        return 'string';
+      } else if (state.literal) {
+        state.literal = false;
+      }
+      if (stream.sol()) {
+        state.keyCol = 0;
+        state.pair = false;
+        state.pairStart = false;
+        /* document start */
+        if (stream.match('---')) {
+          return 'def';
+        }
+        /* document end */
+        if (stream.match('...')) {
+          return 'def';
+        }
+        /* array list item */
+        if (stream.match(/\s*-\s+/)) {
+          return 'meta';
+        }
+      }
+      /* inline pairs/lists */
+      if (stream.match(/^(\{|\}|\[|\])/)) {
+        if (ch == '{') state.inlinePairs++;
+        else if (ch == '}') state.inlinePairs--;
+        else if (ch == '[') state.inlineList++;
+        else state.inlineList--;
+        return 'meta';
+      }
+
+      /* list separator */
+      if (state.inlineList > 0 && !esc && ch == ',') {
+        stream.next();
+        return 'meta';
+      }
+      /* pairs separator */
+      if (state.inlinePairs > 0 && !esc && ch == ',') {
+        state.keyCol = 0;
+        state.pair = false;
+        state.pairStart = false;
+        stream.next();
+        return 'meta';
+      }
+
+      /* start of value of a pair */
+      if (state.pairStart) {
+        /* block literals */
+        if (stream.match(/^\s*(\||\>)\s*/)) {
+          state.literal = true;
+          return 'meta';
+        }
+        /* references */
+        if (stream.match(/^\s*(\&|\*)[a-z0-9\._-]+\b/i)) {
+          return 'variable-2';
+        }
+        /* numbers */
+        if (state.inlinePairs == 0 && stream.match(/^\s*-?[0-9\.\,]+\s?$/)) {
+          return 'number';
+        }
+        if (
+          state.inlinePairs > 0 &&
+          stream.match(/^\s*-?[0-9\.\,]+\s?(?=(,|}))/)
+        ) {
+          return 'number';
+        }
+        /* keywords */
+        if (stream.match(keywordRegex)) {
+          return 'keyword';
+        }
+      }
+
+      /* pairs (associative arrays) -> key */
+      if (
+        !state.pair &&
+        stream.match(
+          /^\s*(?:[,\[\]{}&*!|>'"%@`][^\s'":]|[^,\[\]{}#&*!|>'"%@`])[^#]*?(?=\s*:($|\s))/
+        )
+      ) {
+        state.pair = true;
+        state.keyCol = stream.indentation();
+        return 'atom';
+      }
+      if (state.pair && stream.match(/^:\s*/)) {
+        state.pairStart = true;
+        return 'meta';
+      }
+
+      /* nothing found, continue */
+      state.pairStart = false;
+      state.escaped = ch == '\\';
+      stream.next();
+      return null;
+    },
+    startState: function () {
+      return {
+        pair: false,
+        pairStart: false,
+        keyCol: 0,
+        inlinePairs: 0,
+        inlineList: 0,
+        literal: false,
+        escaped: false
+      };
+    },
+    lineComment: '#',
+    fold: 'indent'
+  };
+});
+
+CodeMirror.defineMIME('text/x-yaml', 'yaml');
+CodeMirror.defineMIME('text/yaml', 'yaml');
diff --git a/packages/common/src/services.ts b/packages/common/src/services.ts
index adc7e73f..0431f743 100644
--- a/packages/common/src/services.ts
+++ b/packages/common/src/services.ts
@@ -1,4 +1,4 @@
-import { URLExt } from '@jupyterlab/coreutils';
+import { PageConfig, URLExt } from '@jupyterlab/coreutils';
 import { ServerConnection } from '@jupyterlab/services';
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 import { JSONObject, PromiseDelegate } from '@lumino/coreutils';
@@ -74,7 +74,6 @@ export interface ICancellableAction {
 export class CondaEnvironments implements IEnvironmentManager {
   constructor(settings?: ISettingRegistry.ISettings) {
     this._environments = new Array<Conda.IEnvironment>();
-
     if (settings) {
       this._updateSettings(settings);
       settings.changed.connect(this._updateSettings, this);
@@ -138,6 +137,20 @@ export class CondaEnvironments implements IEnvironmentManager {
     return Object.keys(this._environmentTypes);
   }
 
+  /**
+   * Get the Quetz URL
+   */
+  get quetzUrl(): string {
+    return this._quetzUrl;
+  }
+
+  /**
+   * Get the Quetz solver URL
+   */
+  get quetzSolverUrl(): string {
+    return this._quetzSolverUrl;
+  }
+
   /**
    * Load user settings
    *
@@ -147,6 +160,8 @@ export class CondaEnvironments implements IEnvironmentManager {
     this._environmentTypes = settings.get('types').composite as IType;
     this._fromHistory = settings.get('fromHistory').composite as boolean;
     this._whitelist = settings.get('whitelist').composite as boolean;
+    this._quetzUrl = settings.get('quetzUrl').composite as string;
+    this._quetzSolverUrl = settings.get('quetzSolverUrl').composite as string;
   }
 
   /**
@@ -398,6 +413,24 @@ export class CondaEnvironments implements IEnvironmentManager {
     }
   }
 
+  /**
+   * Requests the subdir (platform) from the backend
+   *
+   * @returns A Promise with the subdir
+   */
+  async subdir(): Promise<{ subdir: string }> {
+    const { promise } = Private.requestServer(
+      URLExt.join('conda', 'subdir'),
+      {}
+    );
+    const response = await promise;
+    if (response.ok) {
+      return response.json();
+    } else {
+      throw new Error('Error getting subdir');
+    }
+  }
+
   // Resolve promise to disconnect signals at disposal
   private _clean: () => void = () => {
     return;
@@ -409,13 +442,18 @@ export class CondaEnvironments implements IEnvironmentManager {
   >(this);
   private _environments: Array<Conda.IEnvironment>;
   private _environmentsTimer = -1;
-  private _environmentTypes: IType = {
+  private _environmentTypes: IType = (PageConfig.getOption('types') &&
+    JSON.parse(PageConfig.getOption('types'))) || {
     python3: ['python=3', 'ipykernel'],
     r: ['r-base', 'r-essentials']
   };
-  private _fromHistory = false;
+  private _fromHistory =
+    PageConfig.getOption('fromHistory').toLowerCase() === 'true';
   private _packageManager = new CondaPackage();
-  private _whitelist = false;
+  private _whitelist =
+    PageConfig.getOption('whitelist').toLowerCase() === 'true';
+  private _quetzUrl = PageConfig.getOption('quetzUrl');
+  private _quetzSolverUrl = PageConfig.getOption('quetzSolverUrl');
 }
 
 export class CondaPackage implements Conda.IPackageManager {
diff --git a/packages/common/src/tokens.ts b/packages/common/src/tokens.ts
index febf18ed..b094b757 100644
--- a/packages/common/src/tokens.ts
+++ b/packages/common/src/tokens.ts
@@ -18,6 +18,17 @@ export interface IEnvironmentManager extends IDisposable {
    * Get the list of user-defined environment types
    */
   environmentTypes: string[];
+
+  /**
+   * Get the Quetz URL
+   */
+  quetzUrl: string;
+
+  /**
+   * Get the Quetz solver URL
+   */
+  quetzSolverUrl: string;
+
   /**
    * Get all packages channels available in the requested environment
    *
@@ -60,8 +71,9 @@ export interface IEnvironmentManager extends IDisposable {
    *
    * @param name name of the environment to create
    * @param fileContent file content of the file containing the packages list to import
+   * @param filename name of the file in which the content will be written
    */
-  import(name: string, fileContent: string, fileName: string): Promise<void>;
+  import(name: string, fileContent: string, fileName?: string): Promise<void>;
   /**
    * Create an environment from a packages list file
    *
@@ -76,6 +88,10 @@ export interface IEnvironmentManager extends IDisposable {
    * @param name name of the environment to be removed
    */
   remove(name: string): Promise<void>;
+  /**
+   * Get the conda-subdir of the server
+   */
+  subdir(): Promise<{ subdir: string }>;
 }
 
 export namespace Conda {
diff --git a/packages/common/style/index.css b/packages/common/style/index.css
index b73823ec..c4766ea2 100644
--- a/packages/common/style/index.css
+++ b/packages/common/style/index.css
@@ -63,3 +63,55 @@
 button.jp-button-hide {
   display: none;
 }
+
+body > ul.CodeMirror-hints {
+  z-index: 10001;
+  box-shadow: var(--jp-elevation-z6);
+  background: var(--jp-layout-color1);
+  color: var(--jp-content-font-color1);
+  border: var(--jp-border-width) solid var(--jp-border-color1);
+}
+
+.CodeMirror-hints .CodeMirror-hint {
+  color: var(--jp-content-font-color1);
+}
+.CodeMirror-hints .CodeMirror-hint-active {
+  background-color: var(--jp-brand-color1);
+  color: white;
+}
+
+.conda-complete-panel {
+  height: 100%;
+  display: flex;
+}
+
+.conda-complete-panel > div {
+  display: flex;
+  flex: 1;
+}
+
+.conda-complete-panel .CodeMirror {
+  height: unset;
+  flex: 1;
+}
+
+.conda-complete-panel .CodeMirror-scroll {
+  width: 100%;
+}
+
+.condaCompleteSettings > span {
+  padding: 0 12px;
+  color: var(--jp-content-font-color2);
+}
+
+.condaCompleteDialog {
+  height: 300px;
+  width: 80vw;
+  max-width: 800px;
+}
+
+.condaCompleteDialog__panel {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
diff --git a/packages/common/tsconfig.json b/packages/common/tsconfig.json
index e481ac7c..c7ffbe6d 100644
--- a/packages/common/tsconfig.json
+++ b/packages/common/tsconfig.json
@@ -4,8 +4,9 @@
     "outDir": "lib",
     "rootDir": "src",
     "sourceRoot": "./@mamba-org/gator-common/src",
-    "types": ["jest"]
+    "types": ["jest"],
+    "allowJs": true
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.js"],
   "exclude": ["src/**/*.spec.*"]
 }
diff --git a/packages/labextension/package.json b/packages/labextension/package.json
index 48fc47b7..52091fec 100644
--- a/packages/labextension/package.json
+++ b/packages/labextension/package.json
@@ -62,6 +62,7 @@
     "@jupyterlab/builder": "^3.0.1",
     "@jupyterlab/testutils": "^3.0.0",
     "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.8",
     "@types/semver": "^7.3.1",
     "react": "^17.0.0",
     "react-dom": "^17.0.0"
@@ -91,4 +92,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/labextension/schema/plugin.json b/packages/labextension/schema/plugin.json
index 44dec89d..a6afd58d 100644
--- a/packages/labextension/schema/plugin.json
+++ b/packages/labextension/schema/plugin.json
@@ -45,6 +45,18 @@
       "title": "Only kernel whitelist",
       "description": "Show only environment corresponding to whitelisted kernels",
       "default": false
+    },
+    "quetzUrl": {
+      "type": "string",
+      "title": "Quetz package server",
+      "description": "The Quetz server to use for creating new environments",
+      "default": ""
+    },
+    "quetzSolverUrl": {
+      "type": "string",
+      "title": "Quetz solver server",
+      "description": "The Quetz server to use for solving, if this is a different server than 'quetzUrl'",
+      "default": ""
     }
   },
   "additionalProperties": false,
diff --git a/packages/labextension/src/CondaCompleteEditor.tsx b/packages/labextension/src/CondaCompleteEditor.tsx
new file mode 100644
index 00000000..5e767c1b
--- /dev/null
+++ b/packages/labextension/src/CondaCompleteEditor.tsx
@@ -0,0 +1,225 @@
+import { Widget } from '@lumino/widgets';
+import {
+  ABCWidgetFactory,
+  DocumentRegistry,
+  DocumentWidget
+} from '@jupyterlab/docregistry';
+import {
+  IWidgetTracker,
+  ReactWidget,
+  WidgetTracker,
+  addToolbarButtonClass,
+  ToolbarButtonComponent,
+  Toolbar
+} from '@jupyterlab/apputils';
+import { Token } from '@lumino/coreutils';
+import {
+  ILayoutRestorer,
+  JupyterFrontEnd,
+  JupyterFrontEndPlugin
+} from '@jupyterlab/application';
+
+import { condaIcon, IEnvironmentManager } from '@mamba-org/gator-common';
+
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import {
+  CondaEnvSolve,
+  solveAndCreateEnvironment
+} from '@mamba-org/gator-common/lib/components/CondaEnvSolve';
+import { Signal } from '@lumino/signaling';
+import { runIcon, saveIcon } from '@jupyterlab/ui-components';
+
+class CondaCompleteWidget extends Widget {
+  constructor(
+    environmentManager: IEnvironmentManager,
+    readonly context: DocumentRegistry.Context
+  ) {
+    super();
+
+    const subdirPromise = environmentManager.subdir();
+
+    (async () => {
+      await context.ready;
+      const { subdir } = await subdirPromise;
+
+      const renderCondaEnvSolve = () => {
+        ReactDOM.render(
+          <CondaEnvSolve
+            subdir={subdir}
+            quetzUrl={environmentManager.quetzUrl}
+            quetzSolverUrl={environmentManager.quetzSolverUrl}
+            content={context.model.toString()}
+            expandChannelUrl={true}
+            onContentChange={(content: string) => {
+              if (content !== context.model.toString()) {
+                context.model.fromString(content);
+                context.model.dirty = true;
+              }
+            }}
+          />,
+          this.node
+        );
+      };
+
+      renderCondaEnvSolve();
+      context.model.contentChanged.connect(renderCondaEnvSolve);
+    })();
+  }
+
+  dispose(): void {
+    Signal.clearData(this);
+    super.dispose();
+  }
+}
+
+class CondaCompleteFactory extends ABCWidgetFactory<
+  DocumentWidget<CondaCompleteWidget>
+> {
+  constructor(
+    readonly options: CondaCompleteFactory.ICondaCompleteFactoryOptions
+  ) {
+    super(options);
+  }
+
+  protected defaultToolbarFactory(
+    widget: CondaCompleteWidget
+  ): DocumentRegistry.IToolbarItem[] {
+    const { quetzUrl, quetzSolverUrl } = this.options.environmentManager;
+    return [
+      {
+        name: 'save',
+        widget: addToolbarButtonClass(
+          ReactWidget.create(
+            <ToolbarButtonComponent
+              icon={saveIcon}
+              onClick={() => {
+                console.log('save', widget.context.save);
+                widget.context.save();
+              }}
+              tooltip={'Save'}
+            />
+          )
+        )
+      },
+      {
+        name: 'create',
+        widget: addToolbarButtonClass(
+          ReactWidget.create(
+            <ToolbarButtonComponent
+              icon={runIcon}
+              onClick={() =>
+                solveAndCreateEnvironment(
+                  widget.context.model.toString(),
+                  this.options.environmentManager,
+                  false
+                )
+              }
+              tooltip={'Create new environment'}
+            />
+          )
+        )
+      },
+      {
+        name: 'spacer',
+        widget: Toolbar.createSpacerItem()
+      },
+      {
+        name: 'settings',
+        widget: ReactWidget.create(
+          <span className="condaCompleteSettings">
+            <span>
+              <b>quetzUrl:</b> {quetzUrl}
+            </span>
+            {quetzSolverUrl && (
+              <span>
+                <b>quetzSolverUrl:</b> {quetzSolverUrl}
+              </span>
+            )}
+          </span>
+        )
+      }
+    ];
+  }
+
+  protected createNewWidget(
+    context: DocumentRegistry.Context
+  ): DocumentWidget<CondaCompleteWidget> {
+    return new DocumentWidget<CondaCompleteWidget>({
+      context,
+      content: new CondaCompleteWidget(this.options.environmentManager, context)
+    });
+  }
+}
+
+export namespace CondaCompleteFactory {
+  export interface ICondaCompleteFactoryOptions
+    extends DocumentRegistry.IWidgetFactoryOptions {
+    environmentManager: IEnvironmentManager;
+  }
+}
+
+const FACTORY = 'conda';
+
+type ICondaCompleteTracker = IWidgetTracker<DocumentWidget>;
+
+export const ICondaCompleteTracker = new Token<ICondaCompleteTracker>(
+  'condacomplete/tracker'
+);
+
+export const condaCompleteExtension: JupyterFrontEndPlugin<ICondaCompleteTracker> = {
+  id: '@mamba-org/gator-lab:conda-completer',
+  autoStart: true,
+  requires: [ILayoutRestorer, IEnvironmentManager],
+  provides: ICondaCompleteTracker,
+  activate
+};
+
+function activate(
+  app: JupyterFrontEnd,
+  restorer: ILayoutRestorer,
+  environmentManager: IEnvironmentManager
+): ICondaCompleteTracker {
+  const namespace = 'conda';
+  const tracker = new WidgetTracker<DocumentWidget>({ namespace });
+
+  if (!environmentManager.quetzUrl) {
+    return tracker;
+  }
+
+  restorer.restore(tracker, {
+    command: 'docmanager:open',
+    args: widget => ({ path: widget.context.path, factory: FACTORY }),
+    name: widget => widget.context.path
+  });
+
+  const factory = new CondaCompleteFactory({
+    name: FACTORY,
+    fileTypes: ['yaml', 'conda.yml', 'conda'],
+    defaultFor: ['conda.yml', 'conda'],
+    environmentManager
+  });
+
+  factory.widgetCreated.connect((sender, widget) => {
+    widget.title.icon = condaIcon;
+
+    // Notify the instance tracker if restore data needs to update.
+    widget.context.pathChanged.connect(() => {
+      tracker.save(widget);
+    });
+    tracker.add(widget);
+  });
+  app.docRegistry.addWidgetFactory(factory);
+
+  app.docRegistry.addFileType({
+    name: FACTORY,
+    displayName: 'Environment file',
+    mimeTypes: ['application/conda'],
+    extensions: ['.yml', '.conda.yml'],
+    icon: condaIcon,
+    fileFormat: 'text',
+    contentType: 'file'
+  });
+
+  return tracker;
+}
diff --git a/packages/labextension/src/index.ts b/packages/labextension/src/index.ts
index 7616d136..6a77512d 100644
--- a/packages/labextension/src/index.ts
+++ b/packages/labextension/src/index.ts
@@ -24,6 +24,7 @@ import {
   CompanionValidator,
   ICompanionValidator
 } from './validator';
+import { condaCompleteExtension } from './CondaCompleteEditor';
 
 const CONDAENVID = '@mamba-org/gator-lab:plugin';
 const TOUR_DELAY = 1000;
@@ -186,7 +187,7 @@ const companions: JupyterFrontEndPlugin<ICompanionValidator> = {
   provides: ICompanionValidator
 };
 
-const extensions = [condaManager, companions];
+const extensions = [condaManager, companions, condaCompleteExtension];
 
 export default extensions;
 
diff --git a/tsconfig-base.json b/tsconfig-base.json
index fb0c6332..af13d505 100644
--- a/tsconfig-base.json
+++ b/tsconfig-base.json
@@ -8,7 +8,7 @@
     "esModuleInterop": true,
     "incremental": true,
     "inlineSources": true,
-    "lib": ["dom", "es6"],
+    "lib": ["dom", "es2020"],
     "jsx": "react",
     "module": "commonjs",
     "moduleResolution": "node",
diff --git a/yarn.lock b/yarn.lock
index a1cd139b..2385088f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2737,6 +2737,13 @@
   dependencies:
     "@babel/types" "^7.3.0"
 
+"@types/codemirror@^0.0.108":
+  version "0.0.108"
+  resolved "https://registry.yarnpkg.com/@types/codemirror/-/codemirror-0.0.108.tgz#e640422b666bf49251b384c390cdeb2362585bde"
+  integrity sha512-3FGFcus0P7C2UOGCNUVENqObEb4SFk+S8Dnxq7K6aIsLVs/vDtlangl3PEO0ykaKXyK56swVF6Nho7VsA44uhw==
+  dependencies:
+    "@types/tern" "*"
+
 "@types/dom4@^2.0.1":
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/@types/dom4/-/dom4-2.0.1.tgz#506d5781b9bcab81bd9a878b198aec7dee2a6033"
@@ -2852,6 +2859,13 @@
   dependencies:
     "@types/react" "*"
 
+"@types/react-dom@^17.0.8":
+  version "17.0.8"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.8.tgz#3180de6d79bf53762001ad854e3ce49f36dd71fc"
+  integrity sha512-0ohAiJAx1DAUEcY9UopnfwCE9sSMDGnY/oXjWMax6g3RpzmTt2GMyMVAXcbn0mo8XAff0SbQJl2/SBU+hjSZ1A==
+  dependencies:
+    "@types/react" "*"
+
 "@types/react-virtualized-auto-sizer@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@types/react-virtualized-auto-sizer/-/react-virtualized-auto-sizer-1.0.0.tgz#fc32f30a8dab527b5816f3a757e1e1d040c8f272"
@@ -2884,6 +2898,13 @@
   resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-2.0.0.tgz#7036640b4e21cc2f259ae826ce843d277dad8cff"
   integrity sha512-RJJrrySY7A8havqpGObOB4W92QXKJo63/jFLLgpvOtsGUqbQZ9Sbgl35KMm1DjC6j7AvmmU2bIno+3IyEaemaw==
 
+"@types/tern@*":
+  version "0.23.3"
+  resolved "https://registry.yarnpkg.com/@types/tern/-/tern-0.23.3.tgz#4b54538f04a88c9ff79de1f6f94f575a7f339460"
+  integrity sha512-imDtS4TAoTcXk0g7u4kkWqedB3E4qpjXzCpD2LU5M5NAXHzCDsypyvXSaG7mM8DKYkCRa7tFp4tS/lp/Wo7Q3w==
+  dependencies:
+    "@types/estree" "*"
+
 "@types/yargs-parser@*":
   version "20.2.0"
   resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-20.2.0.tgz#dd3e6699ba3237f0348cd085e4698780204842f9"
@@ -4051,6 +4072,16 @@ code-point-at@^1.0.0:
   resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
   integrity sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=
 
+codemirror-show-hint@^5.58.3:
+  version "5.58.3"
+  resolved "https://registry.yarnpkg.com/codemirror-show-hint/-/codemirror-show-hint-5.58.3.tgz#ba1783524ebc819eb4a5164945514ea8c39b4306"
+  integrity sha512-3rES10Ff3ARYsgdKerMfnD5fbSSwi5pKyPlhEObmoADZbBwh6zGr3U17Go0+yrr6OnYn3mQtu5eKQ1S7988pWw==
+
+codemirror@^5.60.0:
+  version "5.61.0"
+  resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.61.0.tgz#318e5b034a707207948b92ffc2862195e8fdb08e"
+  integrity sha512-D3wYH90tYY1BsKlUe0oNj2JAhQ9TepkD51auk3N7q+4uz7A/cgJ5JsWHreT0PqieW1QhOuqxQ2reCXV1YXzecg==
+
 codemirror@~5.57.0:
   version "5.57.0"
   resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.57.0.tgz#d26365b72f909f5d2dbb6b1209349ca1daeb2d50"