1
- import { PluginStatus } from "@/hooks/stores" ;
1
+ import { PluginStatus , usePluginStore } from "@/hooks/stores" ;
2
2
import Modal from "@components/Modal" ;
3
3
import AutoHeight from "@components/AutoHeight" ;
4
4
import Card , { GridCard } from "@components/Card" ;
@@ -33,6 +33,8 @@ function Dialog({ plugin, setOpen }: { plugin: PluginStatus | null, setOpen: (op
33
33
const [ loading , setLoading ] = useState ( false ) ;
34
34
const [ error , setError ] = useState < string | null > ( null ) ;
35
35
36
+ const { setIsPluginUploadModalOpen} = usePluginStore ( ) ;
37
+
36
38
useEffect ( ( ) => {
37
39
setLoading ( false ) ;
38
40
} , [ plugin ] )
@@ -73,6 +75,11 @@ function Dialog({ plugin, setOpen }: { plugin: PluginStatus | null, setOpen: (op
73
75
} ) ;
74
76
} , [ send , plugin , setOpen ] )
75
77
78
+ const uploadPlugin = useCallback ( ( ) => {
79
+ setOpen ( false ) ;
80
+ setIsPluginUploadModalOpen ( true ) ;
81
+ } , [ setIsPluginUploadModalOpen , setOpen ] )
82
+
76
83
return (
77
84
< AutoHeight >
78
85
< div className = "mx-auto max-w-4xl px-4 transition-all duration-300 ease-in-out" >
@@ -118,6 +125,30 @@ function Dialog({ plugin, setOpen }: { plugin: PluginStatus | null, setOpen: (op
118
125
</ div >
119
126
</ div >
120
127
128
+ < div className = "grid grid-cols-[auto,1fr] gap-x-4 text-sm text-black dark:text-white" >
129
+ < span className = "font-semibold" >
130
+ Name
131
+ </ span >
132
+ < span > { plugin ?. name } </ span >
133
+
134
+ < span className = "font-semibold" >
135
+ Active Version
136
+ </ span >
137
+ < span > { plugin ?. version } </ span >
138
+
139
+ < span className = "font-semibold" >
140
+ Description
141
+ </ span >
142
+ < span > { plugin ?. description } </ span >
143
+
144
+ < span className = "font-semibold" >
145
+ Homepage
146
+ </ span >
147
+ < a href = { plugin ?. homepage } target = "_blank" rel = "noopener noreferrer" className = "text-blue-600 hover:text-blue-800 dark:text-blue-500 dark:hover:text-blue-400" >
148
+ { plugin ?. homepage }
149
+ </ a >
150
+ </ div >
151
+
121
152
< div className = "h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20" />
122
153
123
154
< div
@@ -129,15 +160,15 @@ function Dialog({ plugin, setOpen }: { plugin: PluginStatus | null, setOpen: (op
129
160
{ error && < p className = "text-red-500 dark:text-red-400" > { error } </ p > }
130
161
{ plugin ?. message && (
131
162
< >
132
- < p className = "text-sm text-gray-500 dark:text-gray-400" >
133
- Plugin message:
134
- </ p >
135
- < Card className = { cx (
136
- "text-gray-500 dark:text-gray-400 p-4 border" ,
137
- plugin . status === "error" && "border-red-200 bg-red-50 text-red-800 dark:text-red-400" ,
138
- ) } >
139
- { plugin . message }
140
- </ Card >
163
+ < p className = "text-sm text-gray-500 dark:text-gray-400" >
164
+ Plugin message:
165
+ </ p >
166
+ < Card className = { cx (
167
+ "text-gray-500 dark:text-gray-400 p-4 border" ,
168
+ plugin . status === "error" && "border-red-200 bg-red-50 text-red-800 dark:text-red-400" ,
169
+ ) } >
170
+ { plugin . message }
171
+ </ Card >
141
172
</ >
142
173
) }
143
174
< p className = "text-sm text-gray-500 dark:text-gray-400 py-10" >
@@ -154,6 +185,13 @@ function Dialog({ plugin, setOpen }: { plugin: PluginStatus | null, setOpen: (op
154
185
} }
155
186
>
156
187
< div className = "flex items-center w-full space-x-2" >
188
+ < Button
189
+ size = "MD"
190
+ theme = "primary"
191
+ text = "Upload New Version"
192
+ disabled = { loading }
193
+ onClick = { uploadPlugin }
194
+ />
157
195
< Button
158
196
size = "MD"
159
197
theme = "blank"
0 commit comments