website: fix edit link & tweak it

Author: MoOx

website/scripts/PrepareMdToJson.re

@@ -23,7 +23,12 @@ Path.join([|sourcePath, "**/*.md"|])
             |> Js.String.replace(".md", "");
           let mdJson = mdToJson(file.content);
           let content =
-            {"id": mdJson##id, "title": mdJson##title, "body": mdJson##body}
+            {
+              "filename": file.name |> Js.String.replace(root, "website"),
+              "id": mdJson##id,
+              "title": mdJson##title,
+              "body": mdJson##body,
+            }
             ->Js.Json.stringifyAny;
           if (content->Option.isNone) {
             Js.log2(file.name, "can't be transformed");
@@ -74,6 +79,12 @@ Path.join([|sourcePath, "**/*.md"|])
           let mdJson = mdToJson(file.content);
           let content =
             {
+              "filename":
+                file.name
+                |> Js.String.replace(
+                     Node.Path.resolve(root, "..") ++ "/",
+                     "",
+                   ),
               "id": mdJson##id,
               "title": mdJson##title,
               "wip": mdJson##wip,
@@ -139,6 +150,7 @@ Path.join([|sourcePath, "**/*.md"|])
           let mdJson = mdToJson(file.content);
           let content =
             {
+              "filename": file.name |> Js.String.replace(root, "website"),
               "id": mdJson##id,
               "title": mdJson##title,
               "author": mdJson##author,

website/scripts/Prerender.re

@@ -70,6 +70,15 @@ let file =
   let pageData =
     switch (Js.Json.classify(json)) {
     | Js.Json.JSONObject(value) =>
+      let filename =
+        switch (Js.Dict.get(value, "filename")) {
+        | Some(v) =>
+          switch (Js.Json.classify(v)) {
+          | Js.Json.JSONString(v) => v
+          | _ => failwith(file.name ++ ": Expected an string for `filename`")
+          }
+        | None => failwith(file.name ++ ": Expected an `filename` property")
+        };
       let id =
         switch (Js.Dict.get(value, "id")) {
         | Some(v) =>
@@ -149,6 +158,7 @@ let file =
         | None => failwith(file.name ++ ": Expected an `body` property")
         };
       let p: PageContent.pageData = {
+        filename,
         id,
         title,
         date,

website/src/components/PageContent.re

@@ -4,6 +4,7 @@ open ReactMultiversal;
 
 // ⚠️ if you update this, also update PrepareMdToJson if needed
 type pageData = {
+  filename: string,
   id: string,
   title: string,
   date: option(string),
@@ -31,12 +32,17 @@ let styles =
           ~marginLeft=auto,
           ~borderWidth=1.,
           ~borderStyle=`solid,
-          ~borderColor=Predefined.Colors.tealBlue,
+          ~borderColor=Predefined.Colors.grey,
           ~borderRadius=4.,
           (),
         ),
       "editLinkText":
-        style(~color=Predefined.Colors.tealBlue, ~alignItems=`center, ()),
+        style(
+          ~fontSize=10.,
+          ~color=Predefined.Colors.grey,
+          ~alignItems=`center,
+          (),
+        ),
       "officialDocLink":
         style(
           ~display=`flex,
@@ -84,9 +90,8 @@ let make = (~pageData) => {
       None;
     };
   let editHref =
-    "https://github.com/reasonml-community/reason-react-native/blob/master/reason-react-native/src/"
-    ++ pageData.id
-    ++ ".md";
+    "https://github.com/reasonml-community/reason-react-native/blob/master/"
+    ++ pageData.filename;
   <SpacedView style=styles##container vertical=SpacedView.L>
     <main>
       <header>
@@ -120,8 +125,8 @@ let make = (~pageData) => {
              ->Option.getWithDefault(React.null)}
           </TextLight>
           <TextLink href=editHref style=styles##editLink>
-            <SpacedView vertical=SpacedView.XS horizontal=SpacedView.XS>
-              <Text style=styles##editLinkText> {|Edit|}->React.string </Text>
+            <SpacedView vertical=SpacedView.XXS horizontal=SpacedView.XS>
+              <Text style=styles##editLinkText> {|EDIT|}->React.string </Text>
             </SpacedView>
           </TextLink>
         </Row.SpaceBetween>