File size: 2,890 Bytes
76aa260
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c29ae51
76aa260
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<script lang="ts">

	import { getContext, onMount } from 'svelte';

	import { formatFileSize, getLineCount } from '$lib/utils';



	const i18n = getContext('i18n');



	import Modal from './Modal.svelte';

	import XMark from '../icons/XMark.svelte';

	import Info from '../icons/Info.svelte';

	import Switch from './Switch.svelte';

	import Tooltip from './Tooltip.svelte';



	export let item;

	export let show = false;



	export let edit = false;



	let enableFullContent = false;



	onMount(() => {

		console.log(item);



		if (item?.context === 'full') {

			enableFullContent = true;

		}

	});

</script>

<Modal bind:show size="lg">
	<div class="font-primary px-6 py-5 w-full flex flex-col justify-center dark:text-gray-400">

		<div class=" pb-2">

			<div class="flex items-start justify-between">

				<div>

					<div class=" font-medium text-lg dark:text-gray-100">

						<a

							href={item.url ? (item.type === 'file' ? `${item.url}/content` : `${item.url}`) : '#'}

							target="_blank"

							class="hover:underline line-clamp-1"

						>

							{item?.name ?? 'File'}

						</a>

					</div>

				</div>



				<div>

					<button

						on:click={() => {

							show = false;

						}}

					>

						<XMark />

					</button>

				</div>

			</div>

			<div>

				<div class="flex flex-col items-center md:flex-row gap-1 justify-between w-full">

					<div class=" flex flex-wrap text-sm gap-1 text-gray-500">

						{#if item.size}

							<div class="capitalize shrink-0">{formatFileSize(item.size)}</div>


						{/if}



						{#if item?.file?.data?.content}

							<div class="capitalize shrink-0">

								{getLineCount(item?.file?.data?.content ?? '')} extracted lines

							</div>



							<div class="flex items-center gap-1 shrink-0">

								<Info />



								Formatting may be inconsistent from source.

							</div>

						{/if}

					</div>



					{#if edit}

						<div>

							<Tooltip

								content={enableFullContent

									? 'Inject the entire document as context for comprehensive processing, this is recommended for complex queries.'

									: 'Default to segmented retrieval for focused and relevant content extraction, this is recommended for most cases.'}

							>

								<div class="flex items-center gap-1.5 text-xs">

									{#if enableFullContent}

										Using Entire Document

									{:else}

										Using Focused Retrieval

									{/if}

									<Switch

										bind:state={enableFullContent}

										on:change={(e) => {

											item.context = e.detail ? 'full' : undefined;

										}}

									/>

								</div>

							</Tooltip>

						</div>

					{/if}

				</div>
			</div>
		</div>

		<div class="max-h-96 overflow-scroll scrollbar-hidden text-xs whitespace-pre-wrap">

			{item?.file?.data?.content ?? 'No content'}

		</div>
	</div>
</Modal>