refactor: rename, reorder, etc.

This commit is contained in:
rusconn
2023-07-10 11:56:45 +09:00
parent e2a558f9e9
commit ce35eb910e
18 changed files with 211 additions and 280 deletions

View File

@@ -5,10 +5,7 @@ import { decode, encode, isValid } from "js-base64";
import { toolGroups } from "@/config/tools";
import { Textarea, TextareaProps } from "@/components/ui/textarea";
import { ClearButton } from "@/components/buttons/clear";
import { CopyButton } from "@/components/buttons/copy";
import { FileButton } from "@/components/buttons/file";
import { PasteButton } from "@/components/buttons/paste";
import * as Button from "@/components/buttons";
import { ControlMenu } from "@/components/control-menu";
import { PageRootSection } from "@/components/page-root-section";
import { PageSection } from "@/components/page-section";
@@ -19,19 +16,19 @@ export default function Page() {
encoded: "8J+YgPCfmILwn6Sj",
});
const setDecodedReactively = useCallback((text: string) => {
const setFormByDecoded = useCallback((text: string) => {
setForm({
decoded: text,
encoded: encode(text),
});
}, []);
const setEncodedReactively = useCallback((text: string) => {
const setFormByEncoded = useCallback((text: string) => {
const newDecoded = decode(text);
setForm({
encoded: text,
decoded: isValid(text) && !newDecoded.includes("<22>") ? newDecoded : "",
encoded: text,
});
}, []);
@@ -42,33 +39,29 @@ export default function Page() {
});
}, []);
const onDecodedChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) =>
setDecodedReactively(value);
const onDecodedChange: TextareaProps["onChange"] = e => setFormByDecoded(e.currentTarget.value);
const onEncodedChange: TextareaProps["onChange"] = e => setFormByEncoded(e.currentTarget.value);
const onEncodedChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) =>
setEncodedReactively(value);
const decodedPasteButton = <PasteButton onClipboardRead={setDecodedReactively} />;
const encodedPasteButton = <PasteButton onClipboardRead={setEncodedReactively} />;
const decodedPasteButton = <Button.Paste onClipboardRead={setFormByDecoded} />;
const encodedPasteButton = <Button.Paste onClipboardRead={setFormByEncoded} />;
const decodedFileButton = (
<FileButton onFileRead={setDecodedReactively} iconOnly aria-label="load a decoded file" />
<Button.File onFileRead={setFormByDecoded} iconOnly aria-label="load a decoded file" />
);
const encodedFileButton = (
<FileButton onFileRead={setEncodedReactively} iconOnly aria-label="load a encoded file" />
<Button.File onFileRead={setFormByEncoded} iconOnly aria-label="load a encoded file" />
);
const decodedCopyButton = <CopyButton text={form.decoded} />;
const encodedCopyButton = <CopyButton text={form.encoded} />;
const decodedCopyButton = <Button.Copy text={form.decoded} />;
const encodedCopyButton = <Button.Copy text={form.encoded} />;
const clearButton = (
<ClearButton onClick={clearBoth} iconOnly aria-label="clear decoded and encoded" />
<Button.Clear onClick={clearBoth} iconOnly aria-label="clear decoded and encoded" />
);
const decodedControl = (
<ControlMenu list={[decodedPasteButton, decodedFileButton, decodedCopyButton, clearButton]} />
);
const encodedControl = (
<ControlMenu list={[encodedPasteButton, encodedFileButton, encodedCopyButton, clearButton]} />
);

View File

