GitFOSS

@@ -1,5 +1,5 @@
 {
-  "_generatedAtUnix": 1663839875667,
+  "_generatedAtUnix": 1663840769190,
   "_hashAlgorithm": "sha1",
   "_version": 2,
   "islands": {

@@ -34,7 +34,7 @@
       "pathSourceMap": "./public/.islands/RepositoryInitialSetup.bundle.js.map"
     },
     "RepositoryTreeView": {
-      "hash": "b7ccf7421ded93f2239881f520cbe10872d7272f",
+      "hash": "7cf5ad2688c5489809ceb50006d604b1f423cfaa",
       "pathSource": "./app/islands/RepositoryTreeView.tsx",
       "pathBundle": "./public/.islands/RepositoryTreeView.bundle.js",
       "pathSourceMap": "./public/.islands/RepositoryTreeView.bundle.js.map"

@@ -6,7 +6,7 @@ export const PageWrapper = styled.div`
   justify-content: flex-start;
   align-items: flex-start;
 
-  max-width: 1176px;
+  max-width: 1260px;
   width: 100%;
 
   margin: 0 auto;

@@ -4,7 +4,8 @@ import type { ReactIsland } from "@ethicdevs/react-monolith";
 import React, { useCallback } from "react";
 import styled from "styled-components";
 // app
-import { RepositoryFile, RepositoryLog } from "../types";
+import type { RepositoryFile, RepositoryLog } from "../types";
+import { Grid } from "../components";
 
 export interface RepositoryTreeViewProps {
   currPath: string;

@@ -55,42 +56,57 @@ const RepositoryTreeView: ReactIsland<RepositoryTreeViewProps> = ({
 
   return (
     <StyledRepositoryTreeViewContainer>
-      <div>
-        <strong>{lastCommit.author.name}</strong>
-        {" ∙ "}
-        <span>{lastCommit.subject}</span>
-        {" - "}
-        <a
-          href={`/${orgSlug}/${repoSlug}/compare/${lastCommit.abbreviated_parent}..${lastCommit.abbreviated_commit}`}
-        >
-          <span>
-            {lastCommit.abbreviated_commit}
-            {lastCommit.abbreviated_parent.trim() != ""
-              ? ` (parent ${lastCommit.abbreviated_parent})`
-              : ""}
+      <Grid.Col fluid>
+        <Grid.Row gap={8} alignItems={"center"}>
+          <strong>{lastCommit.author.name}</strong>
+          {" ∙ "}
+          <span style={{ flex: 1 }}>
+            <a
+              href={`/${orgSlug}/${repoSlug}/compare/${lastCommit.abbreviated_parent}..${lastCommit.abbreviated_commit}`}
+            >
+              {lastCommit.subject}
+            </a>
           </span>
-        </a>
-        {" ∙ "}
-        <span>{new Date(lastCommit.author.date).toUTCString()}</span>
-        <a href={`/${orgSlug}/${repoSlug}/commits`}>History</a>
-      </div>
-      <div>
-        <ul>
-          {shouldShowPrevPath && (
-            <li key={"go-previous"}>
-              <a href={prevPathLink}>..</a>
-            </li>
-          )}
-          {repoFiles.map((file) => {
-            const fileLink = buildRepoFileLink(file);
-            return (
-              <li key={[file.id, file.name].join(":")}>
-                <a href={fileLink.href}>{fileLink.text}</a>
+          {" ∙ "}
+          <a
+            href={`/${orgSlug}/${repoSlug}/compare/${lastCommit.abbreviated_parent}..${lastCommit.abbreviated_commit}`}
+          >
+            <span>
+              {lastCommit.abbreviated_commit}
+              {lastCommit.abbreviated_parent.trim() != ""
+                ? ` (parent ${lastCommit.abbreviated_parent})`
+                : ""}
+            </span>
+          </a>
+          {" ∙ "}
+          <span>{new Date(lastCommit.author.date).toLocaleDateString()}</span>
+        </Grid.Row>
+        <Grid.Row
+          gap={8}
+          alignItems={"center"}
+          justifyContent={"flex-end"}
+          style={{ marginTop: 8, width: "100%" }}
+        >
+          <a href={`/${orgSlug}/${repoSlug}/commits`}>Commits History</a>
+        </Grid.Row>
+        <div>
+          <ul>
+            {shouldShowPrevPath && (
+              <li key={"go-previous"}>
+                <a href={prevPathLink}>..</a>
               </li>
-            );
-          })}
-        </ul>
-      </div>
+            )}
+            {repoFiles.map((file) => {
+              const fileLink = buildRepoFileLink(file);
+              return (
+                <li key={[file.id, file.name].join(":")}>
+                  <a href={fileLink.href}>{fileLink.text}</a>
+                </li>
+              );
+            })}
+          </ul>
+        </div>
+      </Grid.Col>
     </StyledRepositoryTreeViewContainer>
   );
 };