Add default values from inferapp

Author: handotdev

.eslintrc.json

@@ -0,0 +1,31 @@
+{
+    "env": {
+        "browser": true,
+        "es2021": true,
+        "node": true
+    },
+    "extends": [
+        "plugin:react/recommended",
+        "airbnb"
+    ],
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "ecmaFeatures": {
+            "jsx": true
+        },
+        "ecmaVersion": 12,
+        "sourceType": "module"
+    },
+    "plugins": [
+        "react",
+        "@typescript-eslint"
+    ],
+    "rules": {
+        "react/prop-types": "off",
+        "react/react-in-jsx-scope": "off",
+        "react/jsx-filename-extension": "off",
+        "react/jsx-props-no-spreading": "off",
+        "import/no-unresolved": "off",
+        "import/extensions": "off"
+    }
+}

.gitignore

@@ -0,0 +1,34 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel

README.md

@@ -0,0 +1,47 @@
+![Tux, the Linux mascot](/assets/mintlify-green-smol.png)
+# Inferlang for Developers
+
+Auto-detect the programming language of any code
+## API Endpoint
+
+Use the Inferlang API to programmatically build language detection into your application
+
+```bash
+POST: https://inferlang.com/api/detect
+```
+
+| Request Body | |
+| ----------- | ----------- |
+| `code` (required)   | Code input you would like to identify the language for as a string |
+
+| Returns | |
+| ----------- | ----------- |
+| `language`     | Name of the language detected |
+
+## Running locally
+
+You can run the Interlang app in your local machine
+
+First, install the dependencies using
+
+```bash
+npm install
+```
+
+Then run the [Next.JS](https://nextjs.org/) application using
+
+```bash
+npm run dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+## Learn More
+
+Inferlang is powered by and [GuessLang](https://github.com/yoeo/guesslang) and hosted by [Mintlify](https://mintlify.ccom). You can find out more at
+
+- [GuessLang Documentation](https://guesslang.readthedocs.io/en/latest/) - Guesslang detects the programming language of a given source code. It supports more than 50 programming languages and detects the correct programming language with more than 90% accuracy.
+
+- [Mintlify Signup](https://nextjs.org/learn) - The search engine in your codebase
+
+You can check out [the Inferlang repository](https://github.com/mintlify/inferapp) - your feedback and contributions are welcome!

assets/mintlify-green-smol.png

@@ -0,0 +1,54 @@
+/* eslint-disable react/jsx-props-no-spreading */
+import Editor from 'react-simple-code-editor';
+import Highlight, { defaultProps, Language } from 'prism-react-renderer';
+import theme from 'prism-react-renderer/themes/nightOwl';
+
+type CodeEditorProps = {
+  code: string;
+  // eslint-disable-next-line no-unused-vars
+  setCode: (code: string) => void;
+  placeholder: string;
+  language: string;
+}
+
+export default function CodeEditor({
+  code, setCode, placeholder, language,
+}: CodeEditorProps) {
+  const highlight = (codeUnhighlighted: string) => (
+    <Highlight
+      {...defaultProps}
+      theme={theme}
+      code={codeUnhighlighted}
+      language={language.toLowerCase() as Language}
+    >
+      {({
+        tokens, getLineProps, getTokenProps,
+      }) => (
+        <>
+          {tokens.map((line, i) => (
+            <div {...getLineProps({ line, key: i })}>
+              {line.map((token, key) => <span {...getTokenProps({ token, key })} />)}
+            </div>
+          ))}
+        </>
+      )}
+    </Highlight>
+  );
+
+  return (
+    <Editor
+      value={code}
+      onValueChange={(codeUpdated) => setCode(codeUpdated)}
+      highlight={highlight}
+      padding={16}
+      placeholder={placeholder}
+      className="border border-gray-300 rounded-lg text-sm"
+      style={{
+        boxSizing: 'border-box',
+        fontFamily: '"Dank Mono", "Fira Code", monospace',
+        minHeight: '12rem',
+        ...theme.plain as any,
+      }}
+    />
+  );
+}

assets/mintlify.svg

@@ -0,0 +1,39 @@
+import toast from 'react-hot-toast';
+import { DuplicateIcon } from '@heroicons/react/outline';
+
+type OutputProps = {
+  output: string;
+  isLoading: boolean;
+}
+
+function Output(props: OutputProps) {
+  const { output, isLoading } = props;
+
+  const copyToClipboard = () => {
+    navigator.clipboard.writeText(output);
+    toast.success('Copied to clipboard');
+  };
+
+  return (
+    <div className="relative bg-gray-100 border-2 border-gray-200 rounded-lg text-gray-700 p-4 pb-10" style={{ minHeight: '12rem' }}>
+      <p className="whitespace-pre-line text-sm">{output}</p>
+      {
+        output && (
+        <button className="absolute right-3 bottom-3" type="button" onClick={copyToClipboard}>
+          <DuplicateIcon className="h-6 w-6 text-gray-600 hover:text-gray-400" />
+        </button>
+        )
+      }
+      {isLoading && (
+      <div className="absolute inset-0 flex items-center justify-center">
+        <svg className="animate-spin -ml-1 mr-3 h-5 w-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+          <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
+          <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
+        </svg>
+      </div>
+      )}
+    </div>
+  );
+}
+
+export default Output;

components/CodeEditor.tsx

@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

components/Output.tsx

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+module.exports = {
+  reactStrictMode: true,
+}