Merge branch 'main' into feat/flags-ui

2022-10-28 14:48:41 +05:30
parent 1513f78991 df1d65dcab
commit f5cb76c302
6 changed files with 45 additions and 30 deletions
--- a/components/HooksEditor.tsx
+++ b/components/HooksEditor.tsx
@@ -200,15 +200,15 @@ const HooksEditor = () => {
            defaultValue={file?.content}
            // onChange={val => (state.files[snap.active].content = val)} // Auto save?
            beforeMount={monaco => {
-              if (!snap.editorCtx) {
-                snap.files.forEach(file =>
-                  monaco.editor.createModel(
-                    file.content,
-                    file.language,
-                    monaco.Uri.parse(`file:///work/c/${file.name}`)
-                  )
-                )
-              }
+              // if (!snap.editorCtx) {
+              //   snap.files.forEach(file =>
+              //     monaco.editor.createModel(
+              //       file.content,
+              //       file.language,
+              //       monaco.Uri.parse(`file:///work/c/${file.name}`)
+              //     )
+              //   )
+              // }

              // create the web socket
              if (!subscriptionRef.current) {
@@ -218,6 +218,11 @@ const HooksEditor = () => {
                  aliases: ['C', 'c', 'H', 'h'],
                  mimetypes: ['text/plain']
                })
+                monaco.languages.register({
+                  id: 'text',
+                  extensions: ['.txt'],
+                  mimetypes: ['text/plain'],
+                })
                MonacoServices.install(monaco)
                const webSocket = createWebSocket(
                  process.env.NEXT_PUBLIC_LANGUAGE_SERVER_API_ENDPOINT || ''
--- a/components/Tabs.tsx
+++ b/components/Tabs.tsx
@@ -11,7 +11,7 @@ import {
 } from './Dialog'
 import { Plus, X } from 'phosphor-react'
 import { styled } from '../stitches.config'
-import { capitalize } from '../utils/helpers'
+import { capitalize, getFileExtention } from '../utils/helpers'
 import ContextMenu, { ContentMenuOption } from './ContextMenu'

 const ErrorText = styled(Text, {
@@ -97,7 +97,7 @@ export const Tabs = ({
      if (!tabname) {
        return { error: `Please enter ${label.toLocaleLowerCase()} name.` }
      }
-      let ext = (tabname.includes('.') && tabname.split('.').pop()) || ''
+      let ext = getFileExtention(tabname)

      if (!ext && defaultExtension) {
        ext = defaultExtension
@@ -109,7 +109,7 @@ export const Tabs = ({
      if (extensionRequired && !ext) {
        return { error: 'File extension is required!' }
      }
-      if (allowedExtensions && !allowedExtensions.includes(ext)) {
+      if (allowedExtensions && ext && !allowedExtensions.includes(ext)) {
        return { error: 'This file extension is not allowed!' }
      }
      if (headerExtraValidation && !tabname.match(headerExtraValidation.regex)) {
--- a/pages/develop/[[...slug]].tsx
+++ b/pages/develop/[[...slug]].tsx
@@ -10,10 +10,11 @@ import Box from '../../components/Box'
 import Button from '../../components/Button'
 import Popover from '../../components/Popover'
 import RunScript from '../../components/RunScript'
-import state from '../../state'
+import state, { IFile } from '../../state'
 import { compileCode } from '../../state/actions'
 import { getSplit, saveSplit } from '../../state/actions/persistSplits'
 import { styled } from '../../stitches.config'
+import { getFileExtention } from '../../utils/helpers'

 const HooksEditor = dynamic(() => import('../../components/HooksEditor'), {
  ssr: false
@@ -147,6 +148,8 @@ const CompilerSettings = () => {
 const Home: NextPage = () => {
  const snap = useSnapshot(state)

+  const activeFile = snap.files[snap.active] as IFile | undefined
+  const activeFileExt = getFileExtention(activeFile?.name)
  return (
    <Split
      direction="vertical"
@@ -159,7 +162,7 @@ const Home: NextPage = () => {
    >
      <main style={{ display: 'flex', flex: 1, position: 'relative' }}>
        <HooksEditor />
-        {snap.files[snap.active]?.name?.split('.')?.[1]?.toLowerCase() === 'c' && (
+        {activeFileExt === 'c' && (
          <Hotkeys
            keyName="command+b,ctrl+b"
            onKeyDown={() => !snap.compiling && snap.files.length && compileCode(snap.active)}
@@ -193,7 +196,7 @@ const Home: NextPage = () => {
            </Flex>
          </Hotkeys>
        )}
-        {snap.files[snap.active]?.name?.split('.')?.[1]?.toLowerCase() === 'js' && (
+        {activeFileExt === 'js' && (
          <Hotkeys
            keyName="command+b,ctrl+b"
            onKeyDown={() => !snap.compiling && snap.files.length && compileCode(snap.active)}
@@ -209,7 +212,7 @@ const Home: NextPage = () => {
                gap: '$2'
              }}
            >
-              <RunScript file={snap.files[snap.active]} />
+              <RunScript file={activeFile as IFile} />
            </Flex>
          </Hotkeys>
        )}
@@ -225,7 +228,7 @@ const Home: NextPage = () => {
        >
          <LogBox title="Development Log" clearLog={() => (state.logs = [])} logs={snap.logs} />
        </Flex>
-        {snap.files[snap.active]?.name?.split('.')?.[1]?.toLowerCase() === 'js' && (
+        {activeFileExt === 'js' && (
          <Flex
            css={{
              flex: 1
--- a/state/actions/createNewFile.ts
+++ b/state/actions/createNewFile.ts
@@ -1,21 +1,19 @@
+import { getFileExtention } from '../../utils/helpers'
 import state, { IFile } from '../index'

-const languageMapping = {
+const languageMapping: Record<string, string | undefined> = {
  ts: 'typescript',
  js: 'javascript',
  md: 'markdown',
  c: 'c',
  h: 'c',
-  other: ''
-} /* Initializes empty file to global state */
+  txt: 'text'
+}
+
 export const createNewFile = (name: string) => {
-  const tempName = name.split('.')
-  const fileExt = tempName[tempName.length - 1] || 'other'
-  const emptyFile: IFile = {
-    name,
-    language: languageMapping[fileExt as 'ts' | 'js' | 'md' | 'c' | 'h' | 'other'],
-    content: ''
-  }
+  const ext = getFileExtention(name) || ''
+
+  const emptyFile: IFile = { name, language: languageMapping[ext] || 'text', content: '' }
  state.files.push(emptyFile)
  state.active = state.files.length - 1
 }
@@ -24,5 +22,8 @@ export const renameFile = (oldName: string, nwName: string) => {
  const file = state.files.find(file => file.name === oldName)
  if (!file) throw Error(`No file exists with name ${oldName}`)

+  const ext = getFileExtention(nwName) || ''
+  const language = languageMapping[ext] || 'text'
  file.name = nwName
+  file.language = language
 }
--- a/utils/helpers.ts
+++ b/utils/helpers.ts
@@ -13,3 +13,9 @@ export const capitalize = (value?: string) => {

  return value[0].toLocaleUpperCase() + value.slice(1)
 }
+
+export const getFileExtention = (filename?: string): string | undefined => {
+  if (!filename) return
+  const ext = (filename.includes('.') && filename.split('.').pop()) || undefined
+  return ext
+}
--- a/yarn.lock
+++ b/yarn.lock
@@ -2725,9 +2725,9 @@ javascript-time-ago@^2.3.11:
    relative-time-format "^1.0.7"

 jose@^4.1.4, jose@^4.3.7:
-  version "4.6.0"
-  resolved "https://registry.npmjs.org/jose/-/jose-4.6.0.tgz"
-  integrity sha512-0hNAkhMBNi4soKSAX4zYOFV+aqJlEz/4j4fregvasJzEVtjDChvWqRjPvHwLqr5hx28Ayr6bsOs1Kuj87V0O8w==
+  version "4.10.0"
+  resolved "https://registry.yarnpkg.com/jose/-/jose-4.10.0.tgz#2e0b7bcc80dd0775f8a4588e55beb9460c37d60a"
+  integrity sha512-KEhB/eLGLomWGPTb+/RNbYsTjIyx03JmbqAyIyiXBuNSa7CmNrJd5ysFhblayzs/e/vbOPMUaLnjHUMhGp4yLw==

 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
  version "4.0.0"