klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-03 13:19:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make loading message, styling configurable. Do not show agent when no data

Browse Source 
- Pass Loading message, class name via props to both inline and normal
  loading spinners
- Pass loading conversation message to loading spinner when chat
  history is being fetched
This commit is contained in:
Debanjum Singh Solanky
2024-07-14 12:58:29 +05:30
parent 63719747cb
commit c2bf405489
2 changed files with 22 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/interface/web/app/components/loading/loading.tsx
View File

@@ -1,22 +1,23 @@
import { CircleNotch } from '@phosphor-icons/react';
export default function Loading() {
interface LoadingProps {
className?: string;
message?: string;
}
export default function Loading(props: LoadingProps) {
return (
// NOTE: We can display usage tips here for casual learning moments.
<div className={`bg-background opacity-50 flex items-center justify-center h-screen`}>
<div>Loading <span><CircleNotch className={`inline animate-spin h-5 w-5`} /></span></div>
<div className={props.className || "bg-background opacity-50 flex items-center justify-center h-screen"}>
<div>{props.message || "Loading" } <span><CircleNotch className="inline animate-spin h-5 w-5" /></span></div>
</div>
);
}
interface InlineLoadingProps {
className?: string;
}
export function InlineLoading(props: InlineLoadingProps) {
export function InlineLoading(props: LoadingProps) {
return (
<button className={`${props.className}`}>
<CircleNotch className={`animate-spin h-5 w-5 mt-3 mr-3`} />
<span>{props.message} <CircleNotch className="inline animate-spin h-5 w-5 mx-3" /></span>
</button>
)
}