Trim sentences (#464)

agnaistic · Jun 29, 2023 · 80274ad · 80274ad
1 parent 7abfe2c
commit 80274ad
Show file tree

Hide file tree

Showing 13 changed files with 335 additions and 176 deletions.
diff --git a/common/types/ui.ts b/common/types/ui.ts
@@ -57,6 +57,7 @@ export type UISettings = {
   viewHeight?: number
 
   chatWidth?: ChatWidth
+  trimSentences?: boolean
   logPromptsToBrowserConsole: boolean
 
   dark: CustomUI

diff --git a/common/util.ts b/common/util.ts
@@ -101,3 +101,14 @@ export function neat(params: TemplateStringsArray, ...rest: string[]) {
     .join('\n')
     .trim()
 }
+
+const end = `."'*!?)}]\``.split('')
+export function trimSentence(text: string) {
+  const last = end.reduce((last, char) => {
+    const index = text.lastIndexOf(char)
+    return index > last ? index : last
+  }, -1)
+
+  if (last === -1) return text
+  return text.slice(0, last + 1)
+}
diff --git a/web/App.tsx b/web/App.tsx
@@ -32,6 +32,7 @@ import { getMaxChatWidth } from './shared/util'
 import FAQ from './pages/Home/FAQ'
 import CreateChatForm from './pages/Chat/CreateChatForm'
 import Modal from './shared/Modal'
+import { ContextProvider, useAppContext } from './store/context'
 
 const App: Component = () => {
   const state = userStore()
@@ -96,6 +97,7 @@ const App: Component = () => {
 }
 
 const Layout: Component = () => {
+  const [ctx] = useAppContext()
   const state = userStore()
   const cfg = settingStore()
   const location = useLocation()
@@ -136,44 +138,51 @@ const Layout: Component = () => {
   })
 
   return (
-    <div class="scrollbar-thin scrollbar-thumb-white/10 scrollbar-track-[var(--hl-900)] app flex flex-col justify-between">
-      <NavBar />
-      <div class="flex w-full grow flex-row overflow-y-hidden">
-        <Navigation />
-        <div class="w-full overflow-y-auto" data-background style={bg()}>
-          <div
-            class={`mx-auto h-full min-h-full w-full ${maxW()} px-2 sm:px-3`}
-            classList={{ 'content-background': !isChat() }}
-          >
-            <Show when={cfg.init}>
-              <Outlet />
-              <Maintenance />
-            </Show>
-            <Show when={!cfg.init && cfg.initLoading}>
-              <div class="flex h-[80vh] items-center justify-center">
-                <Loading />
-              </div>
-            </Show>
+    <ContextProvider>
+      <div class="scrollbar-thin scrollbar-thumb-white/10 scrollbar-track-[var(--hl-900)] app flex flex-col justify-between">
+        <NavBar />
+        <div class="flex w-full grow flex-row overflow-y-hidden">
+          <Navigation />
+          <div class="w-full overflow-y-auto" data-background style={bg()}>
+            <div
+              class={`mx-auto h-full min-h-full w-full ${maxW()} px-2 sm:px-3`}
+              classList={{ 'content-background': !isChat() }}
+            >
+              <Show when={cfg.init}>
+                <Outlet />
+                <Maintenance />
+              </Show>
+              <Show when={!cfg.init && cfg.initLoading}>
+                <div class="flex h-[80vh] items-center justify-center">
+                  <Loading />
+                </div>
+              </Show>
 
-            <Show when={!cfg.init && !cfg.initLoading}>
-              <div class="flex flex-col items-center gap-2">
-                <div>Agnaistic failed to load</div>
-                <div>
-                  <Button onClick={reload}>Try Again</Button>
+              <Show when={!cfg.init && !cfg.initLoading}>
+                <div class="flex flex-col items-center gap-2">
+                  <div>Agnaistic failed to load</div>
+                  <div>
+                    <Button onClick={reload}>Try Again</Button>
+                  </div>
                 </div>
-              </div>
-            </Show>
+              </Show>
+            </div>
           </div>
         </div>
+        <Toasts />
+        <ImpersonateModal
+          show={cfg.showImpersonate}
+          close={() => settingStore.toggleImpersonate(false)}
+        />
+        <InfoModal />
+        <For each={rootModals.modals}>{(modal) => modal.element}</For>
+        <Show when={ctx.tooltip}>
+          <div class="absolute bottom-0 left-0 right-0 top-0 m-auto h-12 w-12 bg-red-500">
+            {ctx.tooltip}
+          </div>
+        </Show>
       </div>
-      <Toasts />
-      <ImpersonateModal
-        show={cfg.showImpersonate}
-        close={() => settingStore.toggleImpersonate(false)}
-      />
-      <InfoModal />
-      <For each={rootModals.modals}>{(modal) => modal.element}</For>
-    </div>
+    </ContextProvider>
   )
 }
 

diff --git a/web/pages/Chat/ChatDetail.tsx b/web/pages/Chat/ChatDetail.tsx
@@ -509,11 +509,7 @@ const ChatDetail: Component = () => {
                       {(msg, i) => (
                         <Message
                           msg={msg}
-                          botMap={chars.botMap}
-                          chat={chats.chat!}
-                          char={chats.char!}
                           editing={chats.opts.editing}
-                          anonymize={cfg.anonymize}
                           last={i() === indexOfLastRPMessage()}
                           onRemove={() => setRemoveId(msg._id)}
                           swipe={
@@ -543,13 +539,9 @@ const ChatDetail: Component = () => {
                     </For>
                     <Show when={waitingMsg()}>
                       <Message
-                        botMap={chars.botMap}
                         msg={waitingMsg()!}
-                        char={chars.botMap[waitingMsg()?.characterId!]}
-                        chat={chats.chat!}
                         onRemove={() => {}}
                         editing={chats.opts.editing}
-                        anonymize={cfg.anonymize}
                         sendMessage={sendMessage}
                         isPaneOpen={!!chatStore().opts.pane}
                         avatars={avatars.avatars()}

diff --git a/web/pages/Chat/Convertible.tsx b/web/pages/Chat/Convertible.tsx
@@ -58,7 +58,7 @@ const WithinPage: Component<PartialProps> = (props) => {
       <Match when={paneOrPopup() === 'pane'}>
         <div
           data-pane
-          class="relative hidden w-full min-w-[448px]  overflow-y-auto py-3 xs:block"
+          class="hidden w-full min-w-[448px]  overflow-y-auto py-3 xs:block"
           style={rightPaneBgStyles()}
         >
           <div onClick={props.close} class="sticky top-0 float-right cursor-pointer">