dedup and limit history

app/src/components/queryEditor.tsx

@@ -142,13 +142,17 @@ function createEditorState(
 }
 
 function getHistory() {
-	return JSON.parse(localStorage.getItem('queryHistory') ?? '[]') as string[]
+	const array = JSON.parse(
+		localStorage.getItem('queryHistory') ?? '[]',
+	) as string[]
+	return new Set(array)
 }
 
 function appendHistory(value: string) {
 	const history = getHistory()
-	history.push(value)
-	localStorage.setItem('queryHistory', JSON.stringify(history))
+	history.delete(value) // used to reorder and put `value` at the bottom if it's already in the set
+	history.add(value)
+	localStorage.setItem('queryHistory', JSON.stringify([...history].slice(-100)))
 }
 
 const queryLanguage = LRLanguage.define({

shared-dom/src/language/queryCompletion.ts

@@ -11,8 +11,8 @@ import {
 	Tag,
 } from './queryParser.terms'
 
-function buildHistory(getHistory: () => string[]) {
-	return getHistory().map(
+function buildHistory(getHistory: () => Set<string>) {
+	return Array.from(getHistory()).map(
 		(label) =>
 			({
 				label,
@@ -23,7 +23,7 @@ function buildHistory(getHistory: () => string[]) {
 
 export const queryCompletion: (_: {
 	getTags: () => Promise<string[]>
-	getHistory: () => string[]
+	getHistory: () => Set<string>
 }) => CompletionSource =
 	({ getTags, getHistory }) =>
 	async (context) => {