mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-06-22 14:51:45 +00:00
Maurice
47671d52e0
FE6: split the oversized page and panel components into thin layout shells plus colocated use<Component> hooks, .constants.ts, .helpers.ts (with tests) and presentational sub-components, following the established 'logic in a hook, render in slices' pattern. Behaviour, markup, classes and effect order are unchanged. Largest reductions: PackingListPanel 1598->42, FileManager 1055->36, AdminPage 1525->167, BudgetPanel 1266->146, JourneyDetailPage 2822->547, PlacesSidebar 945->66, CollabChat 861->106, CollabNotes 1417->532. DayPlanSidebar's drag-and-drop render body was left intact (ref-identity sensitive) and only its toolbar/modals/constants were extracted.
22 lines
641 B
TypeScript
22 lines
641 B
TypeScript
import { URL_REGEX } from './CollabChat.constants'
|
|
|
|
/* ── Message Text with clickable URLs ── */
|
|
interface MessageTextProps {
|
|
text: string
|
|
}
|
|
|
|
export function MessageText({ text }: MessageTextProps) {
|
|
const parts = text.split(URL_REGEX)
|
|
const urls = text.match(URL_REGEX) || []
|
|
const result = []
|
|
parts.forEach((part, i) => {
|
|
if (part) result.push(part)
|
|
if (urls[i]) result.push(
|
|
<a key={i} href={urls[i]} target="_blank" rel="noopener noreferrer" style={{ color: 'inherit', textDecoration: 'underline', textUnderlineOffset: 2, opacity: 0.85 }}>
|
|
{urls[i]}
|
|
</a>
|
|
)
|
|
})
|
|
return <>{result}</>
|
|
}
|