import { CodeEditorView } from 'officerdev';
import { Widget } from 'widgets/Widget';
import { useTranslation } from '@/lib/i18n';

export const CodeEditor = () => {
  const { t } = useTranslation();
  return (
    <div className="h-full w-full flex items-center justify-center">
      <Widget title={t('nav.codeEditor')} className="h-[70vh] w-[70vw] overflow-hidden" resizable moveable>
        {/* The screen is the one editor that owns the address bar, so the open file is `?file=`. The panel
          wrapper deliberately does not pass this: a dashboard can hold two editors. */}
        <CodeEditorView className="h-full w-full" urlState />
      </Widget>
    </div>
  );
};