Skip to content

Commit abbf864

Browse files
committed
Add more type annotations
1 parent ea7dbe7 commit abbf864

File tree

14 files changed

+179
-95
lines changed

14 files changed

+179
-95
lines changed

binderhub/static/js/App.jsx

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,34 @@ import { HomePage } from "./pages/HomePage.jsx";
1212
import { createRoutesFromElements } from "react-router";
1313

1414
export const PAGE_CONFIG = window.pageConfig;
15+
16+
/**
17+
* @typedef {object} RepoConfig
18+
* @prop {string} label
19+
* @prop {string} placeholder
20+
*
21+
* @typedef {object} DetectConfig
22+
* @prop {string} regex
23+
*
24+
* @typedef {object} RefConfig
25+
* @prop {boolean} enabled
26+
* @prop {string} [default]
27+
*
28+
* @typedef {object} Provider
29+
* @prop {string} displayName
30+
* @prop {string} id
31+
* @prop {DetectConfig} [detect]
32+
* @prop {RepoConfig} repo
33+
* @prop {RefConfig} ref
34+
*
35+
*/
36+
/**
37+
* @type {Array<Provider>}
38+
*/
1539
export const PROVIDERS = PAGE_CONFIG.repoProviders;
40+
1641
export const BASE_URL = new URL(PAGE_CONFIG.baseUrl, window.location.href);
42+
1743
export const PUBLIC_BASE_URL = PAGE_CONFIG.publicBaseUrl
1844
? new URL(BASE_URL)
1945
: new URL(PAGE_CONFIG.baseUrl, window.location.href);
@@ -35,14 +61,13 @@ const router = createBrowserRouter(
3561
<Route
3662
key={p.id}
3763
path={`${PAGE_CONFIG.baseUrl}v2/*`}
38-
element={<LoadingPage provider={p} baseUrl={BASE_URL} />}
64+
element={<LoadingPage baseUrl={BASE_URL} />}
3965
/>
4066
))}
4167
</Route>,
4268
),
4369
);
4470
function App() {
45-
console.log(router);
4671
return (
4772
<div className="container-md">
4873
<div className="col-8 offset-md-2">

binderhub/static/js/components/BuilderLauncher.jsx

Lines changed: 43 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,31 @@ import { FitAddon } from "xterm-addon-fit";
55
import "xterm/css/xterm.css";
66
import { Progress, PROGRESS_STATES } from "./Progress.jsx";
77

8+
/**
9+
*
10+
* @param {string} serverUrl
11+
* @param {string} token
12+
* @param {string} urlPath
13+
*/
814
function redirectToRunningServer(serverUrl, token, urlPath) {
915
// Make sure urlPath doesn't start with a `/`
1016
urlPath = urlPath.replace(/^\//, "");
1117
const redirectUrl = new URL(urlPath, serverUrl);
1218
redirectUrl.searchParams.append("token", token);
13-
window.location.href = redirectUrl;
19+
window.location.href = redirectUrl.toString();
1420
}
1521

22+
/**
23+
*
24+
* @param {URL} baseUrl
25+
* @param {string} spec
26+
* @param {Terminal} term
27+
* @param {FitAddon} fitAddon
28+
* @param {string} urlPath
29+
* @param {(l: boolean) => void} setIsLaunching
30+
* @param {(p: PROGRESS_STATES) => void} setProgressState
31+
* @param {(e: boolean) => void} setEnsureLogsVisible
32+
*/
1633
async function buildImage(
1734
baseUrl,
1835
spec,
@@ -83,6 +100,16 @@ async function buildImage(
83100
}
84101
}
85102

103+
/**
104+
* @typedef {object} ImageLogsProps
105+
* @prop {(t: Terminal) => void} setTerm
106+
* @prop {(f: FitAddon) => void} setFitAddon
107+
* @prop {boolean} logsVisible
108+
* @prop {(l: boolean) => void} setLogsVisible
109+
*
110+
* @param {ImageLogsProps} props
111+
* @returns
112+
*/
86113
function ImageLogs({ setTerm, setFitAddon, logsVisible, setLogsVisible }) {
87114
const toggleLogsButton = useRef();
88115
useEffect(() => {
@@ -127,6 +154,20 @@ function ImageLogs({ setTerm, setFitAddon, logsVisible, setLogsVisible }) {
127154
</div>
128155
);
129156
}
157+
158+
/**
159+
* @typedef {object} BuildLauncherProps
160+
* @prop {URL} baseUrl
161+
* @prop {string} spec
162+
* @prop {string} urlPath
163+
* @prop {boolean} isLaunching
164+
* @prop {(l: boolean) => void} setIsLaunching
165+
* @prop {PROGRESS_STATES} progressState
166+
* @prop {(p: PROGRESS_STATES) => void} setProgressState
167+
*
168+
* @param {BuildLauncherProps} props
169+
* @returns
170+
*/
130171
export function BuilderLauncher({
131172
baseUrl,
132173
spec,
@@ -158,7 +199,7 @@ export function BuilderLauncher({
158199
}, [isLaunching]);
159200
return (
160201
<div className="bg-light p-4">
161-
<Progress state={progressState} />
202+
<Progress progressState={progressState} />
162203
<ImageLogs
163204
setTerm={setTerm}
164205
setFitAddon={setFitAddon}

binderhub/static/js/components/FaviconUpdater.jsx

Lines changed: 23 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,29 @@ import { PROGRESS_STATES } from "./Progress.jsx";
66
import { useEffect } from "react";
77
import { updateFavicon } from "../src/favicon";
88

9+
/**
10+
* @typedef {object} FaviconUpdaterProps
11+
* @prop {PROGRESS_STATES} progressState
12+
* @param {FaviconUpdaterProps} props
13+
*/
914
export function FaviconUpdater({ progressState }) {
10-
useEffect(() => {
11-
switch (progressState) {
12-
case PROGRESS_STATES.FAILED: {
13-
updateFavicon(FailIcon);
14-
break;
15-
}
16-
case PROGRESS_STATES.SUCCESS: {
17-
updateFavicon(SuccessIcon);
18-
break;
19-
}
20-
case PROGRESS_STATES.BUILDING:
21-
case PROGRESS_STATES.PUSHING:
22-
case PROGRESS_STATES.LAUNCHING: {
23-
updateFavicon(ProgressIcon);
24-
break;
25-
}
15+
let icon;
16+
switch (progressState) {
17+
case PROGRESS_STATES.FAILED: {
18+
icon = FailIcon;
19+
break;
2620
}
27-
}, [progressState]);
21+
case PROGRESS_STATES.SUCCESS: {
22+
icon = SuccessIcon;
23+
break;
24+
}
25+
case PROGRESS_STATES.BUILDING:
26+
case PROGRESS_STATES.PUSHING:
27+
case PROGRESS_STATES.LAUNCHING: {
28+
icon = ProgressIcon;
29+
break;
30+
}
31+
}
32+
33+
return <link rel="icon" href={icon} type="image/x-icon"></link>;
2834
}

binderhub/static/js/components/LinkGenerator.jsx

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,15 @@
11
import { useEffect, useState } from "react";
22
import copy from "copy-to-clipboard";
3-
import CopyIcon from "../copy.svg";
43

4+
/**
5+
* @typedef {object} ProviderSelectorProps
6+
* @prop {import("../App").Provider[]} providers
7+
* @prop {import("../App").Provider} selectedProvider
8+
* @prop {(p: import("../App").Provider) => void} setSelectedProvider
9+
*
10+
* @param {ProviderSelectorProps} props
11+
* @returns
12+
*/
513
function ProviderSelector({
614
providers,
715
selectedProvider,

binderhub/static/js/components/LoadingIndicator.jsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,11 @@ const HELP_MESSAGES = [
2020
'Read our <a target="_blank" href="https://discourse.jupyter.org/t/how-to-reduce-mybinder-org-repository-startup-time/4956">advice for speeding up your Binder launch</a>.',
2121
];
2222

23+
/**
24+
* @typedef {object} LoadingIndicatorProps
25+
* @prop {PROGRESS_STATES} progressState
26+
* @param {LoadingIndicatorProps} props
27+
*/
2328
export function LoadingIndicator({ progressState }) {
2429
const [currentMessage, setCurrentMessage] = useState(HELP_MESSAGES[0]);
2530

binderhub/static/js/components/NBViewerIFrame.jsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,10 @@
1+
/**
2+
* @typedef {object} NBViewerIFrameProps
3+
* @prop {string} spec
4+
* @prop {string} urlPath
5+
* @param {NBViewerIFrameProps} props
6+
* @returns
7+
*/
18
export function NBViewerIFrame({ spec, urlPath }) {
29
// We only support GitHub links as preview right now
310
if (!spec.startsWith("gh/")) {

binderhub/static/js/components/progress.jsx

Lines changed: 21 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
/**
2+
* @enum {string}
3+
*/
14
export const PROGRESS_STATES = {
25
WAITING: "Waiting",
36
BUILDING: "Building",
@@ -49,24 +52,31 @@ progressDisplay[PROGRESS_STATES.FAILED] = {
4952
className: "text-bg-danger",
5053
};
5154

52-
export function Progress({ state }) {
55+
/**
56+
* @typedef {object} ProgressProps
57+
* @prop {PROGRESS_STATES} progressState
58+
* @param {ProgressProps} props
59+
*/
60+
export function Progress({ progressState }) {
5361
return (
5462
<div
5563
className="progress-stacked mb-2"
5664
role="progressbar"
5765
style={{ height: "24px" }}
5866
>
59-
{state === null
67+
{progressState === null
6068
? ""
61-
: progressDisplay[state].precursors.concat([state]).map((s) => (
62-
<div
63-
className={`progress-bar progress-bar-striped progress-bar-animated ${progressDisplay[s].className}`}
64-
style={{ width: `${progressDisplay[s].widthPercent}%` }}
65-
key={s}
66-
>
67-
<strong>{progressDisplay[s].label}</strong>
68-
</div>
69-
))}
69+
: progressDisplay[progressState].precursors
70+
.concat([progressState])
71+
.map((s) => (
72+
<div
73+
className={`progress-bar progress-bar-striped progress-bar-animated ${progressDisplay[s].className}`}
74+
style={{ width: `${progressDisplay[s].widthPercent}%` }}
75+
key={s}
76+
>
77+
<strong>{progressDisplay[s].label}</strong>
78+
</div>
79+
))}
7080
</div>
7181
);
7282
}

binderhub/static/js/pages/HomePage.jsx

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,16 @@
1-
import { LinkGenerator } from "./components/LinkGenerator.jsx";
2-
import { BuilderLauncher } from "./components/BuilderLauncher.jsx";
3-
import { HowItWorks } from "./components/HowItWorks.jsx";
1+
import { LinkGenerator } from "../components/LinkGenerator.jsx";
2+
import { BuilderLauncher } from "../components/BuilderLauncher.jsx";
3+
import { HowItWorks } from "../components/HowItWorks.jsx";
44
import { useEffect, useState } from "react";
5-
import { FaviconUpdater } from "./components/FaviconUpdater.jsx";
5+
import { FaviconUpdater } from "../components/FaviconUpdater.jsx";
66

7+
/**
8+
* @typedef {object} HomePageProps
9+
* @prop {import("../App.jsx").Provider[]} providers
10+
* @prop {URL} publicBaseUrl
11+
* @prop {URL} baseUrl
12+
* @param {HomePageProps} props
13+
*/
714
export function HomePage({ providers, publicBaseUrl, baseUrl }) {
815
const defaultProvider = providers[0];
916
const [selectedProvider, setSelectedProvider] = useState(defaultProvider);

binderhub/static/js/pages/LoadingPage.jsx

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,17 @@
11
import { useEffect, useState } from "react";
2-
import { BuilderLauncher } from "./components/BuilderLauncher.jsx";
2+
import { BuilderLauncher } from "../components/BuilderLauncher.jsx";
33
import { useParams } from "react-router";
44
import { useSearchParams } from "react-router-dom";
5-
import { NBViewerIFrame } from "./components/NBViewerIFrame.jsx";
6-
import { LoadingIndicator } from "./components/LoadingIndicator.jsx";
7-
import { FaviconUpdater } from "./components/FaviconUpdater.jsx";
5+
import { NBViewerIFrame } from "../components/NBViewerIFrame.jsx";
6+
import { LoadingIndicator } from "../components/LoadingIndicator.jsx";
7+
import { FaviconUpdater } from "../components/FaviconUpdater.jsx";
88

9+
/**
10+
* @typedef {object} LoadingPageProps
11+
* @prop {URL} baseUrl
12+
* @param {LoadingPageProps} props
13+
* @returns
14+
*/
915
export function LoadingPage({ baseUrl }) {
1016
const [progressState, setProgressState] = useState(null);
1117

binderhub/static/js/src/favicon.js

Lines changed: 0 additions & 17 deletions
This file was deleted.

0 commit comments

Comments
 (0)