@@ -191,107 +191,107 @@ const SingleBoard: React.FC<Props> = ({
191191 { groupedByIssues [ groupTitle ] . map ( ( childIssue : any , index : number ) => (
192192 < Draggable key = { childIssue . id } draggableId = { childIssue . id } index = { index } >
193193 { ( provided , snapshot ) => (
194- < Link
195- href = { `/projects/${ childIssue . project } /issues/${ childIssue . id } ` }
196- className = { `group block border rounded bg-white shadow-sm ${
197- snapshot . isDragging ? "border-indigo-600 shadow-lg bg-indigo-50" : ""
198- } `}
199- ref = { provided . innerRef }
200- { ...provided . draggableProps }
201- >
202- < div
203- className = "px-2 py-3 space-y-1.5 select-none"
204- { ...provided . dragHandleProps }
194+ < Link href = { `/projects/${ childIssue . project } /issues/${ childIssue . id } ` } >
195+ < a
196+ className = { `group block border rounded bg-white shadow-sm ${
197+ snapshot . isDragging ? "border-indigo-600 shadow-lg bg-indigo-50" : ""
198+ } `}
199+ ref = { provided . innerRef }
200+ { ...provided . draggableProps }
205201 >
206- { Object . keys ( properties ) . map (
207- ( key ) =>
208- properties [ key as keyof Properties ] &&
209- ! Array . isArray ( childIssue [ key as keyof IIssue ] ) && (
210- < div
211- key = { key }
212- className = { `${
213- key === "name"
214- ? "text-sm mb-2"
215- : key === "description"
216- ? "text-xs text-black"
217- : key === "priority"
218- ? `text-xs bg-gray-200 px-2 py-1 mt-2 flex items-center gap-x-1 rounded w-min whitespace-nowrap capitalize font-medium ${
219- childIssue . priority === "high"
220- ? "bg-red-100 text-red-600"
221- : childIssue . priority === "medium"
222- ? "bg-orange-100 text-orange-500"
223- : childIssue . priority === "low"
224- ? "bg-green-100 text-green-500"
225- : "hidden"
226- } `
227- : key === "target_date"
228- ? "text-xs bg-indigo-50 px-2 py-1 mt-2 flex items-center gap-x-1 rounded w-min whitespace-nowrap"
229- : "text-sm text-gray-500"
230- } gap-1
202+ < div
203+ className = "px-2 py-3 space-y-1.5 select-none"
204+ { ...provided . dragHandleProps }
205+ >
206+ { Object . keys ( properties ) . map (
207+ ( key ) =>
208+ properties [ key as keyof Properties ] &&
209+ ! Array . isArray ( childIssue [ key as keyof IIssue ] ) && (
210+ < div
211+ key = { key }
212+ className = { `${
213+ key === "name"
214+ ? "text-sm mb-2"
215+ : key === "description"
216+ ? "text-xs text-black"
217+ : key === "priority"
218+ ? `text-xs bg-gray-200 px-2 py-1 mt-2 flex items-center gap-x-1 rounded w-min whitespace-nowrap capitalize font-medium ${
219+ childIssue . priority === "high"
220+ ? "bg-red-100 text-red-600"
221+ : childIssue . priority === "medium"
222+ ? "bg-orange-100 text-orange-500"
223+ : childIssue . priority === "low"
224+ ? "bg-green-100 text-green-500"
225+ : "hidden"
226+ } `
227+ : key === "target_date"
228+ ? "text-xs bg-indigo-50 px-2 py-1 mt-2 flex items-center gap-x-1 rounded w-min whitespace-nowrap"
229+ : "text-sm text-gray-500"
230+ } gap-1
231231 ` }
232- >
233- { key === "target_date" ? (
234- < >
235- < CalendarDaysIcon className = "h-4 w-4" /> { " " }
236- { childIssue . target_date
237- ? renderShortNumericDateFormat ( childIssue . target_date )
238- : "N/A" }
239- </ >
240- ) : (
241- ""
242- ) }
243- { key === "name" && (
244- < span className = "group-hover:text-theme" >
245- { childIssue . name }
246- </ span >
247- ) }
248- { key === "state" && (
249- < > { addSpaceIfCamelCase ( childIssue [ "state_detail" ] . name ) } </ >
250- ) }
251- { key === "priority" && < > { childIssue . priority } </ > }
252- { key === "description" && < > { childIssue . description } </ > }
253- { key === "assignee" ? (
254- < div className = "flex items-center gap-1 text-xs" >
255- { childIssue ?. assignee_details ?. length > 0 ? (
256- childIssue ?. assignee_details ?. map (
257- ( assignee : any , index : number ) => (
258- < div
259- key = { index }
260- className = { `relative z-[1] h-5 w-5 rounded-full ${
261- index !== 0 ? "-ml-2.5" : ""
262- } `}
263- >
264- { assignee . avatar && assignee . avatar !== "" ? (
265- < div className = "h-5 w-5 border-2 bg-white border-white rounded-full" >
266- < Image
267- src = { assignee . avatar }
268- height = "100"
269- width = "100"
270- className = "rounded-full"
271- alt = { assignee . name }
272- />
273- </ div >
274- ) : (
275- < div
276- className = { `h-5 w-5 bg-gray-700 text-white border-2 border-white grid place-items-center rounded-full` }
277- >
278- { assignee . first_name . charAt ( 0 ) }
279- </ div >
280- ) }
281- </ div >
232+ >
233+ { key === "target_date" ? (
234+ < >
235+ < CalendarDaysIcon className = "h-4 w-4" /> { " " }
236+ { childIssue . target_date
237+ ? renderShortNumericDateFormat ( childIssue . target_date )
238+ : "N/A" }
239+ </ >
240+ ) : (
241+ ""
242+ ) }
243+ { key === "name" && (
244+ < span className = "group-hover:text-theme" >
245+ { childIssue . name }
246+ </ span >
247+ ) }
248+ { key === "state" && (
249+ < > { addSpaceIfCamelCase ( childIssue [ "state_detail" ] . name ) } </ >
250+ ) }
251+ { key === "priority" && < > { childIssue . priority } </ > }
252+ { key === "description" && < > { childIssue . description } </ > }
253+ { key === "assignee" ? (
254+ < div className = "flex items-center gap-1 text-xs" >
255+ { childIssue ?. assignee_details ?. length > 0 ? (
256+ childIssue ?. assignee_details ?. map (
257+ ( assignee : any , index : number ) => (
258+ < div
259+ key = { index }
260+ className = { `relative z-[1] h-5 w-5 rounded-full ${
261+ index !== 0 ? "-ml-2.5" : ""
262+ } `}
263+ >
264+ { assignee . avatar && assignee . avatar !== "" ? (
265+ < div className = "h-5 w-5 border-2 bg-white border-white rounded-full" >
266+ < Image
267+ src = { assignee . avatar }
268+ height = "100%"
269+ width = "100%"
270+ className = "rounded-full"
271+ alt = { assignee . name }
272+ />
273+ </ div >
274+ ) : (
275+ < div
276+ className = { `h-5 w-5 bg-gray-700 text-white border-2 border-white grid place-items-center rounded-full` }
277+ >
278+ { assignee . first_name . charAt ( 0 ) }
279+ </ div >
280+ ) }
281+ </ div >
282+ )
282283 )
283- )
284- ) : (
285- < span > None</ span >
286- ) }
287- </ div >
288- ) : null }
289- </ div >
290- )
291- ) }
292- </ div >
284+ ) : (
285+ < span > None</ span >
286+ ) }
287+ </ div >
288+ ) : null }
289+ </ div >
290+ )
291+ ) }
292+ </ div >
293293
294- { /* <div
294+ { /* <div
295295 className={`p-2 bg-indigo-50 flex items-center justify-between ${
296296 snapshot.isDragging ? "bg-indigo-200" : ""
297297 }`}
@@ -313,6 +313,7 @@ const SingleBoard: React.FC<Props> = ({
313313 </button>
314314 </div>
315315 </div> */ }
316+ </ a >
316317 </ Link >
317318 ) }
318319 </ Draggable >
0 commit comments