feat(ui): scroll history infinitely (#1999)

* wip, history scrolls right!

* wip

* virtual scroll fucking worksssss

* paging works :)

* scroll search results now too

2 files changed, 54 insertions, 3 deletions

diff --git a/ui/src/state/models.ts b/ui/src/state/models.ts
index 5afcb804..5aca83a0 100644
--- a/ui/src/state/models.ts
+++ b/ui/src/state/models.ts
@@ -1,3 +1,5 @@
+import Database from "@tauri-apps/plugin-sql";
+
 export interface User {
   username: string;
 }
@@ -18,7 +20,7 @@ export const DefaultHomeInfo: HomeInfo = {
   lastSyncTime: new Date(),
 };
 
-export interface ShellHistory {
+export class ShellHistory {
   id: string;
   timestamp: number;
   command: string;
@@ -26,6 +28,24 @@ export interface ShellHistory {
   host: string;
   cwd: string;
   duration: number;
+
+  constructor(
+    id: string,
+    timestamp: number,
+    command: string,
+    user: string,
+    host: string,
+    cwd: string,
+    duration: number,
+  ) {
+    this.id = id;
+    this.timestamp = timestamp;
+    this.command = command;
+    this.user = user;
+    this.host = host;
+    this.cwd = cwd;
+    this.duration = duration;
+  }
 }
 
 export interface Alias {
@@ -36,5 +56,15 @@ export interface Alias {
 export interface Var {
   name: string;
   value: string;
-  export: bool;
+  export: boolean;
+}
+
+export async function inspectHistory(id: string): Promise<any> {
+  const db = await Database.load(
+    "sqlite:/Users/ellie/.local/share/atuin/history.db",
+  );
+
+  let res = await db.select("select * from history where id=$1", [id]);
+
+  return res;
 }
diff --git a/ui/src/state/store.ts b/ui/src/state/store.ts
index 7e237d70..fef1b632 100644
--- a/ui/src/state/store.ts
+++ b/ui/src/state/store.ts
@@ -8,6 +8,7 @@ import {
   DefaultHomeInfo,
   Alias,
   ShellHistory,
+  Var,
 } from "./models";
 
 import { invoke } from "@tauri-apps/api/core";
@@ -26,9 +27,10 @@ interface AtuinState {
   refreshAliases: () => void;
   refreshVars: () => void;
   refreshShellHistory: (query?: string) => void;
+  historyNextPage: (query?: string) => void;
 }
 
-export const useStore = create<AtuinState>()((set) => ({
+export const useStore = create<AtuinState>()((set, get) => ({
   user: DefaultUser,
   homeInfo: DefaultHomeInfo,
   aliases: [],
@@ -78,4 +80,23 @@ export const useStore = create<AtuinState>()((set) => ({
         console.log(e);
       });
   },
+
+  historyNextPage: (query?: string) => {
+    let history = get().shellHistory;
+    let offset = history.length - 1;
+
+    if (query) {
+      invoke("search", { query: query, offset: offset })
+        .then((res: any) => {
+          set({ shellHistory: [...history, ...res] });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    } else {
+      invoke("list", { offset: offset }).then((res: any) => {
+        set({ shellHistory: [...history, ...res] });
+      });
+    }
+  },
 }));