LumeWeb
/
skynet-webportal
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

programatically create accounts url

This commit is contained in:
Karol Wypchlo 2022-01-12 13:44:23 +01:00
parent c04fd5067d
commit 676703f97b
No known key found for this signature in database
GPG Key ID: B515DE9EEBE241E1
5 changed files with 60 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/website/src/components/Navigation/Navigation.js
View File

@ -3,6 +3,7 @@ import PropTypes from "prop-types";
import Link from "../Link";
import classnames from "classnames";
import useAccounts from "../../services/useAccounts";
import useAccountsUrl from "../../services/useAccountsUrl";
import { LogoWhiteText, LogoBlackText, MenuMobile, MenuMobileClose, DiscordSmall } from "../Icons";
import { useWindowSize, useWindowScroll } from "react-use";
@ -25,6 +26,7 @@ const Navigation = ({ mode, uri }) => {
const windowSize = useWindowSize();
const isWindowTop = useWindowTop();
const { data: accounts } = useAccounts();
const accountsUrl = useAccountsUrl();
React.useEffect(() => {
setOpen(false);
@ -88,18 +90,18 @@ const Navigation = ({ mode, uri }) => {
{showLoginNavigation && (
<>
<Link href="https://account.siasky.net" className="button-link-primary">
<Link href={`${accountsUrl}/auth/login`} className="button-link-primary">
Log in
</Link>
<Link href="https://account.siasky.net/auth/registration" className="button-primary">
<Link href={`${accountsUrl}/auth/registration`} className="button-primary">
Sign up
</Link>
</>
)}
{showAccountNavigation && (
<Link href="https://account.siasky.net" className="button-primary">
<Link href={accountsUrl} className="button-primary">
My account
</Link>
)}
@ -142,18 +144,18 @@ const Navigation = ({ mode, uri }) => {
<div className="flex items-center justify-center px-4 space-x-6">
{showLoginNavigation && (
<>
<Link href="https://account.siasky.net" className="button-secondary-light">
<Link href={`${accountsUrl}/auth/login`} className="button-secondary-light">
Log in
</Link>
<Link href="https://account.siasky.net/auth/registration" className="button-primary">
<Link href={`${accountsUrl}/auth/registration`} className="button-primary">
Sign up
</Link>
</>
)}
{showAccountNavigation && (
<Link href="https://account.siasky.net" className="button-primary">
<Link href={accountsUrl} className="button-primary">
My account
</Link>
)}

21
packages/website/src/components/Uploader/Uploader.js
View File

@ -6,6 +6,7 @@ import path from "path-browserify";
import { useDropzone } from "react-dropzone";
import { nanoid } from "nanoid";
import useAccounts from "../../services/useAccounts";
import useAccountsUrl from "../../services/useAccountsUrl";
import Link from "../Link";
import UploaderElement from "./UploaderElement";
@ -20,23 +21,31 @@ const getRootDirectory = (file) => {
return path.normalize(dir).slice(root.length).split(path.sep)[0];
};
const RegistrationLink = () => (
const RegistrationLink = () => {
const accountsUrl = useAccountsUrl();
return (
<Link
href="https://account.siasky.net/auth/registration"
href={`${accountsUrl}/auth/registration`}
className="uppercase underline-primary hover:text-primary transition-colors duration-200"
>
Sign up
</Link>
);
};
const LogInLink = () => (
const LogInLink = () => {
const accountsUrl = useAccountsUrl();
return (
<Link
href="https://account.siasky.net/auth/login"
href={`${accountsUrl}/auth/login`}
className="uppercase underline-primary hover:text-primary transition-colors duration-200"
>
Log in
</Link>
);
};
const Uploader = () => {
const [mode, setMode] = React.useState("file");
@ -190,8 +199,8 @@ const Uploader = () => {
{disabledComponent && (
<div className="absolute inset-0 bg-palette-500 bg-opacity-90 rounded-lg">
<div class="flex h-full">
<div class="m-auto">
<div className="flex h-full">
<div className="m-auto">
<h4 className="font-light text-palette-100 text-lg mt-2 text-center">
<LogInLink /> or <RegistrationLink /> for free
</h4>

10
packages/website/src/components/Uploader/UploaderElement.js
View File

@ -5,9 +5,9 @@ import bytes from "bytes";
import { getReasonPhrase, StatusCodes } from "http-status-codes";
import copy from "copy-text-to-clipboard";
import path from "path-browserify";
import { SkynetClient } from "skynet-js";
import { useTimeoutFn } from "react-use";
import ms from "ms";
import skynetClient from "../../services/skynetClient";
import Link from "../Link";
const getFilePath = (file) => file.webkitRelativePath || file.path || file.name;
@ -55,8 +55,6 @@ const createUploadErrorMessage = (error) => {
return `Critical error, please refresh the application and try again. ${error.message}`;
};
const client = new SkynetClient(process.env.GATSBY_API_URL);
export default function UploaderElement({ onUploadStateChange, upload }) {
const [copied, setCopied] = React.useState(false);
const [, , reset] = useTimeoutFn(() => setCopied(false), ms("3 seconds"));
@ -87,12 +85,12 @@ export default function UploaderElement({ onUploadStateChange, upload }) {
const directory = files.reduce((acc, file) => ({ ...acc, [getRelativeFilePath(file)]: file }), {});
const name = encodeURIComponent(upload.file.name);
response = await client.uploadDirectory(directory, name, { onUploadProgress });
response = await skynetClient.uploadDirectory(directory, name, { onUploadProgress });
} else {
response = await client.uploadFile(upload.file, { onUploadProgress });
response = await skynetClient.uploadFile(upload.file, { onUploadProgress });
}
const url = await client.getSkylinkUrl(response.skylink, { subdomain: upload.mode === "directory" });
const url = await skynetClient.getSkylinkUrl(response.skylink, { subdomain: upload.mode === "directory" });
onUploadStateChange(upload.id, { status: "complete", url });
} catch (error) {

3
packages/website/src/services/skynetClient.js Normal file
View File

@ -0,0 +1,3 @@
import { SkynetClient } from "skynet-js";
export default new SkynetClient(process.env.GATSBY_API_URL);

18
packages/website/src/services/useAccountsUrl.js Normal file
View File

@ -0,0 +1,18 @@
import * as React from "react";
import skynetClient from "./skynetClient";
export default function useAccountsUrl() {
const [url, setUrl] = React.useState("");
React.useEffect(() => {
(async function resolve() {
const portalUrl = new URL(await skynetClient.portalUrl());
portalUrl.host = `account.${portalUrl.host}`;
setUrl(portalUrl.toString());
})();
}, [setUrl]);
return url;
}