diff --git a/packages/react/components/Editor/components/views/LogView.mjs b/packages/react/components/Editor/components/views/LogView.mjs
new file mode 100644
index 00000000000..de5f4f130e3
--- /dev/null
+++ b/packages/react/components/Editor/components/views/LogView.mjs
@@ -0,0 +1,66 @@
+// Dependencies
+import { linkClasses, horFlexClasses, patternUrlFromState } from '@freesewing/utils'
+import { exportTypes, handleExport } from '../../lib/export/index.mjs'
+import { draft } from '../../lib/index.mjs'
+// Hooks
+import React, { useState } from 'react'
+// Components
+import Markdown from 'react-markdown'
+import { H1, H3 } from '@freesewing/react/components/Heading'
+import { HeaderMenu } from '../HeaderMenu.mjs'
+import { Tabs, Tab } from '@freesewing/react/components/Tab'
+
+// The log levels
+const levels = ['error', 'warn', 'info', 'debug']
+
+/**
+ * This is the log view, it shows the pattern logs
+ *
+ * @param {Object} props - All the props
+ * @param {Function} props.config - The editor configuration
+ * @param {Object} props.state - The editor state object
+ * @param {Object} props.update - Helper object for updating the editor state
+ */
+export const LogView = (props) => {
+ const { state, config, update } = props
+ const { pattern } = draft(props.Design, state.settings)
+
+ return (
+ <>
+