leaflet.pub
a tool for shared writing and social publishing
persist last used codeblock language
awarm.space
+10
-1
components/Blocks/BlockCommands.tsx
+10
-1
components/Blocks/BlockCommands.tsx
···
32
import { BlockMathSmall } from "components/Icons/BlockMathSmall";
33
import { BlockCodeSmall } from "components/Icons/BlockCodeSmall";
34
import { QuoteSmall } from "components/Icons/QuoteSmall";
35
36
type Props = {
37
parent: string;
···
310
type: "block",
311
hiddenInPublication: false,
312
onSelect: async (rep, props) => {
313
-
createBlockWithType(rep, props, "code");
314
},
315
},
316
···
32
import { BlockMathSmall } from "components/Icons/BlockMathSmall";
33
import { BlockCodeSmall } from "components/Icons/BlockCodeSmall";
34
import { QuoteSmall } from "components/Icons/QuoteSmall";
35
+
import { LAST_USED_CODE_LANGUAGE_KEY } from "src/utils/codeLanguageStorage";
36
37
type Props = {
38
parent: string;
···
311
type: "block",
312
hiddenInPublication: false,
313
onSelect: async (rep, props) => {
314
+
let entity = await createBlockWithType(rep, props, "code");
315
+
let lastLang = localStorage.getItem(LAST_USED_CODE_LANGUAGE_KEY);
316
+
if (lastLang) {
317
+
await rep.mutate.assertFact({
318
+
entity,
319
+
attribute: "block/code-language",
320
+
data: { type: "string", value: lastLang },
321
+
});
322
+
}
323
},
324
},
325
+2
components/Blocks/CodeBlock.tsx
+2
components/Blocks/CodeBlock.tsx
···
13
import { useEntitySetContext } from "components/EntitySetProvider";
14
import { flushSync } from "react-dom";
15
import { elementId } from "src/utils/elementId";
16
17
export function CodeBlock(props: BlockProps) {
18
let { rep, rootEntity } = useReplicache();
···
100
}}
101
value={lang}
102
onChange={async (e) => {
103
await rep?.mutate.assertFact({
104
attribute: "block/code-language",
105
entity: props.entityID,
···
13
import { useEntitySetContext } from "components/EntitySetProvider";
14
import { flushSync } from "react-dom";
15
import { elementId } from "src/utils/elementId";
16
+
import { LAST_USED_CODE_LANGUAGE_KEY } from "src/utils/codeLanguageStorage";
17
18
export function CodeBlock(props: BlockProps) {
19
let { rep, rootEntity } = useReplicache();
···
101
}}
102
value={lang}
103
onChange={async (e) => {
104
+
localStorage.setItem(LAST_USED_CODE_LANGUAGE_KEY, e.target.value);
105
await rep?.mutate.assertFact({
106
attribute: "block/code-language",
107
entity: props.entityID,
+12
-3
components/Blocks/TextBlock/inputRules.ts
+12
-3
components/Blocks/TextBlock/inputRules.ts
···
11
import { schema } from "./schema";
12
import { useUIState } from "src/useUIState";
13
import { flushSync } from "react-dom";
14
export const inputrules = (
15
propsRef: MutableRefObject<BlockProps & { entity_set: { set: string } }>,
16
repRef: MutableRefObject<Replicache<ReplicacheMutators> | null>,
···
108
109
// Code Block
110
new InputRule(/^```\s$/, (state, match) => {
111
-
flushSync(() =>
112
repRef.current?.mutate.assertFact({
113
entity: propsRef.current.entityID,
114
attribute: "block/type",
115
data: { type: "block-type-union", value: "code" },
116
-
}),
117
-
);
118
setTimeout(() => {
119
focusBlock({ ...propsRef.current, type: "code" }, { type: "start" });
120
}, 20);
···
11
import { schema } from "./schema";
12
import { useUIState } from "src/useUIState";
13
import { flushSync } from "react-dom";
14
+
import { LAST_USED_CODE_LANGUAGE_KEY } from "src/utils/codeLanguageStorage";
15
export const inputrules = (
16
propsRef: MutableRefObject<BlockProps & { entity_set: { set: string } }>,
17
repRef: MutableRefObject<Replicache<ReplicacheMutators> | null>,
···
109
110
// Code Block
111
new InputRule(/^```\s$/, (state, match) => {
112
+
flushSync(() => {
113
repRef.current?.mutate.assertFact({
114
entity: propsRef.current.entityID,
115
attribute: "block/type",
116
data: { type: "block-type-union", value: "code" },
117
+
});
118
+
let lastLang = localStorage.getItem(LAST_USED_CODE_LANGUAGE_KEY);
119
+
if (lastLang) {
120
+
repRef.current?.mutate.assertFact({
121
+
entity: propsRef.current.entityID,
122
+
attribute: "block/code-language",
123
+
data: { type: "string", value: lastLang },
124
+
});
125
+
}
126
+
});
127
setTimeout(() => {
128
focusBlock({ ...propsRef.current, type: "code" }, { type: "start" });
129
}, 20);
+1
src/utils/codeLanguageStorage.ts
+1
src/utils/codeLanguageStorage.ts
···
···
1
+
export const LAST_USED_CODE_LANGUAGE_KEY = "lastUsedCodeLanguage";