@@ -5,10 +5,7 @@ import { escape, unescape } from "html-escaper";
import { toolGroups } from "@/config/tools";
import { Textarea, TextareaProps } from "@/components/ui/textarea";
import { ClearButton } from "@/components/buttons/clear";
import { CopyButton } from "@/components/buttons/copy";
import { FileButton } from "@/components/buttons/file";
import { PasteButton } from "@/components/buttons/paste";
import * as Button from "@/components/buttons";
import { ControlMenu } from "@/components/control-menu";
import { PageRootSection } from "@/components/page-root-section";
import { PageSection } from "@/components/page-section";
@@ -19,17 +16,17 @@ export default function Page() {
encoded: "&gt; It&#39;s &quot;HTML escaping&quot;.",
});
const setDecodedReactively = useCallback((text: string) => {
const setFormByDecoded = useCallback((text: string) => {
setForm({
decoded: text,
encoded: escape(text),
});
}, []);
const setEncodedReactively = useCallback((text: string) => {
const setFormByEncoded = useCallback((text: string) => {
setForm({
encoded: text,
decoded: unescape(text),
encoded: text,
});
}, []);
@@ -40,33 +37,29 @@ export default function Page() {
});
}, []);
const onDecodedChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) =>
setDecodedReactively(value);
const onDecodedChange: TextareaProps["onChange"] = e => setFormByDecoded(e.currentTarget.value);
const onEncodedChange: TextareaProps["onChange"] = e => setFormByEncoded(e.currentTarget.value);
const onEncodedChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) =>
setEncodedReactively(value);
const decodedPasteButton = <PasteButton onClipboardRead={setDecodedReactively} />;
const encodedPasteButton = <PasteButton onClipboardRead={setEncodedReactively} />;
const decodedPasteButton = <Button.Paste onClipboardRead={setFormByDecoded} />;
const encodedPasteButton = <Button.Paste onClipboardRead={setFormByEncoded} />;
const decodedFileButton = (
<FileButton onFileRead={setDecodedReactively} iconOnly aria-label="load a decoded file" />
<Button.File onFileRead={setFormByDecoded} iconOnly aria-label="load a decoded file" />
);
const encodedFileButton = (
<FileButton onFileRead={setEncodedReactively} iconOnly aria-label="load a encoded file" />
<Button.File onFileRead={setFormByEncoded} iconOnly aria-label="load a encoded file" />
);
const decodedCopyButton = <CopyButton text={form.decoded} />;
const encodedCopyButton = <CopyButton text={form.encoded} />;
const decodedCopyButton = <Button.Copy text={form.decoded} />;
const encodedCopyButton = <Button.Copy text={form.encoded} />;
const clearButton = (
<ClearButton onClick={clearBoth} iconOnly aria-label="clear decoded and encoded" />
<Button.Clear onClick={clearBoth} iconOnly aria-label="clear decoded and encoded" />
);
const decodedControl = (
<ControlMenu list={[decodedPasteButton, decodedFileButton, decodedCopyButton, clearButton]} />
);
const encodedControl = (
<ControlMenu list={[encodedPasteButton, encodedFileButton, encodedCopyButton, clearButton]} />
);

View File

