ybbond-reason

My old site written in ReasonReact
Log | Files | Refs | README | LICENSE | CC-LICENSE

BlogScene.re (1507B)


      1 open BlogGistData;
      2 
      3 module Styles = {
      4   open Css;
      5 
      6   let strikethrough = style([textDecoration(`lineThrough)]);
      7   let underline = style([textDecoration(`underline)]);
      8   let h1 = style([fontWeight(`num(600)), fontSize(`em(1.4))]);
      9 };
     10 
     11 type state = {gist_content: option(BlogGistData.gist_return)};
     12 
     13 type action =
     14   | Loaded(BlogGistData.gist_return);
     15 
     16 [@react.component]
     17 let make = () => {
     18   let (state, dispatch) =
     19     React.useReducer(
     20       (_state, action) =>
     21         switch (action) {
     22         | Loaded(data) => {gist_content: Some(data)}
     23         },
     24       {gist_content: None},
     25     );
     26 
     27   React.useEffect0(() => {
     28     BlogGistData.fetchGist(data => dispatch(Loaded(data))) |> ignore;
     29     None;
     30   });
     31 
     32   <React.Fragment>
     33     {switch (state.gist_content) {
     34      | Some(story) =>
     35        let comp =
     36          Array.mapi(
     37            (key, item: gist_type) => {
     38              let blogContent = Js.Dict.get(item.files, "_blog.md");
     39 
     40              switch (blogContent) {
     41              | Some(value) =>
     42                <div key={string_of_int(key)}>
     43                  <BlogContent
     44                    source={item.html_url}
     45                    link={value.raw_url}
     46                    title={item.description}
     47                    createdAt={item.created_at}
     48                  />
     49                </div>
     50              | None => <div />
     51              };
     52            },
     53            story,
     54          );
     55        <div> {ReasonReact.array(comp)} </div>;
     56      | None => React.string("Mengambil data blog...")
     57      }}
     58   </React.Fragment>;
     59 };