Refactor: core init: renamed models folder and moved features/connect…

…ions

src/components/ChatBoxInputRow.tsx

@@ -3,10 +3,10 @@ import _ from 'lodash'
 import { observer } from 'mobx-react-lite'
 import TextareaAutosize from 'react-textarea-autosize'
 
-import { chatStore } from '~/models/ChatStore'
-import { settingStore } from '~/models/SettingStore'
-import { personaStore } from '~/models/PersonaStore'
-import { incomingMessageStore } from '~/models/IncomingMessageStore'
+import { chatStore } from '~/core/ChatStore'
+import { settingStore } from '~/core/SettingStore'
+import { personaStore } from '~/core/PersonaStore'
+import { incomingMessageStore } from '~/core/IncomingMessageStore'
 
 import AttachmentWrapper from '~/components/AttachmentWrapper'
 import CachedImage from '~/components/CachedImage'
@@ -17,7 +17,7 @@ import Paperclip from '~/icons/Paperclip'
 import ChevronDown from '~/icons/ChevronDown'
 
 import { lightboxStore } from '~/features/lightbox/LightboxStore'
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
 
 const ChatBoxInputRow = observer(
   ({
@@ -199,11 +199,11 @@ const ChatBoxInputRow = observer(
           className={' h-full min-h-fit w-full ' + (inputDisabled ? 'bg-base-200' : '')}
           onSubmit={onFormSubmit}
         >
-          <div className="join-item flex w-full flex-col md:flex-row justify-between md:gap-2 bg-base-200 align-middle">
+          <div className="join-item flex w-full flex-col justify-between bg-base-200 align-middle md:flex-row md:gap-2">
             <button
               tabIndex={0}
               type="button"
-              className="btn hidden md:flex btn-active rounded-none rounded-bl-md"
+              className="btn btn-active hidden rounded-none rounded-bl-md md:flex"
               disabled={inputDisabled || connectionModelStore.isImageGenerationMode}
               onClick={() => settingStore.openSettingsModal('personas')}
             >

src/components/ChatBoxPrompt.tsx

@@ -2,14 +2,14 @@ import { PropsWithChildren, useMemo } from 'react'
 import _ from 'lodash'
 import { observer } from 'mobx-react-lite'
 
-import { chatStore } from '~/models/ChatStore'
-import { settingStore } from '~/models/SettingStore'
-import { personaStore } from '~/models/PersonaStore'
+import { chatStore } from '~/core/ChatStore'
+import { settingStore } from '~/core/SettingStore'
+import { personaStore } from '~/core/PersonaStore'
 
 import AttachmentWrapper from '~/components/AttachmentWrapper'
 import FunTitle from '~/components/FunTitle'
 import ToolTip from '~/components/Tooltip'
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
 
 type StepProps = { isCompleted?: boolean; type?: 'primary' | 'secondary'; inCompleteIcon?: string }
 
@@ -98,7 +98,7 @@ const ChatBoxPrompt = observer(() => {
                   className="link ml-1 decoration-secondary"
                   onClick={() => settingStore.openSettingsModal('personas')}
                 >
-                  Persona <span className='text-xs'>(aka System Prompt)</span>
+                  Persona <span className="text-xs">(aka System Prompt)</span>
                 </button>
 
                 {'to give your bot some pizzaz'}

src/components/EnabledCheckbox.tsx

@@ -2,8 +2,8 @@ import { observer } from 'mobx-react-lite'
 import { Control, Controller } from 'react-hook-form'
 import { SnapshotIn } from 'mobx-state-tree'
 
-import { IConnectionDataModel } from '~/models/types'
-import { ServerConnectionTypes } from '~/features/connections/servers'
+import { IConnectionDataModel } from '~/core/types'
+import { ServerConnectionTypes } from '~/core/connections/servers'
 
 type EnabledCheckboxProps = {
   connection: ServerConnectionTypes
@@ -17,8 +17,10 @@ const EnabledCheckbox = observer(({ control, connection }: EnabledCheckboxProps)
     <Controller
       render={({ field: { value, onChange } }) => {
         return (
-          <label className="label w-full md:w-fit gap-2 flex flex-col md:flex-row">
-            <span className="label-text text-lg md:text-medium text-center">{connection.enabledLabel}</span>
+          <label className="label flex w-full flex-col gap-2 md:w-fit md:flex-row">
+            <span className="label-text text-center text-lg md:text-medium">
+              {connection.enabledLabel}
+            </span>
 
             <div className="join mx-auto">
               {[true, false].map((isEnabledOption, index) => (

src/components/FunTitle.tsx

@@ -2,7 +2,7 @@ import { useMemo } from 'react'
 import { observer } from 'mobx-react-lite'
 import _ from 'lodash'
 
-import { settingStore } from '~/models/SettingStore'
+import { settingStore } from '~/core/SettingStore'
 
 const xWords = [
   'Excellence',

src/components/HostInput.tsx

@@ -2,14 +2,14 @@ import { observer } from 'mobx-react-lite'
 import { SnapshotIn } from 'mobx-state-tree'
 import { Controller, useFormContext } from 'react-hook-form'
 
-import { settingStore } from '~/models/SettingStore'
+import { settingStore } from '~/core/SettingStore'
 
 import Question from '~/icons/Question'
 import Refresh from '~/icons/Refresh'
 
 import FormInput from '~/components/form/FormInput'
-import { ServerConnectionTypes } from '~/features/connections/servers'
-import { IConnectionDataModel } from '~/models/types'
+import { ServerConnectionTypes } from '~/core/connections/servers'
+import { IConnectionDataModel } from '~/core/types'
 
 type HostInputProps = {
   connection: ServerConnectionTypes

src/components/Message.tsx

@@ -4,9 +4,9 @@ import { observer } from 'mobx-react-lite'
 
 import Stop from '~/icons/Stop'
 
-import { IMessageModel } from '~/models/MessageModel'
-import { chatStore } from '~/models/ChatStore'
-import { incomingMessageStore } from '~/models/IncomingMessageStore'
+import { IMessageModel } from '~/core/MessageModel'
+import { chatStore } from '~/core/ChatStore'
+import { incomingMessageStore } from '~/core/IncomingMessageStore'
 
 const LazyMessage = React.lazy(() => import('~/components/message/LazyMessage'))
 

src/components/ModelRefreshButton.tsx

@@ -1,7 +1,7 @@
 import { observer } from 'mobx-react-lite'
 
 import Refresh from '~/icons/Refresh'
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
 
 const ModelRefreshButton = observer(
   ({ small = false, shouldShow = false }: { small?: boolean; shouldShow?: boolean }) => {

src/components/ModelSelector.tsx

@@ -3,8 +3,8 @@ import { observer } from 'mobx-react-lite'
 import _ from 'lodash'
 
 import ChevronDown from '~/icons/ChevronDown'
-import { settingStore } from '~/models/SettingStore'
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
+import { settingStore } from '~/core/SettingStore'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
 
 const ModelSelector = observer(() => {
   const { selectedModelLabel, isAnyServerConnected, selectedConnection } = connectionModelStore

src/components/Navbar.tsx

@@ -7,8 +7,8 @@ import ModelRefreshButton from '~/components/ModelRefreshButton'
 import FunTitle from '~/components/FunTitle'
 import ToolTip from '~/components/Tooltip'
 
-import { settingStore } from '~/models/SettingStore'
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
+import { settingStore } from '~/core/SettingStore'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
 
 import Warning from '~/icons/Warning'
 import Bars3 from '~/icons/Bars3'

src/components/OmniBar.tsx

@@ -15,13 +15,13 @@ import type { Action, ActionImpl } from 'kbar'
 import { autorun } from 'mobx'
 import _ from 'lodash'
 
-import { settingStore } from '~/models/SettingStore'
-import { personaStore } from '~/models/PersonaStore'
-import { chatStore } from '~/models/ChatStore'
-import type { IMessageModel } from '~/models/MessageModel'
+import { settingStore } from '~/core/SettingStore'
+import { personaStore } from '~/core/PersonaStore'
+import { chatStore } from '~/core/ChatStore'
+import type { IMessageModel } from '~/core/MessageModel'
 
 import DaisyUiThemeProvider from '~/containers/DaisyUiThemeProvider'
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
 
 const isSelected = ({ parent, id }: ActionImpl) => {
   if (parent === 'theme') {
@@ -181,7 +181,7 @@ const useRegisterModelActions = () => {
           keywords: `model refresh ` + typeAndLabel,
           priority: Priority.LOW,
           perform: () => connection.fetchLmModels(),
-          parent:'refresh_models'
+          parent: 'refresh_models',
         })
 
         connection.models.forEach(model => {

src/components/ThemeSelector.tsx

@@ -3,7 +3,7 @@ import { observer } from 'mobx-react-lite'
 import { useState } from 'react'
 
 import ChevronDown from '~/icons/ChevronDown'
-import { settingStore } from '~/models/SettingStore'
+import { settingStore } from '~/core/SettingStore'
 
 const themes: Record<string, string> = {
   _system: 'System theme',

src/components/ToastCenter.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'
 import _ from 'lodash'
 import { observer } from 'mobx-react-lite'
 
-import { toastStore } from '~/models/ToastStore'
+import { toastStore } from '~/core/ToastStore'
 
 const ToastCenter = observer(() => {
   const [hovering, setHovering] = useState(false)
@@ -33,7 +33,7 @@ const ToastCenter = observer(() => {
 
   return (
     <div
-      className="z-30 bg-transparent w-full gap-3"
+      className="z-30 w-full gap-3 bg-transparent"
       onMouseEnter={() => setHovering(true)}
       onMouseLeave={() => setHovering(false)}
     >
@@ -42,7 +42,7 @@ const ToastCenter = observer(() => {
           className={`alert alert-${toast.type} relative rounded-md border border-base-content/30 px-4 text-xl font-bold`}
           key={toast.id}
         >
-          <span className="cursor-default break-words whitespace-pre-wrap">{toast.message}</span>
+          <span className="cursor-default whitespace-pre-wrap break-words">{toast.message}</span>
 
           <div
             className="btn btn-xs absolute right-1 top-1 text-sm font-bold opacity-50"

src/components/chat/ChatListSection.tsx

@@ -8,8 +8,8 @@ import Tooltip from '~/components/Tooltip'
 import DocumentArrowUp from '~/icons/DocumentArrowUp'
 import Edit from '~/icons/Edit'
 
-import { IChatModel } from '~/models/ChatModel'
-import { chatStore } from '~/models/ChatStore'
+import { IChatModel } from '~/core/ChatModel'
+import { chatStore } from '~/core/ChatStore'
 
 export const ChatListSection = observer(({ onChatSelected }: { onChatSelected: () => void }) => {
   const handleChatSelected = (chat: IChatModel) => {

src/components/chat/ChatSettingsSection.tsx

@@ -3,7 +3,7 @@ import _ from 'lodash'
 import { observer } from 'mobx-react-lite'
 import { Controller, useForm } from 'react-hook-form'
 
-import { chatStore } from '~/models/ChatStore'
+import { chatStore } from '~/core/ChatStore'
 
 import Check from '~/icons/Check'
 import Delete from '~/icons/Delete'
@@ -97,7 +97,7 @@ export const ChatSettingsSection = observer(({ onBackClicked }: { onBackClicked:
             <div className="flex flex-col gap-2 rounded-box bg-base-300 text-base-content">
               <form className="flex w-full flex-row gap-2" onSubmit={handleFormSubmit}>
                 <Controller
-                  render={({field}) => (
+                  render={({ field }) => (
                     <FormInput
                       id={chat.id + ''}
                       label="Name"

src/components/message/LazyMessage.tsx

@@ -18,10 +18,10 @@ import WindowCheck from '~/icons/WindowCheck'
 import PlayPause from '~/icons/PlayPause'
 import Stop from '~/icons/Stop'
 
-import { chatStore } from '~/models/ChatStore'
-import { incomingMessageStore } from '~/models/IncomingMessageStore'
-import { IMessageModel } from '~/models/MessageModel'
-import { settingStore } from '~/models/SettingStore'
+import { chatStore } from '~/core/ChatStore'
+import { incomingMessageStore } from '~/core/IncomingMessageStore'
+import { IMessageModel } from '~/core/MessageModel'
+import { settingStore } from '~/core/SettingStore'
 
 import { lightboxStore } from '~/features/lightbox/LightboxStore'
 
@@ -137,7 +137,7 @@ const LazyMessage = observer(
         <Markdown
           remarkPlugins={[[remarkGfm, { singleTilde: false }], remarkMath]}
           rehypePlugins={[[rehypeKatex, { output: 'mathml' }]]}
-          className="prose-spacing rtts-markdown prose flex w-full flex-wrap overflow-x-hidden overscroll-none prose-p:w-full -[&>*]:w-full"
+          className="prose-spacing rtts-markdown -[&>*]:w-full prose flex w-full flex-wrap overflow-x-hidden overscroll-none prose-p:w-full"
           components={{
             code: DelayedCustomCodeBlock,
             math: CustomMathBlock,
@@ -291,7 +291,7 @@ const LazyMessage = observer(
 
                 {error.stack && (
                   <div className="collapse-content">
-                    <p className="whitespace-pre-line pt-2 text-xs break-all">{error.stack}</p>
+                    <p className="whitespace-pre-line break-all pt-2 text-xs">{error.stack}</p>
                   </div>
                 )}
               </div>

src/components/message/MessageGroup.tsx

@@ -5,7 +5,7 @@ import WindowClose from '~/icons/WindowClose'
 import WindowPlus from '~/icons/WindowPlus'
 import Delete from '~/icons/Delete'
 
-import { IMessageModel } from '~/models/MessageModel'
+import { IMessageModel } from '~/core/MessageModel'
 import ToolTip from '~/components/Tooltip'
 
 type MessageGroupType = PropsWithChildren<{
@@ -41,7 +41,7 @@ const MessageGroup = observer(({ message, children, onAddMoreVariations }: Messa
 
         <ToolTip label="Add 3 more variations" placement="top" delay={400}>
           <button
-            className="text-sm opacity-30 hover:scale-105 hover:opacity-100 ml-auto"
+            className="ml-auto text-sm opacity-30 hover:scale-105 hover:opacity-100"
             onClick={onAddMoreVariations}
           >
             <WindowPlus />

src/components/message/MessageVariationSelectionRow.tsx

@@ -4,7 +4,7 @@ import ChevronDown from '~/icons/ChevronDown'
 import Delete from '~/icons/Delete'
 import WindowView from '~/icons/WindowView'
 
-import { IMessageModel } from '~/models/MessageModel'
+import { IMessageModel } from '~/core/MessageModel'
 import ToolTip from '~/components/Tooltip'
 
 const MessageVariationSelectionRow = observer(
@@ -30,7 +30,7 @@ const MessageVariationSelectionRow = observer(
           <ChevronDown className="!h-3 !w-3 rotate-90" />
         </button>
 
-        <span className="text-sm opacity-30 whitespace-nowrap">
+        <span className="whitespace-nowrap text-sm opacity-30">
           {selectedVariationIndex + 1} / {variations.length + 1}
         </span>
 

src/containers/ChatBox.tsx

@@ -3,9 +3,9 @@ import { observer } from 'mobx-react-lite'
 import ScrollableFeed from 'react-scrollable-feed'
 import _ from 'lodash'
 
-import { chatStore } from '~/models/ChatStore'
-import { IMessageModel } from '~/models/MessageModel'
-import { incomingMessageStore } from '~/models/IncomingMessageStore'
+import { chatStore } from '~/core/ChatStore'
+import { IMessageModel } from '~/core/MessageModel'
+import { incomingMessageStore } from '~/core/IncomingMessageStore'
 
 import ChatBoxInputRow from '~/components/ChatBoxInputRow'
 import ChatBoxPrompt from '~/components/ChatBoxPrompt'

src/containers/DaisyUiThemeProvider.tsx

@@ -2,7 +2,7 @@ import { useEffect, useMemo, type PropsWithChildren } from 'react'
 import { observer } from 'mobx-react-lite'
 import useMedia from 'use-media'
 
-import { settingStore } from '~/models/SettingStore'
+import { settingStore } from '~/core/SettingStore'
 
 const DaisyUiThemeProvider = observer(({ children }: PropsWithChildren) => {
   const selectedTheme = settingStore.theme

src/containers/SideBar.tsx

@@ -5,8 +5,8 @@ import useMedia from 'use-media'
 import { ChatSettingsSection } from '~/components/chat/ChatSettingsSection'
 import { ChatListSection } from '~/components/chat/ChatListSection'
 
-import { chatStore } from '~/models/ChatStore'
-import { settingStore } from '~/models/SettingStore'
+import { chatStore } from '~/core/ChatStore'
+import { settingStore } from '~/core/SettingStore'
 
 import MediaEject from '~/icons/MediaEject'
 

src/models/ChatModel.ts → src/core/ChatModel.ts

@@ -2,15 +2,15 @@ import _ from 'lodash'
 import { types, Instance, cast, destroy, flow } from 'mobx-state-tree'
 import moment from 'moment'
 
-import { IMessageModel, MessageModel } from '~/models/MessageModel'
-import { toastStore } from '~/models/ToastStore'
-import { incomingMessageStore } from '~/models/IncomingMessageStore'
+import { IMessageModel, MessageModel } from '~/core/MessageModel'
+import { toastStore } from '~/core/ToastStore'
+import { incomingMessageStore } from '~/core/IncomingMessageStore'
 
 import base64EncodeImage from '~/utils/base64EncodeImage'
 import CachedStorage from '~/utils/CachedStorage'
 
-import { connectionModelStore } from '~/features/connections/ConnectionModelStore'
-import BaseApi from '~/features/connections/api/BaseApi'
+import { connectionModelStore } from '~/core/connections/ConnectionModelStore'
+import BaseApi from '~/core/connections/api/BaseApi'
 
 export const ChatModel = types
   .model({

src/models/ChatStore.ts → src/core/ChatStore.ts

@@ -2,7 +2,7 @@ import { types, destroy, Instance } from 'mobx-state-tree'
 import persist from 'mst-persist'
 import _ from 'lodash'
 
-import { ChatModel, IChatModel } from '~/models/ChatModel'
+import { ChatModel, IChatModel } from '~/core/ChatModel'
 
 export const ChatStore = types
   .model({