Skip to content

Commit 36eb580

Browse files
jderochervlkjderochervlk
committed
adding links back in
1 parent d37eaa5 commit 36eb580

File tree

7 files changed

+88
-87
lines changed

7 files changed

+88
-87
lines changed

‎app/routes.mjs‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,9 @@ let $$default = Belt_Array.concatMany([
99
Routes.index("./routes/LandingPageRoute.mjs"),
1010
Routes.route("try", "./routes/TryRoute.mjs"),
1111
Routes.route("community", "./routes/CommunityRoute.mjs"),
12+
Routes.route("community/overview", "./routes/CommunityRoute.mjs", {
13+
id: "overview"
14+
}),
1215
Routes.route("syntax-lookup", "./routes/SyntaxLookupRoute.mjs"),
1316
Routes.route("blog", "./routes/BlogRoute.mjs")
1417
],

‎app/routes.res‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ let default = [
55
index("./routes/LandingPageRoute.mjs"),
66
route("try", "./routes/TryRoute.mjs"),
77
route("community", "./routes/CommunityRoute.mjs"),
8+
route("community/overview", "./routes/CommunityRoute.mjs", ~options={id: "overview"}),
89
route("syntax-lookup", "./routes/SyntaxLookupRoute.mjs"),
910
route("blog", "./routes/BlogRoute.mjs"),
1011
...routes("./routes/MdxRoute.mjs"),

‎src/ApiDocs.res‎

Lines changed: 14 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -94,15 +94,13 @@ module SidebarTree = {
9494
open ReactRouter
9595

9696
// Use ReactRouter's useLocation if needed, or refactor to not use router
97-
let location = ReactRouter.useLocation()
98-
let url = ""
97+
// let location = ReactRouter.useLocation()
98+
// let url = ""
9999
// let url = location.pathname->Url.parse
100-
// let version = url->Url.getVersionString
101-
let version = ""
102100

103101
let moduleRoute =
104102
WebAPI.URL.make(~url="file://" ++ "" /* TODO: location.pathname */).pathname
105-
->String.replace(`/docs/manual/${version}/api/`, "")
103+
->String.replace(`/docs/manual/api/`, "")
106104
->String.split("/")
107105

108106
let summaryClassName = "truncate py-1 md:h-auto tracking-tight text-gray-60 font-medium text-14 rounded-sm hover:bg-gray-20 hover:-ml-2 hover:py-1 hover:pl-2 "
@@ -138,9 +136,9 @@ module SidebarTree = {
138136

139137
<details key={href} open_>
140138
<summary className={summaryClassName ++ classNameActive}>
141-
// <Link className={"inline-block w-10/12"} to={(href :> ReactRouter.Link.to)}>
142-
// {node.name->React.string}
143-
// </Link>
139+
<Link.String className={"inline-block w-10/12"} to=href>
140+
{node.name->React.string}
141+
</Link.String>
144142
</summary>
145143
tocModule
146144
{if hasChildren {
@@ -154,11 +152,9 @@ module SidebarTree = {
154152
}}
155153
</details>
156154
| false =>
157-
<li className={"list-none mt-1 leading-4"} key={href}>
155+
<li className="list-none mt-1 leading-4" key=href>
158156
<summary className={summaryClassName ++ classNameActive}>
159-
// <Link className={"block"} to={(href :> ReactRouter.Link.to)}>
160-
// {node.name->React.string}
161-
// </Link>
157+
<Link.String className={"block"} to=href> {node.name->React.string} </Link.String>
162158
</summary>
163159
tocModule
164160
</li>
@@ -234,12 +230,12 @@ module SidebarTree = {
234230
<div className="hl-overline block text-gray-80 mt-5 mb-2">
235231
{"Overview"->React.string}
236232
</div>
237-
// <Link
238-
// className={"block " ++
239-
// summaryClassName ++ (moduleRoute->Array.length == 1 ? classNameActive : "")}
240-
// to={(node.path->Array.join("/") :> ReactRouter.Link.to)}>
241-
// {node.name->React.string}
242-
// </Link>
233+
<Link.String
234+
className={"block " ++
235+
summaryClassName ++ (moduleRoute->Array.length == 1 ? classNameActive : "")}
236+
to={node.path->Array.join("/")}>
237+
{node.name->React.string}
238+
</Link.String>
243239
{moduleRoute->Array.length === 1 ? subMenu : React.null}
244240
</div>
245241
<div className="hl-overline text-gray-80 mt-5 mb-2"> {"submodules"->React.string} </div>

‎src/Path.res‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ type t = [
22
#"undefined" |
33
#"try" |
44
#"community" |
5+
#"community/overview" |
56
#"syntax-lookup" |
67
#"blog" |
78
#"blog/2025-04-11-introducing-unified-operators" |

‎src/bindings/ReactRouter.res‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,8 +63,10 @@ module Routes = {
6363
@module("@react-router/dev/routes")
6464
external index: string => t = "index"
6565

66+
type routeOptions = {id?: string}
67+
6668
@module("@react-router/dev/routes")
67-
external route: (string, string) => t = "route"
69+
external route: (string, string, ~options: routeOptions=?) => t = "route"
6870
}
6971

7072
module Mdx = {

‎src/components/Navigation.res‎

Lines changed: 51 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,13 @@ module Link = ReactRouter.Link
33
let link = "no-underline block hover:cursor-pointer hover:text-fire-30 mb-px"
44
let activeLink = "font-medium text-fire-30 border-b border-fire"
55

6-
let linkOrActiveLink = (~target, ~route) => target === route ? activeLink : link
6+
let linkOrActiveLink = (~target: Path.t, ~route: Path.t) => target === route ? activeLink : link
77

8-
let linkOrActiveLinkSubroute = (~target, ~route) =>
9-
String.startsWith(route, target) ? activeLink : link
8+
let linkOrActiveLinkSubroute = (~target: Path.t, ~route: Path.t) =>
9+
String.startsWith((route :> string), (target :> string)) ? activeLink : link
1010

11-
let isActiveLink = (~includes: string, ~excludes: option<string>=?, ~route: string) => {
11+
let isActiveLink = (~includes: string, ~excludes: option<string>=?, ~route: Path.t) => {
12+
let route = (route :> string)
1213
// includes means we want the lnk to be active if it contains the expected text
1314
let includes = route->String.includes(includes)
1415
// excludes allows us to not have links be active even if they do have the includes text
@@ -19,30 +20,32 @@ let isActiveLink = (~includes: string, ~excludes: option<string>=?, ~route: stri
1920
includes && !excludes ? activeLink : link
2021
}
2122

22-
let isDocRoute = (~route) =>
23+
let isDocRoute = (~route: Path.t) => {
24+
let route = (route :> string)
2325
route->String.includes("/docs/") || route->String.includes("/syntax-lookup")
26+
}
2427

25-
let isDocRouteActive = (~route) => isDocRoute(~route) ? activeLink : link
28+
let isDocRouteActive = (~route: Path.t) => isDocRoute(~route) ? activeLink : link
2629

2730
module MobileNav = {
2831
@react.component
29-
let make = (~route: string) => {
32+
let make = (~route: Path.t) => {
3033
let base = "font-normal mx-4 py-5 text-gray-40 border-b border-gray-80"
3134
let extLink = "block hover:cursor-pointer hover:text-white text-gray-60"
3235
<div className="border-gray-80 border-tn">
3336
<ul>
3437
<li className=base>
35-
<Link to=#"try" className={linkOrActiveLink(~target="/try", ~route)}>
38+
<Link to=#"try" className={linkOrActiveLink(~target=#"try", ~route)}>
3639
{React.string("Playground")}
3740
</Link>
3841
</li>
3942
<li className=base>
40-
<Link to=#blog className={linkOrActiveLinkSubroute(~target="/blog", ~route)}>
43+
<Link to=#blog className={linkOrActiveLinkSubroute(~target=#blog, ~route)}>
4144
{React.string("Blog")}
4245
</Link>
4346
</li>
4447
<li className=base>
45-
<Link to=#community className={linkOrActiveLink(~target="/community", ~route)}>
48+
<Link to=#community className={linkOrActiveLink(~target=#community, ~route)}>
4649
{React.string("Community")}
4750
</Link>
4851
</li>
@@ -102,29 +105,25 @@ let make = (~fixed=true, ~isOverlayOpen: bool, ~setOverlayOpen: (bool => bool) =
102105
<div
103106
className="flex items-center xs:justify-between w-full bg-gray-90 sm:h-auto sm:relative">
104107
<div className="flex ml-10 space-x-5 w-full text-gray-40 max-w-104">
105-
<Link
106-
to=#"docs/manual/introduction"
107-
className={isDocRouteActive(~route=(route :> string))}>
108+
<Link to=#"docs/manual/introduction" className={isDocRouteActive(~route)}>
108109
{React.string("Docs")}
109110
</Link>
110111

111112
<Link
112113
to=#"try"
113-
className={"hidden xs:block " ++
114-
linkOrActiveLink(~target="/try", ~route=(route :> string))}>
114+
className={"hidden xs:block " ++ linkOrActiveLink(~target=#"try", ~route)}>
115115
{React.string("Playground")}
116116
</Link>
117-
// <Link
118-
// to=#"blog"
119-
// className={"hidden xs:block " ++ linkOrActiveLinkSubroute(~target="/blog", ~~route=(route))}>
120-
// {React.string("Blog")}
121-
// </Link>
122-
// <Link
123-
// to=#"community/overview"
124-
// // className={"hidden xs:block " ++ linkOrActiveLink(~target="/community", ~route)}
125-
// >
126-
// {React.string("Community")}
127-
// </Link>
117+
<Link
118+
to=#blog
119+
className={"hidden xs:block " ++ linkOrActiveLinkSubroute(~target=#blog, ~route)}>
120+
{React.string("Blog")}
121+
</Link>
122+
<Link
123+
to=#"community/overview"
124+
className={"hidden xs:block " ++ linkOrActiveLink(~target=#community, ~route)}>
125+
{React.string("Community")}
126+
</Link>
128127
</div>
129128
<div className="md:flex flex items-center text-gray-60">
130129
<Search />
@@ -163,36 +162,35 @@ let make = (~fixed=true, ~isOverlayOpen: bool, ~setOverlayOpen: (bool => bool) =
163162
className={(
164163
isOverlayOpen ? "flex" : "hidden"
165164
) ++ " top-16 sm:hidden flex-col fixed top-0 left-0 h-full w-full z-50 sm:w-9/12 bg-gray-100 sm:h-auto sm:flex sm:relative sm:flex-row sm:justify-between"}>
166-
// <MobileNav route />
165+
<MobileNav route />
167166
</div>
168167
</nav>
169168
// This is a subnav for documentation pages
170-
// {isDocRoute(~route)
171-
// ? <nav
172-
// id="docs-subnav"
173-
// className="bg-white z-50 px-4 w-full h-12 shadow text-gray-60 text-12 md:text-14 transition duration-300 ease-out group-[.nav-disappear]:-translate-y-32 md:group-[.nav-disappear]:-translate-y-0">
174-
// <div className="flex gap-6 lg:gap-10 items-center h-full w-full max-w-1280 m-auto">
175-
// <Link
176-
// to=Url(`/docs/manual/introduction`)
177-
// className={isActiveLink(~includes="/docs/manual/", ~excludes="/api", ~route)}>
178-
// {React.string("Language Manual")}
179-
// </Link>
180-
// <Link to=Url(`/docs/manual/api`) className={isActiveLink(~includes="/api", ~route)}>
181-
// {React.string("API")}
182-
// </Link>
183-
// <Link
184-
// to=Url("/syntax-lookup")
185-
// className={isActiveLink(~includes="/syntax-lookup", ~route)}>
186-
// {React.string("Syntax Lookup")}
187-
// </Link>
188-
// <Link
189-
// to=Url(`/docs/react/introduction`)
190-
// className={isActiveLink(~includes="/docs/react/", ~route)}>
191-
// {React.string("React")}
192-
// </Link>
193-
// </div>
194-
// </nav>
195-
// : React.null}
169+
{isDocRoute(~route)
170+
? <nav
171+
id="docs-subnav"
172+
className="bg-white z-50 px-4 w-full h-12 shadow text-gray-60 text-12 md:text-14 transition duration-300 ease-out group-[.nav-disappear]:-translate-y-32 md:group-[.nav-disappear]:-translate-y-0">
173+
<div className="flex gap-6 lg:gap-10 items-center h-full w-full max-w-1280 m-auto">
174+
<Link
175+
to=#"docs/manual/introduction"
176+
className={isActiveLink(~includes="/docs/manual/", ~excludes="/api", ~route)}>
177+
{React.string("Language Manual")}
178+
</Link>
179+
<Link to=#"docs/manual/api" className={isActiveLink(~includes="/api", ~route)}>
180+
{React.string("API")}
181+
</Link>
182+
<Link
183+
to=#"syntax-lookup" className={isActiveLink(~includes="/syntax-lookup", ~route)}>
184+
{React.string("Syntax Lookup")}
185+
</Link>
186+
<Link
187+
to=#"docs/react/introduction"
188+
className={isActiveLink(~includes="/docs/react/", ~route)}>
189+
{React.string("React")}
190+
</Link>
191+
</div>
192+
</nav>
193+
: React.null}
196194
</header>
197195
</>
198196
}

‎src/layouts/LandingPageLayout.res‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -591,21 +591,21 @@ module CuratedResources = {
591591

592592
//container for guides
593593
<div>
594-
// <div
595-
// className="grid grid-flow-col grid-cols-2 grid-rows-2 lg:grid-cols-4 lg:grid-rows-1 gap-2 md:gap-4 lg:gap-8 max-w-1280 px-5 md:px-8 mx-auto">
596-
// {cards
597-
// ->Array.mapWithIndex((card, i) =>
598-
// <ReactRouter.Link
599-
// key={Int.toString(i)}
600-
// to={(card.href :> ReactRouter.Link.to)}
601-
// className="hover:bg-gray-80 bg-gray-90 px-4 md:px-8 pb-0 md:pb-8 relative rounded-xl md:min-w-[196px]">
602-
// <img className="h-[53px] absolute mt-6" src=card.imgSrc loading=#lazy />
603-
// <h5 className="text-gray-10 hl-4 mt-32 h-12"> {card.title} </h5>
604-
// <div className="text-gray-40 mt-2 mb-8 body-sm"> {React.string(card.descr)} </div>
605-
// </ReactRouter.Link>
606-
// )
607-
// ->React.array}
608-
// </div>
594+
<div
595+
className="grid grid-flow-col grid-cols-2 grid-rows-2 lg:grid-cols-4 lg:grid-rows-1 gap-2 md:gap-4 lg:gap-8 max-w-1280 px-5 md:px-8 mx-auto">
596+
{cards
597+
->Array.mapWithIndex((card, i) =>
598+
<ReactRouter.Link.String
599+
key={Int.toString(i)}
600+
to=card.href
601+
className="hover:bg-gray-80 bg-gray-90 px-4 md:px-8 pb-0 md:pb-8 relative rounded-xl md:min-w-[196px]">
602+
<img className="h-[53px] absolute mt-6" src=card.imgSrc loading=#lazy />
603+
<h5 className="text-gray-10 hl-4 mt-32 h-12"> {card.title} </h5>
604+
<div className="text-gray-40 mt-2 mb-8 body-sm"> {React.string(card.descr)} </div>
605+
</ReactRouter.Link.String>
606+
)
607+
->React.array}
608+
</div>
609609
//Container for templates
610610
<div className="px-5 md:px-8 max-w-1280 mx-auto my-20">
611611
<div className="body-lg text-center z-2 relative text-gray-40 w-32 mx-auto bg-gray-100">

0 commit comments

Comments
 (0)