Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@ jobs:
- name: Run lint
run: pnpm lint

- name: Run prettier
run: pnpm prettier
- name: Run format check
run: pnpm format:check

build:
runs-on: ubuntu-latest
Expand Down
4 changes: 2 additions & 2 deletions .lintstagedrc.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
module.exports = {
"*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write --ignore-unknown"],
};
'*.{js,jsx,ts,tsx}': ['oxlint -c .oxlintrc.json --fix', 'oxfmt --write'],
}
27 changes: 27 additions & 0 deletions .oxfmtrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
{
"$schema": "./node_modules/oxfmt/configuration_schema.json",
"trailingComma": "es5",
"tabWidth": 2,
"semi": false,
"singleQuote": true,
"printWidth": 80,
"sortImports": {
"groups": [
"type-import",
["value-builtin", "value-external"],
"type-internal",
"value-internal",
["type-parent", "type-sibling", "type-index"],
["value-parent", "value-sibling", "value-index"],
"unknown"
]
},
"ignorePatterns": [
"pnpm-lock.yaml",
"**/storybook-static",
"**/lib",
"**/.storybook",
"**/tests/data/*.md",
"**/templates/*.md"
]
}
26 changes: 26 additions & 0 deletions .oxlintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
{
"$schema": "./node_modules/oxlint/configuration_schema.json",
"plugins": ["react", "nextjs", "jsx-a11y", "import", "typescript"],
"categories": {
"correctness": "error",
"suspicious": "warn",
"perf": "warn"
},
"rules": {
"no-unused-vars": "off",
"react/react-in-jsx-scope": "off",
"jsx-a11y/click-events-have-key-events": "warn",
"jsx-a11y/no-static-element-interactions": "warn",
"import/order": "error"
},
"settings": {
"next": {
"rootDir": ["."]
},
"react": {
"formComponents": [],
"linkComponents": [{ "name": "Link", "linkAttribute": "href" }]
}
},
"ignorePatterns": [".next", "out", "build", "milkdown", "next-env.d.ts"]
}
10 changes: 0 additions & 10 deletions .prettierignore

This file was deleted.

76 changes: 38 additions & 38 deletions docs/blogs/announcing-telemetry-inspector.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,47 +13,47 @@ You can even use visualizer to visualize the data. We create a simple example on
Inspector will be a top-level API in Milkdown. You can use it like this:

```ts
import { Editor } from "@milkdown/core";
import { Telemetry } from "@milkdown/ctx";
import { Editor } from '@milkdown/core'
import { Telemetry } from '@milkdown/ctx'

const editor = await Editor.make()
// Inspector is disabled by default considering performance. You need to enable it manually.
.enableInspector()
// ...
.create();
.create()

const telemetry: Telemetry[] = editor.inspect();
const telemetry: Telemetry[] = editor.inspect()
```

The `Telemetry` interface will have the following fields:

```ts
interface Telemetry {
// User defined information for the plugin.
metadata: Meta;
metadata: Meta

// The slices and their current value defined by the plugin.
injectedSlices: { name: string; value: unknown }[];
injectedSlices: { name: string; value: unknown }[]

// The slices and their current value consumed by the plugin.
consumedSlices: { name: string; value: unknown }[];
consumedSlices: { name: string; value: unknown }[]

// The timers and their duration defined by the plugin.
recordedTimers: { name: string; duration: number; status: TimerStatus }[];
recordedTimers: { name: string; duration: number; status: TimerStatus }[]

// The timers and their duration consumed by the plugin.
// Generally, the plugin will wait for them.
waitTimers: { name: string; duration: number; status: TimerStatus }[];
waitTimers: { name: string; duration: number; status: TimerStatus }[]
}

type TimerStatus = "pending" | "resolved" | "rejected";
type TimerStatus = 'pending' | 'resolved' | 'rejected'

interface Meta {
displayName: string;
description?: string;
package: string;
group?: string;
additional?: Record<string, any>;
displayName: string
description?: string
package: string
group?: string
additional?: Record<string, any>
}
```

Expand All @@ -62,52 +62,52 @@ With the data, you'll know the sequence of the plugins loaded, the slices and ti
For example:

```ts
[
;[
{
metadata: {
displayName: "Config",
package: "@milkdown/core",
group: "System",
displayName: 'Config',
package: '@milkdown/core',
group: 'System',
},
injectedSlices: [],
consumedSlices: [
/* ... */
],
recordedTimers: [
{
name: "ConfigReady",
name: 'ConfigReady',
duration: 3,
status: "resolved",
status: 'resolved',
},
],
waitTimers: [],
},
{
metadata: {
displayName: "Init",
package: "@milkdown/core",
group: "System",
displayName: 'Init',
package: '@milkdown/core',
group: 'System',
},
injectedSlices: [],
consumedSlices: [
/* ... */
],
recordedTimers: [
{
name: "InitReady",
name: 'InitReady',
duration: 5,
status: "resolved",
status: 'resolved',
},
],
waitTimers: [
{
name: "ConfigReady",
name: 'ConfigReady',
duration: 5,
status: "resolved",
status: 'resolved',
},
],
},
];
]
```

From above information, we can know that the `Init` plugin wait for `Config` plugin to be ready.
Expand All @@ -120,23 +120,23 @@ We can build a sequence diagram from the data.
For plugin maintainers, you can add metadata to your plugin to make it more friendly to the inspector.

```ts
import { MilkdownPlugin } from "@milkdown/ctx";
import { MilkdownPlugin } from '@milkdown/ctx'

const yourMilkdownPlugin: MilkdownPlugin = () => {
/* your implementation */
};
}

yourMilkdownPlugin.metadata = {
displayName: "Your Plugin",
package: "your-plugin-package",
description: "Your plugin description",
group: "If you have a lot of plugins in your package, you can group them.",
displayName: 'Your Plugin',
package: 'your-plugin-package',
description: 'Your plugin description',
group: 'If you have a lot of plugins in your package, you can group them.',
addtitional: {
/* You can add any additional information here. */
version: "1.0.0",
authror: "Mike",
version: '1.0.0',
authror: 'Mike',
},
};
}
```

With metadata, your plugin will report telemetry correctly to the inspector.
Loading