Skip to content

Commit 80a4a09

Browse files
dartpaindartpain
committed
lint
1 parent 70e1560 commit 80a4a09

File tree

10 files changed

+193
-133
lines changed

10 files changed

+193
-133
lines changed

‎frontend/src/About.tsx‎

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import DocsGPT3 from './assets/cute_docsgpt3.svg';
55
export default function About() {
66
return (
77
<div className="mx-5 grid min-h-screen md:mx-36">
8-
<article className="place-items-left mx-auto my-auto flex w-full max-w-6xl flex-col gap-4 rounded-3xl bg-gray-100 dark:bg-gun-metal p-6 text-jet dark:text-bright-gray lg:p-6 xl:p-10">
8+
<article className="place-items-left mx-auto my-auto flex w-full max-w-6xl flex-col gap-4 rounded-3xl bg-gray-100 p-6 text-jet dark:bg-gun-metal dark:text-bright-gray lg:p-6 xl:p-10">
99
<div className="flex items-center">
1010
<p className="mr-2 text-3xl">About DocsGPT</p>
1111
<img className="h14 mb-2" src={DocsGPT3} alt="DocsGPT" />
@@ -31,23 +31,34 @@ export default function About() {
3131
</p>
3232
<p className="mt-4 ml-2">
3333
1. Navigate to{' '}
34-
<span className="bg-gray-200 dark:bg-outer-space italic"> /application</span> folder
34+
<span className="bg-gray-200 italic dark:bg-outer-space">
35+
{' '}
36+
/application
37+
</span>{' '}
38+
folder
3539
</p>
3640
<p className="mt-4 ml-2">
3741
2. Install dependencies from{' '}
38-
<span className="bg-gray-200 dark:bg-outer-space italic">
42+
<span className="bg-gray-200 italic dark:bg-outer-space">
3943
pip install -r requirements.txt
4044
</span>
4145
</p>
4246
<p className="mt-4 ml-2">
43-
3. Prepare a <span className="bg-gray-200 dark:bg-outer-space italic">.env</span> file.
44-
Copy <span className="bg-gray-200 dark:bg-outer-space italic">.env_sample</span> and
45-
create <span className="bg-gray-200 dark:bg-outer-space italic">.env</span> with your
46-
OpenAI API token
47+
3. Prepare a{' '}
48+
<span className="bg-gray-200 italic dark:bg-outer-space">.env</span>{' '}
49+
file. Copy{' '}
50+
<span className="bg-gray-200 italic dark:bg-outer-space">
51+
.env_sample
52+
</span>{' '}
53+
and create{' '}
54+
<span className="bg-gray-200 italic dark:bg-outer-space">.env</span>{' '}
55+
with your OpenAI API token
4756
</p>
4857
<p className="mt-4 ml-2">
4958
4. Run the app with{' '}
50-
<span className="bg-gray-200 dark:bg-outer-space italic">python app.py</span>
59+
<span className="bg-gray-200 italic dark:bg-outer-space">
60+
python app.py
61+
</span>
5162
</p>
5263
</div>
5364

‎frontend/src/App.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import About from './About';
55
import PageNotFound from './PageNotFound';
66
import { inject } from '@vercel/analytics';
77
import { useMediaQuery } from './hooks';
8-
import { useState} from 'react';
8+
import { useState } from 'react';
99
import Setting from './Setting';
1010

1111
inject();
@@ -32,4 +32,4 @@ export default function App() {
3232
</div>
3333
</div>
3434
);
35-
}
35+
}

‎frontend/src/Hero.tsx‎

Lines changed: 47 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,14 @@ import DocsGPT3 from './assets/cute_docsgpt3.svg';
44
export default function Hero({ className = '' }: { className?: string }) {
55
// const isMobile = window.innerWidth <= 768;
66
const { isMobile } = useMediaQuery();
7-
const [isDarkTheme] = useDarkTheme()
7+
const [isDarkTheme] = useDarkTheme();
88
return (
9-
<div className={`mt-14 ${isMobile ? 'mb-2' : 'mb-12'} flex flex-col text-black-1000 dark:text-bright-gray`}>
9+
<div
10+
className={`mt-14 ${
11+
isMobile ? 'mb-2' : 'mb-12'
12+
} flex flex-col text-black-1000 dark:text-bright-gray`}
13+
>
1014
<div className=" mb-2 flex items-center justify-center sm:mb-10">
11-
1215
<p className="mr-2 text-4xl font-semibold">DocsGPT</p>
1316
<img className="mb-2 h-14" src={DocsGPT3} alt="DocsGPT" />
1417
</div>
@@ -36,20 +39,24 @@ export default function Hero({ className = '' }: { className?: string }) {
3639
</>
3740
)}
3841
<div
39-
className={`sections ${isMobile ? '' : 'mt-1'
40-
} flex flex-wrap items-center justify-center gap-2 sm:gap-1 md:gap-0`}
42+
className={`sections ${
43+
isMobile ? '' : 'mt-1'
44+
} flex flex-wrap items-center justify-center gap-2 sm:gap-1 md:gap-0`}
4145
>
4246
{/* first */}
43-
<div className="h-auto md:h-60 rounded-[50px] bg-gradient-to-l from-[#6EE7B7]/70 dark:from-[#D16FF8] via-[#3B82F6] dark:via-[#48E6E0] to-[#9333EA]/50 dark:to-[#C85EF6] p-1 md:rounded-tr-none md:rounded-br-none">
47+
<div className="h-auto rounded-[50px] bg-gradient-to-l from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1 dark:from-[#D16FF8] dark:via-[#48E6E0] dark:to-[#C85EF6] md:h-60 md:rounded-tr-none md:rounded-br-none">
4448
<div
45-
className={`h-full rounded-[45px] bg-white dark:bg-dark-charcoal p-${isMobile ? '3.5' : '6 py-8'
46-
} md:rounded-tr-none md:rounded-br-none`}
49+
className={`h-full rounded-[45px] bg-white dark:bg-dark-charcoal p-${
50+
isMobile ? '3.5' : '6 py-8'
51+
} md:rounded-tr-none md:rounded-br-none`}
4752
>
4853
{/* Add Mobile check here */}
4954
{isMobile ? (
5055
<div className="flex justify-center">
5156
<img
52-
src={isDarkTheme ? "/message-text-dark.svg" : "/message-text.svg"}
57+
src={
58+
isDarkTheme ? '/message-text-dark.svg' : '/message-text.svg'
59+
}
5360
alt="lock"
5461
className="h-[24px] w-[24px] "
5562
/>
@@ -60,7 +67,9 @@ export default function Hero({ className = '' }: { className?: string }) {
6067
) : (
6168
<>
6269
<img
63-
src={isDarkTheme ? "/message-text-dark.svg" : "/message-text.svg"}
70+
src={
71+
isDarkTheme ? '/message-text-dark.svg' : '/message-text.svg'
72+
}
6473
alt="lock"
6574
className="h-[24px] w-[24px]"
6675
/>
@@ -84,22 +93,31 @@ export default function Hero({ className = '' }: { className?: string }) {
8493
</div>
8594
</div>
8695
{/* second */}
87-
<div className="h-auto md:h-60 rounded-[50px] bg-gradient-to-r from-[#6EE7B7]/70 dark:from-[#D16FF8] via-[#3B82F6] dark:via-[#48E6E0] to-[#9333EA]/50 dark:to-[#C85EF6] p-1 md:rounded-none md:py-1 md:px-0">
96+
<div className="h-auto rounded-[50px] bg-gradient-to-r from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1 dark:from-[#D16FF8] dark:via-[#48E6E0] dark:to-[#C85EF6] md:h-60 md:rounded-none md:py-1 md:px-0">
8897
<div
89-
className={`h-full rounded-[45px] bg-white dark:bg-dark-charcoal p-${isMobile ? '3.5' : '6 py-6'
90-
} md:rounded-none`}
98+
className={`h-full rounded-[45px] bg-white dark:bg-dark-charcoal p-${
99+
isMobile ? '3.5' : '6 py-6'
100+
} md:rounded-none`}
91101
>
92102
{/* Add Mobile check here */}
93103
{isMobile ? (
94104
<div className="flex justify-center ">
95-
<img src={isDarkTheme ? "/lock-dark.svg" : "/lock.svg"} alt="lock" className="h-[24px] w-[24px]" />
105+
<img
106+
src={isDarkTheme ? '/lock-dark.svg' : '/lock.svg'}
107+
alt="lock"
108+
className="h-[24px] w-[24px]"
109+
/>
96110
<h2 className="mb-0 pl-1 text-lg font-bold">
97111
Secure Data Storage
98112
</h2>
99113
</div>
100114
) : (
101115
<>
102-
<img src={isDarkTheme ? "/lock-dark.svg" : "/lock.svg"} alt="lock" className="h-[24px] w-[24px]" />
116+
<img
117+
src={isDarkTheme ? '/lock-dark.svg' : '/lock.svg'}
118+
alt="lock"
119+
className="h-[24px] w-[24px]"
120+
/>
103121
<h2 className="mt-2 mb-3 text-lg font-bold">
104122
Secure Data Storage
105123
</h2>
@@ -120,16 +138,21 @@ export default function Hero({ className = '' }: { className?: string }) {
120138
</div>
121139
</div>
122140
{/* third */}
123-
<div className="h-auto md:h-60 rounded-[50px] bg-gradient-to-l from-[#6EE7B7]/70 dark:from-[#D16FF8] via-[#3B82F6] dark:via-[#48E6E0] to-[#9333EA]/50 dark:to-[#C85EF6] p-1 md:rounded-tl-none md:rounded-bl-none ">
141+
<div className="h-auto rounded-[50px] bg-gradient-to-l from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1 dark:from-[#D16FF8] dark:via-[#48E6E0] dark:to-[#C85EF6] md:h-60 md:rounded-tl-none md:rounded-bl-none ">
124142
<div
125-
className={`h-full firefox rounded-[45px] bg-white dark:bg-dark-charcoal p-${isMobile ? '3.5' : '6 px-6 '
126-
} lg:rounded-tl-none lg:rounded-bl-none`}
143+
className={`firefox h-full rounded-[45px] bg-white dark:bg-dark-charcoal p-${
144+
isMobile ? '3.5' : '6 px-6 '
145+
} lg:rounded-tl-none lg:rounded-bl-none`}
127146
>
128147
{/* Add Mobile check here */}
129148
{isMobile ? (
130149
<div className="flex justify-center">
131150
<img
132-
src={isDarkTheme ? "message-programming-dark.svg" : "/message-programming.svg"}
151+
src={
152+
isDarkTheme
153+
? 'message-programming-dark.svg'
154+
: '/message-programming.svg'
155+
}
133156
alt="lock"
134157
className="h-[24px] w-[24px]"
135158
/>
@@ -140,7 +163,11 @@ export default function Hero({ className = '' }: { className?: string }) {
140163
) : (
141164
<>
142165
<img
143-
src={isDarkTheme ? "/message-programming-dark.svg" : "/message-programming.svg"}
166+
src={
167+
isDarkTheme
168+
? '/message-programming-dark.svg'
169+
: '/message-programming.svg'
170+
}
144171
alt="lock"
145172
className="h-[24px] w-[24px]"
146173
/>

‎frontend/src/Setting.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import React, { useState, useEffect } from 'react';
22
import { useSelector, useDispatch } from 'react-redux';
3-
import Arrow2 from './assets/dropdown-arrow.svg';
43
import ArrowLeft from './assets/arrow-left.svg';
54
import ArrowRight from './assets/arrow-right.svg';
65
import Trash from './assets/trash.svg';

‎frontend/src/conversation/Conversation.tsx‎

Lines changed: 15 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
updateQuery,
1313
} from './conversationSlice';
1414
import Send from './../assets/send.svg';
15-
import SendDark from './../assets/send_dark.svg'
15+
import SendDark from './../assets/send_dark.svg';
1616
import Spinner from './../assets/spinner.svg';
1717
import { FEEDBACK, Query } from './conversationModels';
1818
import { sendFeedback } from './conversationApi';
@@ -29,9 +29,8 @@ export default function Conversation() {
2929
const [eventInterrupt, setEventInterrupt] = useState(false);
3030

3131
const handleUserInterruption = () => {
32-
if (!eventInterrupt && status === "loading")
33-
setEventInterrupt(true)
34-
}
32+
if (!eventInterrupt && status === 'loading') setEventInterrupt(true);
33+
};
3534
useEffect(() => {
3635
!eventInterrupt && scrollIntoView();
3736
}, [queries.length, queries[queries.length - 1]]);
@@ -48,8 +47,8 @@ export default function Conversation() {
4847
if (status !== 'idle') {
4948
fetchStream.current && fetchStream.current.abort(); //abort previous stream
5049
}
51-
}
52-
}, [status])
50+
};
51+
}, [status]);
5352

5453
useEffect(() => {
5554
const observerCallback: IntersectionObserverCallback = (entries) => {
@@ -76,12 +75,12 @@ export default function Conversation() {
7675
behavior: 'smooth',
7776
block: 'start',
7877
});
79-
}
78+
};
8079

8180
const handleQuestion = (question: string) => {
8281
question = question.trim();
8382
if (question === '') return;
84-
setEventInterrupt(false)
83+
setEventInterrupt(false);
8584
dispatch(addQuery({ prompt: question }));
8685
fetchStream.current = dispatch(fetchAnswer({ question }));
8786
};
@@ -134,12 +133,13 @@ export default function Conversation() {
134133
<div
135134
onWheel={handleUserInterruption}
136135
onTouchMove={handleUserInterruption}
137-
className="flex flex-col justify-center w-full p-4 md:flex-row">
136+
className="flex w-full flex-col justify-center p-4 md:flex-row"
137+
>
138138
{queries.length > 0 && !hasScrolledToLast && (
139139
<button
140140
onClick={scrollIntoView}
141141
aria-label="scroll to bottom"
142-
className="fixed bottom-32 right-14 z-10 flex h-7 w-7 items-center justify-center rounded-full border-[0.5px] border-gray-alpha bg-gray-100 dark:bg-purple-taupe bg-opacity-50 md:h-9 md:w-9 md:bg-opacity-100 "
142+
className="fixed bottom-32 right-14 z-10 flex h-7 w-7 items-center justify-center rounded-full border-[0.5px] border-gray-alpha bg-gray-100 bg-opacity-50 dark:bg-purple-taupe md:h-9 md:w-9 md:bg-opacity-100 "
143143
>
144144
<img
145145
src={ArrowDown}
@@ -155,7 +155,7 @@ export default function Conversation() {
155155
return (
156156
<Fragment key={index}>
157157
<ConversationBubble
158-
className={'last:mb-28 mb-7'}
158+
className={'mb-7 last:mb-28'}
159159
key={`${index}QUESTION`}
160160
message={query.prompt}
161161
type="QUESTION"
@@ -167,10 +167,8 @@ export default function Conversation() {
167167
})}
168168
</div>
169169
)}
170-
{queries.length === 0 && (
171-
<Hero className="mt-24 md:mt-52"></Hero>
172-
)}
173-
<div className="absolute bottom-0 flex w-11/12 md:w-[65%] flex-col items-end self-center bg-white dark:bg-raisin-black pt-4 md:fixed">
170+
{queries.length === 0 && <Hero className="mt-24 md:mt-52"></Hero>}
171+
<div className="absolute bottom-0 flex w-11/12 flex-col items-end self-center bg-white pt-4 dark:bg-raisin-black md:fixed md:w-[65%]">
174172
<div className="flex h-full w-full">
175173
<div
176174
id="inputbox"
@@ -179,7 +177,7 @@ export default function Conversation() {
179177
placeholder="Type your message here..."
180178
contentEditable
181179
onPaste={handlePaste}
182-
className={`border-000000 overflow-x-hidden max-h-24 min-h-[2.6rem] w-full overflow-y-auto whitespace-pre-wrap rounded-3xl border bg-white dark:bg-raisin-black dark:text-bright-gray py-2 pl-4 pr-9 text-base leading-7 opacity-100 focus:outline-none`}
180+
className={`border-000000 max-h-24 min-h-[2.6rem] w-full overflow-y-auto overflow-x-hidden whitespace-pre-wrap rounded-3xl border bg-white py-2 pl-4 pr-9 text-base leading-7 opacity-100 focus:outline-none dark:bg-raisin-black dark:text-bright-gray`}
183181
onKeyDown={(e) => {
184182
if (e.key === 'Enter' && !e.shiftKey) {
185183
e.preventDefault();
@@ -210,7 +208,7 @@ export default function Conversation() {
210208
</div>
211209
)}
212210
</div>
213-
<p className="text-gray-595959 dark:text-bright-gray bg-white dark:bg-raisin-black w-[100vw] self-center bg-transparent p-5 text-center text-xs md:w-full">
211+
<p className="text-gray-595959 w-[100vw] self-center bg-white bg-transparent p-5 text-center text-xs dark:bg-raisin-black dark:text-bright-gray md:w-full">
214212
DocsGPT uses GenAI, please review critial information using sources.
215213
</p>
216214
</div>

0 commit comments

Comments
 (0)