@@ -6,10 +6,7 @@ import { toolGroups } from "@/config/tools";
import { decode } from "@/lib/jwt";
import { Editor } from "@/components/ui/editor";
import { Textarea, TextareaProps } from "@/components/ui/textarea";
import { ClearButton } from "@/components/buttons/clear";
import { CopyButton } from "@/components/buttons/copy";
import { FileButton } from "@/components/buttons/file";
import { PasteButton } from "@/components/buttons/paste";
import * as Button from "@/components/buttons";
import { ControlMenu } from "@/components/control-menu";
import { PageRootSection } from "@/components/page-root-section";
import { PageSection } from "@/components/page-section";
@@ -20,23 +17,23 @@ export default function Page() {
);
const { header: h, payload: p } = decode(jwt);
const header = h.isErr() ? "" : JSON.stringify(h.value, null, 2);
const payload = p.isErr() ? "" : JSON.stringify(p.value, null, 2);
const header = h.map(x => JSON.stringify(x, null, 2)).unwrapOr("");
const payload = p.map(x => JSON.stringify(x, null, 2)).unwrapOr("");
const clearJwt = useCallback(() => setJwt(""), []);
const onJwtChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) => setJwt(value);
const onJwtChange: TextareaProps["onChange"] = e => setJwt(e.currentTarget.value);
const jwtTokenPasteButton = <PasteButton onClipboardRead={setJwt} />;
const jwtTokenPasteButton = <Button.Paste onClipboardRead={setJwt} />;
const jwtTokenFileButton = (
<FileButton onFileRead={setJwt} iconOnly aria-label="load a token file" />
<Button.File onFileRead={setJwt} iconOnly aria-label="load a token file" />
);
const jwtTokenClearButton = <ClearButton onClick={clearJwt} iconOnly aria-label="clear token" />;
const jwtTokenClearButton = <Button.Clear onClick={clearJwt} iconOnly aria-label="clear token" />;
const heaederCopyButton = <CopyButton text={header} />;
const payloadCopyButton = <CopyButton text={payload} />;
const heaederCopyButton = <Button.Copy text={header} />;
const payloadCopyButton = <Button.Copy text={payload} />;
const jwtTokenControl = (
<ControlMenu list={[jwtTokenPasteButton, jwtTokenFileButton, jwtTokenClearButton]} />

View File

@@ -5,10 +5,7 @@ import { useCallback, useState } from "react";
import { toolGroups } from "@/config/tools";
import { safeDecodeURIComponent, safeEncodeURIComponent } from "@/lib/uri";
import { Textarea, TextareaProps } from "@/components/ui/textarea";
import { ClearButton } from "@/components/buttons/clear";
import { CopyButton } from "@/components/buttons/copy";
import { FileButton } from "@/components/buttons/file";
import { PasteButton } from "@/components/buttons/paste";
import * as Button from "@/components/buttons";
import { ControlMenu } from "@/components/control-menu";
import { PageRootSection } from "@/components/page-root-section";
import { PageSection } from "@/components/page-section";
@@ -19,17 +16,17 @@ export default function Page() {
encoded: "%3E%20It's%20%22URL%20encoding%22%3F",
});
const setDecodedReactively = useCallback((text: string) => {
const setFormByDecoded = useCallback((text: string) => {
setForm({
decoded: text,
encoded: safeEncodeURIComponent(text).unwrapOr(""),
});
}, []);
const setEncodedReactively = useCallback((text: string) => {
const setFormByEncoded = useCallback((text: string) => {
setForm({
encoded: text,
decoded: safeDecodeURIComponent(text).unwrapOr(""),
encoded: text,
});
}, []);
@@ -40,33 +37,29 @@ export default function Page() {
});
}, []);
const onDecodedChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) =>
setDecodedReactively(value);
const onDecodedChange: TextareaProps["onChange"] = e => setFormByDecoded(e.currentTarget.value);
const onEncodedChange: TextareaProps["onChange"] = e => setFormByEncoded(e.currentTarget.value);
const onEncodedChange: TextareaProps["onChange"] = ({ currentTarget: { value } }) =>
setEncodedReactively(value);
const decodedPasteButton = <PasteButton onClipboardRead={setDecodedReactively} />;
const encodedPasteButton = <PasteButton onClipboardRead={setEncodedReactively} />;
const decodedPasteButton = <Button.Paste onClipboardRead={setFormByDecoded} />;
const encodedPasteButton = <Button.Paste onClipboardRead={setFormByEncoded} />;
const decodedFileButton = (
<FileButton onFileRead={setDecodedReactively} iconOnly aria-label="load a decoded file" />
<Button.File onFileRead={setFormByDecoded} iconOnly aria-label="load a decoded file" />
);
const encodedFileButton = (
<FileButton onFileRead={setEncodedReactively} iconOnly aria-label="load a encoded file" />
<Button.File onFileRead={setFormByEncoded} iconOnly aria-label="load a encoded file" />
);
const decodedCopyButton = <CopyButton text={form.decoded} />;
const encodedCopyButton = <CopyButton text={form.encoded} />;
const decodedCopyButton = <Button.Copy text={form.decoded} />;
const encodedCopyButton = <Button.Copy text={form.encoded} />;
const clearButton = (
<ClearButton onClick={clearBoth} iconOnly aria-label="clear decoded and encoded" />
<Button.Clear onClick={clearBoth} iconOnly aria-label="clear decoded and encoded" />
);
const decodedControl = (
<ControlMenu list={[decodedPasteButton, decodedFileButton, decodedCopyButton, clearButton]} />
);
const encodedControl = (
<ControlMenu list={[encodedPasteButton, encodedFileButton, encodedCopyButton, clearButton]} />
);