Skip to content

Commit

Permalink
Merge pull request #31 from WTFAcademy/dev
Browse files Browse the repository at this point in the history
Dev
  • Loading branch information
chongqiangchen authored May 29, 2023
2 parents 6d9a739 + 65beaad commit 2c9ad12
Show file tree
Hide file tree
Showing 20 changed files with 353 additions and 316 deletions.
5 changes: 5 additions & 0 deletions .changeset/thin-colts-own.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"solive-core": patch
---

refactor log output
5 changes: 4 additions & 1 deletion .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -61,17 +61,20 @@ module.exports = {
'@typescript-eslint/no-explicit-any': 'off',
'@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
'@typescript-eslint/no-non-null-assertion': 'off',
'no-unused-expressions': 'off',

// React 相关
'react/jsx-filename-extension': ['error', { extensions: ['.jsx', '.tsx'] }],
'react/prop-types': 'off',
'react/jsx-props-no-spreading': 'off',
'react-hooks/rules-of-hooks': 'error',
'react-hooks/exhaustive-deps': 'warn',
'react/require-default-props': 'warn',
'react/no-unused-prop-types': 'warn',
'jsx-a11y/click-events-have-key-events': 'warn',
'react/jsx-no-bind': 'off',
'react/require-default-props': 'off',
'react/no-array-index-key': 'off',
'jsx-a11y/no-static-element-interactions': 'off',

// import 相关
'import/prefer-default-export': 'off',
Expand Down
24 changes: 12 additions & 12 deletions apps/doc/docs/extension/docusaurus-plugins/props.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,15 @@ hide_title: true

> Note: properties may change the default values and new properties will be added in the future.
| Property | Type | Default Value | Description |
| --- | --- | --- | --- |
| width | string | 90% | Container width |
| height | string | 500px | Container height |
| simple | boolean | false | Is it minimal mode? |
| consoleOpen | boolean | true | Display console? |
| consoleTriggerControl | boolean | false | Show console trigger button? |
| consoleDefaultVisible | boolean | false | Is console visible by default? |
| deployOpen | boolean | true | Display deploy module? |
| deployDefaultVisible | boolean | false | Is deploy module visible by default? |
| fileNavOpen | boolean | true | Display file navigation bar? |
| fileNavDefaultVisible | boolean | false | Is file navigation bar visible by default? |
| Property | Type | Default Value | Description |
|-----------------------|---------|---------------|--------------------------------------------|
| width | string | 90% | Container width |
| height | string | 500px | Container height |
| simple | boolean | false | Is it minimal mode? |
| consoleOpen | boolean | true | Display console? |
| consoleTriggerControl | boolean | false | Show console trigger button? |
| consoleDefaultVisible | boolean | false | Is console visible by default? |
| deployOpen | boolean | true | Display deploy module? |
| deployDefaultVisible | boolean | false | Is deploy module visible by default? |
| fileNavOpen | boolean | true | Display file navigation bar? |
| fileNavDefaultVisible | boolean | false | Is file navigation bar visible by default? |
56 changes: 28 additions & 28 deletions apps/doc/docs/solive-props.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,46 +8,46 @@ hide_title: true

## Property Table

| Property Name | Description | Type | Default Value | Required |
| ------------- | ----------- | ---- | ------------- | -------- |
| id | Unique form identifier | string | - ||
| modelInfos | File information | array | [] ||
| height | Height | string | - ||
| rounded | Window corner radius | string | 12px | - |
| disableValidation | Whether to disable validation | boolean | false | - |
| monacoEditorOptions | Monaco editor configuration | (Refer to [IStandaloneEditorConstructionOptions](https://microsoft.github.io/monaco-editor/typedoc/interfaces/editor.IStandaloneEditorConstructionOptions.html)) | - | - |
| fileNav | Top file navigation | TFileNav | (Refer to [TFileNav](/docs/SoLive-props#tfilenav)) | - |
| console | Log block | TConsole | (Refer to [TConsole](/docs/SoLive-props#tconsole)) | - |
| deploy | Deployment block | TDeploy | (Refer to [TDeploy](/docs/SoLive-props#tdeploy)) | - |
| Property Name | Description | Type | Default Value | Required |
|---------------------|-------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------------------------------------------------|----------|
| id | Unique form identifier | string | - | |
| modelInfos | File information | array | [] | |
| height | Height | string | - | |
| rounded | Window corner radius | string | 12px | - |
| disableValidation | Whether to disable validation | boolean | false | - |
| monacoEditorOptions | Monaco editor configuration | (Refer to [IStandaloneEditorConstructionOptions](https://microsoft.github.io/monaco-editor/typedoc/interfaces/editor.IStandaloneEditorConstructionOptions.html)) | - | - |
| fileNav | Top file navigation | TFileNav | (Refer to [TFileNav](/docs/solive-props#tfilenav)) | - |
| console | Log block | TConsole | (Refer to [TConsole](/docs/solive-props#tconsole)) | - |
| deploy | Deployment block | TDeploy | (Refer to [TDeploy](/docs/solive-props#tdeploy)) | - |

## TFileNav

Top file navigation property table

| Property Name | Description | Type | Default Value | Required |
| ------------- | ----------- | ---- | ------------- | -------- |
| open | Whether to enable the feature | boolean | true | - |
| Property Name | Description | Type | Default Value | Required |
|---------------|-------------------------------|---------|---------------|----------|
| open | Whether to enable the feature | boolean | true | - |

## TConsole

Log block property table

| Property Name | Description | Type | Default Value | Required |
| ------------- | ----------- | ---- | ------------- | -------- |
| defaultVisible | Default visibility | boolean | true | - |
| defaultHeight | Default height | string | "30%" | - |
| minHeight | Minimum height | number | 78 | - |
| triggerControl | Whether to enable control | boolean | true | - |
| open | Whether to enable the feature | boolean | true | - |
| Property Name | Description | Type | Default Value | Required |
|----------------|-------------------------------|---------|---------------|----------|
| defaultVisible | Default visibility | boolean | true | - |
| defaultHeight | Default height | string | "30%" | - |
| minHeight | Minimum height | number | 78 | - |
| triggerControl | Whether to enable control | boolean | true | - |
| open | Whether to enable the feature | boolean | true | - |

## TDeploy

Deployment block property table

| Property Name | Description | Type | Default Value | Required |
| ------------- | ----------- | ---- | ------------- | -------- |
| defaultVisible | Default visibility | boolean | true | - |
| defaultWidth | Default width | string | "200px" | - |
| minWidth | Minimum width | number | 140 | - |
| maxWidth | Maximum width | number | 240 | - |
| open | Whether to enable the feature | boolean | true | - |
| Property Name | Description | Type | Default Value | Required |
|----------------|-------------------------------|---------|---------------|----------|
| defaultVisible | Default visibility | boolean | true | - |
| defaultWidth | Default width | string | "200px" | - |
| minWidth | Minimum width | number | 140 | - |
| maxWidth | Maximum width | number | 240 | - |
| open | Whether to enable the feature | boolean | true | - |
61 changes: 34 additions & 27 deletions packages/core/src/components/Console/index.tsx
Original file line number Diff line number Diff line change
@@ -1,59 +1,66 @@
import ReactJson from "react-json-view";
import { useEffect, useRef } from 'react';

import NavBar from "../NavBar";
import {useEditor} from "../../editor/contexts/editorContext";
import {generateConsoleMessageToShow} from "../../types/console";
import {useConsole} from "../../editor/contexts/consoleContext";
import {useEffect, useRef} from "react";
import ReactJson from 'react-json-view';

import NavBar from '../NavBar';
import { useEditor } from '../../editor/contexts/editorContext';
import { generateConsoleMessageToShow } from '../../types/console';
import { useConsole } from '../../editor/contexts/consoleContext';

const NAVS = [
{label: "Console", id: "console"},
{label: "", id: "empty"},
{ label: 'Console', id: 'console' },
{ label: '', id: 'empty' },
];

type TProps = {
onDeleteClick?: () => void;
}

const Console = (props: TProps) => {
function Console(props: TProps) {
const {
onDeleteClick,
} = props;
const { id } = useEditor();
const {consoles} = useConsole();
const consoleRef = useRef<HTMLDivElement>(null)
const { consoles } = useConsole();
const consoleRef = useRef<HTMLDivElement>(null);

const consoleMessages = consoles || [];

const handleDeleteClick = () => props.onDeleteClick && props.onDeleteClick();
const handleDeleteClick = () => onDeleteClick && onDeleteClick();

useEffect(() => {
consoleRef.current?.scrollTo(0, consoleRef.current.scrollHeight)
}, [consoleMessages])
consoleRef.current?.scrollTo(0, consoleRef.current.scrollHeight);
}, [consoleMessages]);

return (
<div key={id + "_console"} className="h-full flex flex-col flex-1 bg-primary-700 pt-2 rounded-b-[12px]">
<div key={`${id}_console`} className="h-full flex flex-col flex-1 bg-primary-700 pt-2 rounded-b-[12px]">
<NavBar globalId={id} navs={NAVS} onDeleteClick={handleDeleteClick} />
<div ref={consoleRef} className="flex-auto mb-4 text-primary-100 p-2 text-[12px] overflow-scroll">
{consoleMessages.map((item, index) => {
let data
let data;
try {
data = JSON.parse(item.message)
data = JSON.parse(item.message);
} catch (e) { /* empty */ }
if (data instanceof Object) {
return (
<div key={index} className={`flex ${item.type === 'error' ? 'text-red-500' : 'text-white'}`}>
<span>[{new Date(item.timestamp).toLocaleTimeString()}]:</span>
<ReactJson src={data} theme="ocean" collapsed style={{backgroundColor: 'transparent'}} />
</div>
)
} else
return (
<div key={index} className={`${item.type === 'error' ? 'text-red-500' : 'text-white'}`}>
{generateConsoleMessageToShow(item).toString()}
<span>
[
{new Date(item.timestamp).toLocaleTimeString()}
]:
</span>
<ReactJson src={data} theme="ocean" collapsed style={{ backgroundColor: 'transparent' }} />
</div>
)
);
} return (
<div key={index} className={`whitespace-pre-line ${item.type === 'error' ? 'text-red-500' : 'text-white'}`}>
{generateConsoleMessageToShow(item)}
</div>
);
})}
</div>
</div>
)
);
}

export default Console;
Loading

2 comments on commit 2c9ad12

@vercel
Copy link

@vercel vercel bot commented on 2c9ad12 May 29, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@vercel
Copy link

@vercel vercel bot commented on 2c9ad12 May 29, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.