Skip to content

Commit e6817ad

Browse files
OksamiesOksamies
committed
Add packageVersion pages
1 parent b13130b commit e6817ad

File tree

18 files changed

+2117
-21
lines changed

18 files changed

+2117
-21
lines changed

‎apps/cyberstorm-remix/app/p/packageVersion.tsx‎

Lines changed: 544 additions & 0 deletions
Large diffs are not rendered by default.

‎apps/cyberstorm-remix/app/p/packageVersionWithoutCommunity.tsx‎

Lines changed: 491 additions & 0 deletions
Large diffs are not rendered by default.

‎apps/cyberstorm-remix/app/p/tabs/Readme/PackageVersionReadme.tsx‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
import { Await, LoaderFunctionArgs } from "react-router";
2+
import { useLoaderData } from "react-router";
3+
import { DapperTs } from "@thunderstore/dapper-ts";
4+
import {
5+
getPublicEnvVariables,
6+
getSessionTools,
7+
} from "cyberstorm/security/publicEnvVariables";
8+
import { Suspense } from "react";
9+
import { SkeletonBox } from "@thunderstore/cyberstorm";
10+
import "./Readme.css";
11+
12+
export async function loader({ params }: LoaderFunctionArgs) {
13+
if (params.namespaceId && params.packageId && params.packageVersion) {
14+
const publicEnvVariables = getPublicEnvVariables(["VITE_API_URL"]);
15+
const dapper = new DapperTs(() => {
16+
return {
17+
apiHost: publicEnvVariables.VITE_API_URL,
18+
sessionId: undefined,
19+
};
20+
});
21+
return {
22+
readme: await dapper.getPackageReadme(
23+
params.namespaceId,
24+
params.packageId,
25+
params.packageVersion
26+
),
27+
};
28+
}
29+
return {
30+
status: "error",
31+
message: "Failed to load readme",
32+
readme: { html: "" },
33+
};
34+
}
35+
36+
export async function clientLoader({ params }: LoaderFunctionArgs) {
37+
if (params.namespaceId && params.packageId && params.packageVersion) {
38+
const tools = getSessionTools();
39+
const dapper = new DapperTs(() => {
40+
return {
41+
apiHost: tools?.getConfig().apiHost,
42+
sessionId: tools?.getConfig().sessionId,
43+
};
44+
});
45+
return {
46+
readme: dapper.getPackageReadme(
47+
params.namespaceId,
48+
params.packageId,
49+
params.packageVersion
50+
),
51+
};
52+
}
53+
return {
54+
status: "error",
55+
message: "Failed to load readme",
56+
readme: { html: "" },
57+
};
58+
}
59+
60+
export default function PackageVersionReadme() {
61+
const { status, message, readme } = useLoaderData<
62+
typeof loader | typeof clientLoader
63+
>();
64+
65+
if (status === "error") return <div>{message}</div>;
66+
return (
67+
<Suspense fallback={<SkeletonBox className="package-readme__skeleton" />}>
68+
<Await
69+
resolve={readme}
70+
errorElement={<div>Error occurred while loading description</div>}
71+
>
72+
{(resolvedValue) => (
73+
<>
74+
<div className="markdown-wrapper">
75+
<div
76+
dangerouslySetInnerHTML={{ __html: resolvedValue.html }}
77+
className="markdown"
78+
/>
79+
</div>
80+
</>
81+
)}
82+
</Await>
83+
</Suspense>
84+
);
85+
}

