Skip to content

Commit 715c19f

Browse files
authored
Merge pull request #130 from UW-Macrostrat/maps-ingest
Split maps ingestion system into a separate sub-route
2 parents d51277b + 4d0d929 commit 715c19f

36 files changed

+248
-144
lines changed

src/layouts/main.module.sass

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11

22
.content-page
3-
margin: 1em 4em
3+
margin: 1em 4em 3em
44

55
.centered
66
min-height: 100vh

src/pages/maps/+Page.ts

Lines changed: 14 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,13 @@
11
import hyper from "@macrostrat/hyper";
2-
3-
// Styles
4-
5-
import "../../styles/padding.css";
6-
72
// Page for a list of maps
8-
import styles from "./main.module.sass";
3+
import styles from "./main.module.scss";
94
import { tempImageIndex, s3Address } from "./raster-images";
10-
import {
11-
Icon,
12-
IconSize,
13-
Navbar,
14-
AnchorButton,
15-
Tooltip,
16-
Card,
17-
} from "@blueprintjs/core";
5+
import { AnchorButton } from "@blueprintjs/core";
6+
import { ContentPage } from "~/layouts";
187

198
const h = hyper.styled(styles);
209

21-
export function Page({ sources, user, url, ingest_api }) {
10+
export function Page({ sources }) {
2211
const sources1 = sources.map((source) => {
2312
const { source_id } = source;
2413
const image = tempImageIndex[source_id];
@@ -27,101 +16,22 @@ export function Page({ sources, user, url, ingest_api }) {
2716
return source;
2817
});
2918

30-
return h("div", [
31-
h(Navbar, {}, [
32-
h(Navbar.Group, { align: "left" }, [h(Navbar.Heading, "Source Maps")]),
33-
h(Navbar.Group, { align: "right" }, [
34-
h(
35-
Tooltip,
36-
{ content: user == undefined ? "Log In" : "Logged In" },
37-
h(AnchorButton, {
38-
icon: user == undefined ? "log-in" : "user",
39-
style: {
40-
margin: "0 0.5em",
41-
borderRadius: "50%",
42-
backgroundColor: user == undefined ? "#fdeb88" : "#90d090",
43-
},
44-
href: `${ingest_api}/security/login?return_url=${url}`,
45-
})
46-
),
47-
]),
19+
return h(ContentPage, [
20+
h("div.float-right.padding.stick-to-top", [
21+
h(
22+
AnchorButton,
23+
{ icon: "flows", href: "/maps/ingestion", large: true },
24+
"Ingestion system"
25+
),
4826
]),
27+
h("h1", "Maps"),
4928
h(
50-
"div",
51-
{
52-
style: {
53-
display: "flex",
54-
justifyContent: "center",
55-
flexDirection: "column",
56-
},
57-
},
58-
[
59-
...sources1.map((d) => {
60-
return h(
61-
"div",
62-
{ style: { maxWidth: "1000px", minWidth: "50%", margin: "auto" } },
63-
[h(SourceCard, { source: d, key: d.source_id, user: user })]
64-
);
65-
}),
66-
]
29+
"ul.maps-list",
30+
sources1.map((d) => h(SourceItem, { source: d, key: d.source_id }))
6731
),
6832
]);
6933
}
7034

71-
interface Source {
72-
source_id: number;
73-
name: string;
74-
scale: number;
75-
rasterURL?: string;
76-
}
77-
78-
const SourceCard = ({
79-
source,
80-
user,
81-
}: {
82-
source: Source;
83-
user: any | undefined;
84-
}) => {
85-
const href = `/maps/${source.source_id}`;
86-
const edit_href = `/maps/${source.source_id}/edit`;
87-
88-
return h(
89-
Card,
90-
{
91-
style: {
92-
display: "flex",
93-
flexDirection: "row",
94-
justifyContent: "space-between",
95-
padding: "0.5em",
96-
margin: "0.5em",
97-
borderRadius: "0.5em",
98-
backgroundColor: "#f0f0f0",
99-
},
100-
},
101-
[
102-
h("div", {}, [
103-
h(
104-
"h4",
105-
{ style: { margin: "0px" } },
106-
source.source_id + " " + source.name
107-
),
108-
h("h6", { style: { margin: "0px" } }, source.scale),
109-
h.if(source.rasterURL != null)([
110-
" ",
111-
h("span.raster", { style: { marginTop: ".5rem" } }, "Raster"),
112-
]),
113-
]),
114-
h("div", {}, [
115-
h(AnchorButton, { href: href, icon: "map" }, "View"),
116-
h.if(user !== undefined)([
117-
"",
118-
h(AnchorButton, { href: edit_href, icon: "edit" }, "Edit"),
119-
]),
120-
]),
121-
]
122-
);
123-
};
124-
12535
function SourceItem({ source }) {
12636
const { source_id, name } = source;
12737
const href = `/maps/${source_id}`;
@@ -133,9 +43,5 @@ function SourceItem({ source }) {
13343
" ",
13444
h("span.scale", {}, source.scale),
13545
h.if(source.rasterURL != null)([" ", h("span.raster", "Raster")]),
136-
" ",
137-
h("a", { href: edit_href }, [
138-
h(Icon, { icon: "edit", size: IconSize.SMALL }),
139-
]),
14046
]);
14147
}

src/pages/maps/+onBeforeRender.ts

Lines changed: 6 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,16 @@
1-
import { ingestPrefix } from "@macrostrat-web/settings";
1+
import { apiV2Prefix } from "@macrostrat-web/settings";
22
import fetch from "node-fetch";
33

4-
const apiAddress = ingestPrefix + "/sources";
4+
const apiAddress = apiV2Prefix + "/defs/sources";
55

66
export async function onBeforeRender(pageContext) {
77
// `.page.server.js` files always run in Node.js; we could use SQL/ORM queries here.
8-
const url = new URL(apiAddress);
9-
url.searchParams.set("page_size", "9999");
10-
11-
const response = await fetch(url.toString());
12-
const sources = await response.json();
13-
8+
const response = await fetch(apiAddress + "?format=json");
9+
const res = await response.json();
10+
let sources = res.success.data;
1411
sources.sort((a, b) => a.source_id - b.source_id);
1512

16-
const pageProps = {
17-
sources: sources,
18-
user: pageContext.user,
19-
url: pageContext.url,
20-
ingest_api: ingestPrefix,
21-
};
13+
const pageProps = { sources };
2214
return {
2315
pageContext: {
2416
pageProps,

src/pages/maps/ingestion/+Page.ts

Lines changed: 145 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
import hyper from "@macrostrat/hyper";
2+
3+
// Styles
4+
5+
// Page for a list of maps
6+
import styles from "./main.module.sass";
7+
import { tempImageIndex, s3Address } from "../raster-images";
8+
import {
9+
Icon,
10+
IconSize,
11+
Navbar,
12+
AnchorButton,
13+
Tooltip,
14+
Card,
15+
} from "@blueprintjs/core";
16+
import { ContentPage } from "~/layouts";
17+
18+
const h = hyper.styled(styles);
19+
20+
export function Page({ sources, user, url, ingest_api }) {
21+
const sources1 = sources.map((source) => {
22+
const { source_id } = source;
23+
const image = tempImageIndex[source_id];
24+
if (image == null) return source;
25+
source.rasterURL = `${s3Address}/${image}`;
26+
return source;
27+
});
28+
29+
return h(ContentPage, [
30+
h(Navbar, {}, [
31+
h(Navbar.Group, { align: "left" }, [h(Navbar.Heading, "Source Maps")]),
32+
h(Navbar.Group, { align: "right" }, [
33+
h(
34+
Tooltip,
35+
{ content: user == undefined ? "Log In" : "Logged In" },
36+
h(AnchorButton, {
37+
icon: user == undefined ? "log-in" : "user",
38+
style: {
39+
margin: "0 0.5em",
40+
borderRadius: "50%",
41+
backgroundColor: user == undefined ? "#fdeb88" : "#90d090",
42+
},
43+
onClick() {
44+
// Assemble the return URL on click based on the current page
45+
const return_url =
46+
window.location.origin + window.location.pathname;
47+
window.location.href = `${ingest_api}/security/login?return_url=${return_url}`;
48+
},
49+
})
50+
),
51+
]),
52+
]),
53+
h(
54+
"div",
55+
{
56+
style: {
57+
display: "flex",
58+
justifyContent: "center",
59+
flexDirection: "column",
60+
},
61+
},
62+
[
63+
...sources1.map((d) => {
64+
return h(
65+
"div",
66+
{ style: { maxWidth: "1000px", minWidth: "50%", margin: "auto" } },
67+
[h(SourceCard, { source: d, key: d.source_id, user: user })]
68+
);
69+
}),
70+
]
71+
),
72+
]);
73+
}
74+
75+
interface Source {
76+
source_id: number;
77+
name: string;
78+
scale: number;
79+
rasterURL?: string;
80+
}
81+
82+
const SourceCard = ({
83+
source,
84+
user,
85+
}: {
86+
source: Source;
87+
user: any | undefined;
88+
}) => {
89+
const href = `/maps/${source.source_id}`;
90+
const edit_href = `/maps/ingestion/${source.source_id}`;
91+
92+
return h(
93+
Card,
94+
{
95+
style: {
96+
display: "flex",
97+
flexDirection: "row",
98+
justifyContent: "space-between",
99+
padding: "0.5em",
100+
margin: "0.5em",
101+
borderRadius: "0.5em",
102+
backgroundColor: "#f0f0f0",
103+
},
104+
},
105+
[
106+
h("div", {}, [
107+
h(
108+
"h4",
109+
{ style: { margin: "0px" } },
110+
source.source_id + " " + source.name
111+
),
112+
h("h6", { style: { margin: "0px" } }, source.scale),
113+
h.if(source.rasterURL != null)([
114+
" ",
115+
h("span.raster", { style: { marginTop: ".5rem" } }, "Raster"),
116+
]),
117+
]),
118+
h("div", {}, [
119+
h(AnchorButton, { href: href, icon: "map" }, "View"),
120+
h.if(user !== undefined)([
121+
"",
122+
h(AnchorButton, { href: edit_href, icon: "edit" }, "Edit"),
123+
]),
124+
]),
125+
]
126+
);
127+
};
128+
129+
function SourceItem({ source }) {
130+
const { source_id, name } = source;
131+
const href = `/maps/${source_id}`;
132+
const edit_href = `/maps/${source_id}/edit`;
133+
return h("li", [
134+
h("span.source-id", {}, source_id),
135+
" ",
136+
h("a", { href }, [name]),
137+
" ",
138+
h("span.scale", {}, source.scale),
139+
h.if(source.rasterURL != null)([" ", h("span.raster", "Raster")]),
140+
" ",
141+
h("a", { href: edit_href }, [
142+
h(Icon, { icon: "edit", size: IconSize.SMALL }),
143+
]),
144+
]);
145+
}
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { ingestPrefix } from "@macrostrat-web/settings";
2+
import fetch from "node-fetch";
3+
4+
const apiAddress = ingestPrefix + "/sources";
5+
6+
export async function onBeforeRender(pageContext) {
7+
// `.page.server.js` files always run in Node.js; we could use SQL/ORM queries here.
8+
const url = new URL(apiAddress);
9+
url.searchParams.set("page_size", "9999");
10+
11+
const response = await fetch(url.toString());
12+
const sources = await response.json();
13+
14+
sources.sort((a, b) => a.source_id - b.source_id);
15+
16+
const pageProps = {
17+
sources: sources,
18+
user: pageContext.user,
19+
ingest_api: ingestPrefix,
20+
};
21+
return {
22+
pageContext: {
23+
pageProps,
24+
},
25+
};
26+
}

src/pages/maps/@id/edit/components/cell/editable-cell.ts renamed to src/pages/maps/ingestion/@id/components/cell/editable-cell.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { Cell, EditableCell2Props } from "@blueprintjs/table";
44

55
import hyper from "@macrostrat/hyper";
66
import styles from "./main.module.sass";
7-
import { getTableUpdate } from "~/pages/maps/@id/edit/table-util";
87

98
export const h = hyper.styled(styles);
109

0 commit comments

Comments
 (0)