1
1
import type { MetaFunction } from "@remix-run/node" ;
2
- import { Link as RemixLink , useLoaderData } from "@remix-run/react" ;
2
+ import { Link as RemixLink , useLoaderData , useRouteLoaderData } from "@remix-run/react" ;
3
3
import { json } from "@remix-run/node" ;
4
+ import { desc , arrayContains } from "drizzle-orm" ;
4
5
5
6
import { getAll , initialize , PatternEntry } from "~/components/Patterns" ;
6
7
import { TagList } from "~/components/TagList" ;
7
8
import { PatternTagUrlBuilder } from "~/util/PatternTagUrlBuilder" ;
9
+ import LinksTable from "~/components/LinksTable" ;
10
+ import { RootLoaderData } from "~/types/RootLoaderData" ;
11
+ import { dborm } from "~/db/connection.server" ;
12
+ import { regex_link } from "~/db/schema" ;
8
13
9
14
export const loader = async ( ) => {
10
- await initialize ( ) ;
11
- return json ( getAll ( ) ) ;
15
+ await initialize ( ) ;
16
+
17
+ const links = await dborm . select ( )
18
+ . from ( regex_link )
19
+ . where ( arrayContains ( regex_link . rxl_tags , [ "patterns" ] ) )
20
+ . orderBy ( desc ( regex_link . rxl_created_at ) )
21
+ . limit ( 100 ) ;
22
+
23
+ return json ( {
24
+ patterns : getAll ( ) ,
25
+ links,
26
+ } ) ;
12
27
} ;
13
28
14
29
export const meta : MetaFunction = ( ) => {
15
- return [
16
- { title : "Patterns - Regex Zone" } ,
17
- { name : "description" , content : "A collection of useful regular expression patterns" } ,
18
- ] ;
30
+ return [
31
+ { title : "Patterns - Regex Zone" } ,
32
+ { name : "description" , content : "A collection of useful regular expression patterns" } ,
33
+ ] ;
19
34
} ;
20
35
21
36
function PatternEntryRow ( entry : PatternEntry ) {
22
- return (
23
- < tr key = { entry . handle } >
24
- < td >
25
- < RemixLink to = { `${ entry . handle } /` } > { entry . title } </ RemixLink >
26
- </ td >
27
- < td style = { { 'textAlign' : 'right' } } >
28
- { entry . tags ? < TagList tags = { entry . tags } urlBuilder = { PatternTagUrlBuilder } /> : null }
29
- < div className = "badge text-bg-secondary" > { entry . variations . length } </ div >
30
- </ td >
31
- </ tr >
32
- ) ;
37
+ return (
38
+ < tr key = { entry . handle } >
39
+ < td >
40
+ < RemixLink to = { `${ entry . handle } /` } > { entry . title } </ RemixLink >
41
+ </ td >
42
+ < td style = { { 'textAlign' : 'right' } } >
43
+ { entry . tags ? < TagList tags = { entry . tags } urlBuilder = { PatternTagUrlBuilder } /> : null }
44
+ < div className = "badge text-bg-secondary" > { entry . variations . length } </ div >
45
+ </ td >
46
+ </ tr >
47
+ ) ;
33
48
}
34
49
35
50
export default function Index ( ) {
36
- const entries = useLoaderData < typeof loader > ( ) ;
37
-
38
- const entryRows = entries . map ( ( entry ) => PatternEntryRow ( entry ) ) ;
39
-
40
- return (
41
- < >
42
- < h1 className = "py-2" > Patterns</ h1 >
43
- < table className = "table table-striped table-hover" >
44
- < thead >
45
- < tr >
46
- < th > Title</ th >
47
- < th > </ th >
48
- </ tr >
49
- </ thead >
50
- < tbody >
51
- { entryRows }
52
- </ tbody >
53
- </ table >
54
- < details > < summary > Raw data</ summary >
55
- < pre > { JSON . stringify ( entries , null , 4 ) } </ pre >
56
- </ details >
57
- </ >
58
- ) ;
59
- }
51
+ const { user } = useRouteLoaderData < RootLoaderData > ( "root" ) as unknown as RootLoaderData ;
52
+ const data = useLoaderData < typeof loader > ( ) ;
53
+ const links = data . links as unknown as typeof regex_link . $inferSelect [ ] ;
54
+
55
+ const entryRows = data . patterns . map ( ( entry ) => PatternEntryRow ( entry ) ) ;
56
+
57
+ return (
58
+ < >
59
+ < h1 className = "py-2" > Patterns</ h1 >
60
+ < table className = "table table-striped table-hover" >
61
+ < thead >
62
+ < tr >
63
+ < th > Title</ th >
64
+ < th > </ th >
65
+ </ tr >
66
+ </ thead >
67
+ < tbody >
68
+ { entryRows }
69
+ </ tbody >
70
+ </ table >
71
+ < h2 className = "pt-3" > Links</ h2 >
72
+ < div className = "alert alert-info" > Other websites with useful regex patterns</ div >
73
+ < LinksTable currentUrl = "/links/" links = { links } isAdmin = { user ?. isAdmin } />
74
+ < details > < summary > Raw data</ summary >
75
+ < pre > { JSON . stringify ( data . patterns , null , 4 ) } </ pre >
76
+ </ details >
77
+ </ >
78
+ ) ;
79
+ }
0 commit comments