‎apps/cyberstorm-remix/app/p/tabs/Readme/PackageVersionWithoutCommunityReadme.tsx‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
import { Await, LoaderFunctionArgs } from "react-router";
2+
import { useLoaderData } from "react-router";
3+
import { DapperTs } from "@thunderstore/dapper-ts";
4+
import {
5+
getPublicEnvVariables,
6+
getSessionTools,
7+
} from "cyberstorm/security/publicEnvVariables";
8+
import { Suspense } from "react";
9+
import { SkeletonBox } from "@thunderstore/cyberstorm";
10+
import "./Readme.css";
11+
12+
export async function loader({ params }: LoaderFunctionArgs) {
13+
if (params.namespaceId && params.packageId && params.packageVersion) {
14+
const publicEnvVariables = getPublicEnvVariables(["VITE_API_URL"]);
15+
const dapper = new DapperTs(() => {
16+
return {
17+
apiHost: publicEnvVariables.VITE_API_URL,
18+
sessionId: undefined,
19+
};
20+
});
21+
return {
22+
readme: await dapper.getPackageReadme(
23+
params.namespaceId,
24+
params.packageId,
25+
params.packageVersion
26+
),
27+
};
28+
}
29+
return {
30+
status: "error",
31+
message: "Failed to load readme",
32+
readme: { html: "" },
33+
};
34+
}
35+
36+
export async function clientLoader({ params }: LoaderFunctionArgs) {
37+
if (params.namespaceId && params.packageId && params.packageVersion) {
38+
const tools = getSessionTools();
39+
const dapper = new DapperTs(() => {
40+
return {
41+
apiHost: tools?.getConfig().apiHost,
42+
sessionId: tools?.getConfig().sessionId,
43+
};
44+
});
45+
return {
46+
readme: dapper.getPackageReadme(
47+
params.namespaceId,
48+
params.packageId,
49+
params.packageVersion
50+
),
51+
};
52+
}
53+
return {
54+
status: "error",
55+
message: "Failed to load readme",
56+
readme: { html: "" },
57+
};
58+
}
59+
60+
export default function PackageVersionReadme() {
61+
const { status, message, readme } = useLoaderData<
62+
typeof loader | typeof clientLoader
63+
>();
64+
65+
if (status === "error") return <div>{message}</div>;
66+
return (
67+
<Suspense fallback={<SkeletonBox className="package-readme__skeleton" />}>
68+
<Await
69+
resolve={readme}
70+
errorElement={<div>Error occurred while loading description</div>}
71+
>
72+
{(resolvedValue) => (
73+
<>
74+
<div className="markdown-wrapper">
75+
<div
76+
dangerouslySetInnerHTML={{ __html: resolvedValue.html }}
77+
className="markdown"
78+
/>
79+
</div>
80+
</>
81+
)}
82+
</Await>
83+
</Suspense>
84+
);
85+
}

‎apps/cyberstorm-remix/app/p/tabs/Required/PackageVersionRequired.tsx‎

Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
import "./Required.css";
2+
// import { Heading, SkeletonBox } from "@thunderstore/cyberstorm";
3+
// import {
4+
// Await,
5+
// LoaderFunctionArgs
6+
// } from "react-router";
7+
// import { useLoaderData, useOutletContext } from "react-router";
8+
// import { ListingDependency } from "~/commonComponents/ListingDependency/ListingDependency";
9+
// import { DapperTs } from "@thunderstore/dapper-ts";
10+
// import { OutletContextShape } from "~/root";
11+
// import {
12+
// getPublicEnvVariables,
13+
// getSessionTools,
14+
// } from "cyberstorm/security/publicEnvVariables";
15+
// import { Suspense } from "react";
16+
17+
// LOADERS ARE WAITING FOR PACKAGE DEPENDENCIES API ENDPOINT
18+
19+
// export async function loader({ params }: LoaderFunctionArgs) {
20+
// if (
21+
// params.communityId &&
22+
// params.namespaceId &&
23+
// params.packageId &&
24+
// params.packageVersion
25+
// ) {
26+
// const publicEnvVariables = getPublicEnvVariables(["VITE_API_URL"]);
27+
// const dapper = new DapperTs(() => {
28+
// return {
29+
// apiHost: publicEnvVariables.VITE_API_URL,
30+
// sessionId: undefined,
31+
// };
32+
// });
33+
// return {
34+
// listing: dapper.getPackageListingDetails(
35+
// params.communityId,
36+
// params.namespaceId,
37+
// params.packageId
38+
// ),
39+
// };
40+
// }
41+
// throw new Response("Listing dependencies not found", { status: 404 });
42+
// }
43+
44+
// export async function clientLoader({ params }: LoaderFunctionArgs) {
45+
// if (
46+
// params.communityId &&
47+
// params.namespaceId &&
48+
// params.packageId &&
49+
// params.packageVersion
50+
// ) {
51+
// const tools = getSessionTools();
52+
// const dapper = new DapperTs(() => {
53+
// return {
54+
// apiHost: tools?.getConfig().apiHost,
55+
// sessionId: tools?.getConfig().sessionId,
56+
// };
57+
// });
58+
// return {
59+
// listing: dapper.getPackageListingDetails(
60+
// params.communityId,
61+
// params.namespaceId,
62+
// params.packageId
63+
// ),
64+
// };
65+
// }
66+
// throw new Response("Listing dependencies not found", { status: 404 });
67+
// }
68+
69+
export default function PackageVersionRequired() {
70+
// const { listing } = useLoaderData<typeof loader | typeof clientLoader>();
71+
// const outletContext = useOutletContext() as OutletContextShape;
72+
73+
return <p>TODO; Waiting for package dependencies API endpoint</p>;
74+
75+
// return (
76+
// <Suspense fallback={<SkeletonBox className="package-required__skeleton" />}>
77+
// <Await
78+
// resolve={listing}
79+
// errorElement={
80+
// <div>Error occurred while loading required dependencies</div>
81+
// }
82+
// >
83+
// {(resolvedValue) => (
84+
// <>
85+
// <div className="required">
86+
// <div className="required__title">
87+
// <Heading csLevel="3" csSize="3">
88+
// Required mods ({resolvedValue.dependencies.length})
89+
// </Heading>
90+
// <span className="required__description">
91+
// This package requires the following packages to work.
92+
// </span>
93+
// </div>
94+
// <div className="required__body">
95+
// {resolvedValue.dependencies.map((dep, key) => {
96+
// return (
97+
// <ListingDependency
98+
// key={key}
99+
// dependency={dep}
100+
// // TODO: Remove when package versiond detail is available
101+
// domain={outletContext.domain}
102+
// />
103+
// );
104+
// })}
105+
// </div>
106+
// </div>
107+
// </>
108+
// )}
109+
// </Await>
110+
// </Suspense>
111+
// );
112+
}

