Skip to content

Commit

Permalink
Move load to web worker
Browse files Browse the repository at this point in the history
  • Loading branch information
pomber committed Mar 1, 2019
1 parent 6d084ad commit 4ab4543
Show file tree
Hide file tree
Showing 27 changed files with 450 additions and 376 deletions.
10 changes: 10 additions & 0 deletions craco.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
module.exports = {
webpack: {
configure: {
output: {
// I need "this" for workerize-loader
globalObject: "this"
}
}
}
};
6 changes: 4 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
"repository": "pomber/git-history",
"private": true,
"dependencies": {
"@craco/craco": "^3.4.1",
"diff": "^4.0.1",
"js-base64": "^2.5.1",
"netlify-auth-providers": "^1.0.0-alpha5",
Expand All @@ -12,10 +13,11 @@
"react-dom": "^16.8.1",
"react-scripts": "2.1.3",
"react-swipeable": "^4.3.2",
"react-use": "^5.2.2"
"react-use": "^5.2.2",
"workerize-loader": "^1.0.4"
},
"scripts": {
"start": "react-scripts start",
"start": "craco start",
"build": "react-scripts build",
"format": "prettier --write \"**/*.{js,jsx,md,json,html,css,yml}\" --ignore-path .gitignore",
"test-prettier": "prettier --check \"**/*.{js,jsx,md,json,html,css,yml}\" --ignore-path .gitignore",
Expand Down
3 changes: 1 addition & 2 deletions src/animation.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
/* eslint-disable */
import { createAnimation, Stagger } from "./airframe/airframe";
import easing from "./airframe/easing";

/* eslint-disable */

const dx = 250;

/* @jsx createAnimation */
Expand Down
38 changes: 1 addition & 37 deletions src/app-helpers.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React, { useState, useEffect } from "react";
import { getLanguage, loadLanguage } from "./language-detector";
import React, { useEffect } from "react";

export function Center({ children }) {
return (
Expand Down Expand Up @@ -68,41 +67,6 @@ export function Error({ error, gitProvider }) {
);
}

export function useLoader(promiseFactory, deps) {
const [state, setState] = useState({
data: null,
loading: true,
error: null
});

useEffect(() => {
promiseFactory()
.then(data => {
setState({
data,
loading: false,
error: false
});
})
.catch(error => {
setState({
loading: false,
error
});
});
}, deps);

return [state.data, state.loading, state.error];
}

export function useLanguageLoader(path) {
return useLoader(async () => {
const lang = getLanguage(path);
await loadLanguage(lang);
return lang;
}, [path]);
}

export function useDocumentTitle(title) {
useEffect(() => {
document.title = title;
Expand Down
37 changes: 17 additions & 20 deletions src/app.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,7 @@
import React, { useState, useEffect } from "react";
import History from "./history";
import Landing from "./landing";
import {
useLanguageLoader,
useDocumentTitle,
Loading,
Error
} from "./app-helpers";
import { useDocumentTitle, Loading, Error } from "./app-helpers";
import getGitProvider from "./git-providers/providers";

export default function App() {
Expand All @@ -25,31 +20,32 @@ function InnerApp({ gitProvider }) {

useDocumentTitle(`Git History - ${fileName}`);

const [commits, commitsLoading, commitsError, loadMore] = useCommitsLoader(
const [versions, loading, error, loadMore] = useVersionsLoader(
gitProvider,
path
);
const [lang, langLoading, langError] = useLanguageLoader(path);

const loading = langLoading || (!commits && commitsLoading);
const error = langError || commitsError;

if (error) {
return <Error error={error} gitProvider={gitProvider} />;
}

if (loading) {
if (!versions && loading) {
return <Loading path={path} />;
}

if (!commits.length) {
if (!versions.length) {
return <Error error={{ status: 404 }} gitProvider={gitProvider} />;
}

return <History commits={commits} language={lang} loadMore={loadMore} />;
const commits = versions.map(v => v.commit);
const slideLines = versions.map(v => v.lines);

return (
<History commits={commits} slideLines={slideLines} loadMore={loadMore} />
);
}

function useCommitsLoader(gitProvider, path) {
function useVersionsLoader(gitProvider) {
const [state, setState] = useState({
data: null,
loading: true,
Expand All @@ -69,7 +65,7 @@ function useCommitsLoader(gitProvider, path) {

useEffect(() => {
gitProvider
.getCommits(path, state.last)
.getVersions(state.last)
.then(data => {
setState(old => ({
data,
Expand All @@ -80,12 +76,13 @@ function useCommitsLoader(gitProvider, path) {
}));
})
.catch(error => {
setState({
setState(old => ({
...old,
loading: false,
error
});
error: error.message
}));
});
}, [path, state.last]);
}, [state.last]);

return [state.data, state.loading, state.error, loadMore];
}
74 changes: 74 additions & 0 deletions src/git-providers/bitbucket-commit-fetcher.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
const cache = {};

async function getCommits({ repo, sha, path, last, token }) {
if (!cache[path]) {
let fields =
"values.path,values.commit.date,values.commit.message,values.commit.hash,values.commit.author.*,values.commit.links.html, values.commit.author.user.nickname, values.commit.author.user.links.avatar.href, values.commit.links.html.href";
// fields = "*.*.*.*.*";
const commitsResponse = await fetch(
`https://api.bitbucket.org/2.0/repositories/${repo}/filehistory/${sha}/${path}?fields=${fields}`,
{ headers: token ? { Authorization: `bearer ${token}` } : {} }
);

if (!commitsResponse.ok) {
throw {
status: commitsResponse.status === 403 ? 404 : commitsResponse.status,
body: commitsJson
};
}

const commitsJson = await commitsResponse.json();

cache[path] = commitsJson.values.map(({ commit }) => ({
sha: commit.hash,
date: new Date(commit.date),
author: {
login: commit.author.user
? commit.author.user.nickname
: commit.author.raw,
avatar: commit.author.user && commit.author.user.links.avatar.href
},
commitUrl: commit.links.html.href,
message: commit.message
}));
}

const commits = cache[path].slice(0, last);

await Promise.all(
commits.map(async commit => {
if (!commit.content) {
const info = await getContent(repo, commit.sha, path, token);
commit.content = info.content;
}
})
);

return commits;
}

async function getContent(repo, sha, path, token) {
const contentResponse = await fetch(
`https://api.bitbucket.org/2.0/repositories/${repo}/src/${sha}/${path}`,
{ headers: token ? { Authorization: `bearer ${token}` } : {} }
);

if (contentResponse.status === 404) {
return { content: "" };
}

if (!contentResponse.ok) {
throw {
status: contentResponse.status,
body: contentJson
};
}

const content = await contentResponse.text();

return { content };
}

export default {
getCommits
};
87 changes: 16 additions & 71 deletions src/git-providers/bitbucket-provider.js
Original file line number Diff line number Diff line change
@@ -1,35 +1,15 @@
import netlify from "netlify-auth-providers";
import React from "react";
const TOKEN_KEY = "bitbucket-token";

function getHeaders() {
const token = window.localStorage.getItem(TOKEN_KEY);
return token ? { Authorization: `Bearer ${token}` } : {};
}
import versioner from "./versioner";
import { SOURCE } from "./sources";

const TOKEN_KEY = "bitbucket-token";

function isLoggedIn() {
return !!window.localStorage.getItem(TOKEN_KEY);
}

async function getContent(repo, sha, path) {
const contentResponse = await fetch(
`https://api.bitbucket.org/2.0/repositories/${repo}/src/${sha}/${path}`,
{ headers: getHeaders() }
);

if (contentResponse.status === 404) {
return { content: "" };
}

if (!contentResponse.ok) {
throw contentResponse;
}

const content = await contentResponse.text();

return { content };
}

function getUrlParams() {
const [, owner, reponame, , sha, ...paths] = window.location.pathname.split(
"/"
Expand All @@ -52,52 +32,6 @@ function showLanding() {
return !repo;
}

const cache = {};

async function getCommits(path, last) {
const [repo, sha] = getUrlParams();

if (!cache[path]) {
let fields =
"values.path,values.commit.date,values.commit.message,values.commit.hash,values.commit.author.*,values.commit.links.html, values.commit.author.user.nickname, values.commit.author.user.links.avatar.href, values.commit.links.html.href";
// fields = "*.*.*.*.*";
const commitsResponse = await fetch(
`https://api.bitbucket.org/2.0/repositories/${repo}/filehistory/${sha}/${path}?fields=${fields}`,
{ headers: getHeaders() }
);
if (!commitsResponse.ok) {
throw commitsResponse;
}
const commitsJson = await commitsResponse.json();

cache[path] = commitsJson.values.map(({ commit }) => ({
sha: commit.hash,
date: new Date(commit.date),
author: {
login: commit.author.user
? commit.author.user.nickname
: commit.author.raw,
avatar: commit.author.user && commit.author.user.links.avatar.href
},
commitUrl: commit.links.html.href,
message: commit.message
}));
}

const commits = cache[path].slice(0, last);

await Promise.all(
commits.map(async commit => {
if (!commit.content) {
const info = await getContent(repo, commit.sha, path);
commit.content = info.content;
}
})
);

return commits;
}

function logIn() {
// return new Promise((resolve, reject) => {
var authenticator = new netlify({
Expand Down Expand Up @@ -125,10 +59,21 @@ function LogInButton() {
);
}

function getParams() {
const [repo, sha, path] = getUrlParams();
const token = window.localStorage.getItem(TOKEN_KEY);
return { repo, sha, path, token };
}

async function getVersions(last) {
const params = { ...getParams(), last };
return await versioner.getVersions(SOURCE.BITBUCKET, params);
}

export default {
showLanding,
getPath,
getCommits,
getVersions,
logIn,
isLoggedIn,
LogInButton
Expand Down
14 changes: 14 additions & 0 deletions src/git-providers/cli-commit-fetcher.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
async function getCommits({ path, last }) {
// TODO cache
const response = await fetch(
`/api/commits?path=${encodeURIComponent(path)}&last=${last}`
);
const commits = await response.json();
commits.forEach(c => (c.date = new Date(c.date)));

return commits;
}

export default {
getCommits
};
Loading

0 comments on commit 4ab4543

Please sign in to comment.