‎apps/cyberstorm-remix/app/p/tabs/Required/PackageVersionWithoutCommunityRequired.tsx‎

Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
import "./Required.css";
2+
// import { Heading, SkeletonBox } from "@thunderstore/cyberstorm";
3+
// import {
4+
// Await,
5+
// LoaderFunctionArgs
6+
// } from "react-router";
7+
// import { useLoaderData, useOutletContext } from "react-router";
8+
// import { ListingDependency } from "~/commonComponents/ListingDependency/ListingDependency";
9+
// import { DapperTs } from "@thunderstore/dapper-ts";
10+
// import { OutletContextShape } from "~/root";
11+
// import {
12+
// getPublicEnvVariables,
13+
// getSessionTools,
14+
// } from "cyberstorm/security/publicEnvVariables";
15+
// import { Suspense } from "react";
16+
17+
// LOADERS ARE WAITING FOR PACKAGE DEPENDENCIES API ENDPOINT
18+
19+
// export async function loader({ params }: LoaderFunctionArgs) {
20+
// if (
21+
// params.communityId &&
22+
// params.namespaceId &&
23+
// params.packageId &&
24+
// params.packageVersion
25+
// ) {
26+
// const publicEnvVariables = getPublicEnvVariables(["VITE_API_URL"]);
27+
// const dapper = new DapperTs(() => {
28+
// return {
29+
// apiHost: publicEnvVariables.VITE_API_URL,
30+
// sessionId: undefined,
31+
// };
32+
// });
33+
// return {
34+
// listing: dapper.getPackageListingDetails(
35+
// params.communityId,
36+
// params.namespaceId,
37+
// params.packageId
38+
// ),
39+
// };
40+
// }
41+
// throw new Response("Listing dependencies not found", { status: 404 });
42+
// }
43+
44+
// export async function clientLoader({ params }: LoaderFunctionArgs) {
45+
// if (
46+
// params.communityId &&
47+
// params.namespaceId &&
48+
// params.packageId &&
49+
// params.packageVersion
50+
// ) {
51+
// const tools = getSessionTools();
52+
// const dapper = new DapperTs(() => {
53+
// return {
54+
// apiHost: tools?.getConfig().apiHost,
55+
// sessionId: tools?.getConfig().sessionId,
56+
// };
57+
// });
58+
// return {
59+
// listing: dapper.getPackageListingDetails(
60+
// params.communityId,
61+
// params.namespaceId,
62+
// params.packageId
63+
// ),
64+
// };
65+
// }
66+
// throw new Response("Listing dependencies not found", { status: 404 });
67+
// }
68+
69+
export default function PackageVersionRequired() {
70+
// const { listing } = useLoaderData<typeof loader | typeof clientLoader>();
71+
// const outletContext = useOutletContext() as OutletContextShape;
72+
73+
return <p>TODO; Waiting for package dependencies API endpoint</p>;
74+
75+
// return (
76+
// <Suspense fallback={<SkeletonBox className="package-required__skeleton" />}>
77+
// <Await
78+
// resolve={listing}
79+
// errorElement={
80+
// <div>Error occurred while loading required dependencies</div>
81+
// }
82+
// >
83+
// {(resolvedValue) => (
84+
// <>
85+
// <div className="required">
86+
// <div className="required__title">
87+
// <Heading csLevel="3" csSize="3">
88+
// Required mods ({resolvedValue.dependencies.length})
89+
// </Heading>
90+
// <span className="required__description">
91+
// This package requires the following packages to work.
92+
// </span>
93+
// </div>
94+
// <div className="required__body">
95+
// {resolvedValue.dependencies.map((dep, key) => {
96+
// return (
97+
// <ListingDependency
98+
// key={key}
99+
// dependency={dep}
100+
// // TODO: Remove when package versiond detail is available
101+
// domain={outletContext.domain}
102+
// />
103+
// );
104+
// })}
105+
// </div>
106+
// </div>
107+
// </>
108+
// )}
109+
// </Await>
110+
// </Suspense>
111+
// );
112+
}

0 commit comments

Comments
 (0)