- {data &&
}
+ {data && (
+
+ )}
{!data && data !== null && (
Successful request but no data was returned
)}
diff --git a/yarn.lock b/yarn.lock
index ad2b050..931e6cc 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -438,7 +438,7 @@
resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.8.1.tgz#c1ddb040429c6d21d38cc945fe75c818cfb68e17"
integrity sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==
-"@emotion/react@^11.10.5", "@emotion/react@^11.10.6":
+"@emotion/react@^11.10.5":
version "11.10.6"
resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.10.6.tgz#dbe5e650ab0f3b1d2e592e6ab1e006e75fd9ac11"
integrity sha512-6HT8jBmcSkfzO7mc+N1L9uwvOnlcGoix8Zn7srt+9ga0MjREo6lRpuVX0kzo6Jp6oTqDhREOFsygN6Ew4fEQbw==
@@ -473,7 +473,7 @@
resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.2.2.tgz#d58e788ee27267a14342303e1abb3d508b6d0fec"
integrity sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==
-"@emotion/styled@^11.10.5", "@emotion/styled@^11.10.6":
+"@emotion/styled@^11.10.5":
version "11.10.6"
resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.10.6.tgz#d886afdc51ef4d66c787ebde848f3cc8b117ebba"
integrity sha512-OXtBzOmDSJo5Q0AFemHCfl+bUueT8BIcPSxu0EGTpGk6DmI5dnhSzQANm1e1ze0YZL7TDyAyy6s/b/zmGOS3Og==
@@ -837,21 +837,21 @@
"@jridgewell/resolve-uri" "3.1.0"
"@jridgewell/sourcemap-codec" "1.4.14"
-"@mui/base@5.0.0-alpha.124":
- version "5.0.0-alpha.124"
- resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-alpha.124.tgz#164068642e41ba655fd2b9eaf881526909a41201"
- integrity sha512-I6M+FrjRCybQCr8I8JTu6L2MkUobSQFgNIpOJyDNKL5zq/73LvZIQXvsKumAzthVGvI1PYaarM9vGDrDYbumKA==
+"@mui/base@5.0.0-alpha.126":
+ version "5.0.0-alpha.126"
+ resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-alpha.126.tgz#99555a5876a60e7dad772d75eb171e3d1336321d"
+ integrity sha512-I5e52A0Muv9Gaoy2GcqbYrQ6dpRyC2UXeA00brT3HuW0nF0E4fiTOIqdNTN+N5gyaYK0z3O6jtLt/97CCrIxVA==
dependencies:
"@babel/runtime" "^7.21.0"
"@emotion/is-prop-valid" "^1.2.0"
- "@mui/types" "^7.2.3"
- "@mui/utils" "^5.11.13"
+ "@mui/types" "^7.2.4"
+ "@mui/utils" "^5.12.0"
"@popperjs/core" "^2.11.7"
clsx "^1.2.1"
prop-types "^15.8.1"
react-is "^18.2.0"
-"@mui/core-downloads-tracker@^5.11.16":
+"@mui/core-downloads-tracker@^5.12.1":
version "5.14.19"
resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.14.19.tgz#9c04ad047c378d857d529ef9c535b60a10b9a47c"
integrity sha512-y4JseIen5pmZs1n9hHy95HKKioKco8f6N2lford2AmjJigVJOv0KsU0qryiCpyuEUZmi/xCduVilHsK9DSkPcA==
@@ -863,7 +863,7 @@
dependencies:
"@babel/runtime" "^7.21.0"
-"@mui/material@^5.10.16", "@mui/material@^5.11.14":
+"@mui/material@^5.10.16":
version "5.12.1"
resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.12.1.tgz#3297ffc6836f426a26568332d68357c1398f0630"
integrity sha512-m+G9J6+FzIMhRqKV2y30yONH97wX107z9EWgiNCeS1/+y1CnytFZNG1ENdOuaJo1NimCRnmB/iXPvoOaSo6dOg==
@@ -900,7 +900,7 @@
csstype "^3.1.2"
prop-types "^15.8.1"
-"@mui/system@^5.11.16":
+"@mui/system@^5.12.1":
version "5.14.19"
resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.14.19.tgz#f13387c60af129e4d61dfbf168fcee348ebe952a"
integrity sha512-4e3Q+2nx+vgEsd0h5ftxlZGB7XtkkPos/zWqCqnxUs1l/T70s0lF2YNrWHHdSQ7LgtBu0eQ0qweZG2pR7KwkAw==
@@ -914,12 +914,12 @@
csstype "^3.1.2"
prop-types "^15.8.1"
-"@mui/types@^7.2.10", "@mui/types@^7.2.3":
+"@mui/types@^7.2.10", "@mui/types@^7.2.4":
version "7.2.10"
resolved "https://registry.yarnpkg.com/@mui/types/-/types-7.2.10.tgz#13e3e9aa07ee6d593cfacd538e02e8e896d7a12f"
integrity sha512-wX1vbDC+lzF7FlhT6A3ffRZgEoKWPF8VqRoTu4lZwouFX2t90KyCMsgepMw5DxLak1BSp/KP86CmtZttikb/gQ==
-"@mui/utils@^5.11.13", "@mui/utils@^5.14.19":
+"@mui/utils@^5.12.0", "@mui/utils@^5.14.19":
version "5.14.19"
resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.14.19.tgz#39a5846a74ba199f1a2b067ea197dc6b9c8f442f"
integrity sha512-qAHvTXzk7basbyqPvhgWqN6JbmI2wLB/mf97GkSlz5c76MiKYV6Ffjvw9BjKZQ1YRb8rDX9kgdjRezOcoB91oQ==
@@ -1213,17 +1213,14 @@
resolved "https://registry.yarnpkg.com/@testing-library/user-event/-/user-event-14.4.3.tgz#af975e367743fa91989cd666666aec31a8f50591"
integrity sha512-kCUc5MEwaEMakkO5x7aoD+DLi02ehmEM2QCGWvNqAS1dV/fAvORWEjnjsEIvml59M7Y5kCkWN6fCCyPOe8OL6Q==
-"@textea/json-viewer@^2.13.1":
- version "2.16.2"
- resolved "https://registry.yarnpkg.com/@textea/json-viewer/-/json-viewer-2.16.2.tgz#eebb82d63c78959d849b3cb03246c3eca4bfc3c3"
- integrity sha512-ZPRNpcLJ+hOO6C8tzkQvltRSp7Ol73j8oJ1+w5mWVWn+JR1QqzZJJgBqnNZvs3S1h/jJAjwyeZUVlb0VtIJcvg==
+"@textea/json-viewer@^3.0.0":
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/@textea/json-viewer/-/json-viewer-3.0.0.tgz#0ba440c1e396f54f1cc4ded1e662e5d65f5975b5"
+ integrity sha512-rO/JdEcr4dfki0B+nZNAcEMCVCAjLfi0tGgZhm1/33Md5dlVbQAtxaR4rFU5W+tHom9tBBnsTT7d7T1JHkmjAg==
dependencies:
- "@emotion/react" "^11.10.6"
- "@emotion/styled" "^11.10.6"
- "@mui/material" "^5.11.14"
clsx "^1.2.1"
copy-to-clipboard "^3.3.3"
- zustand "^4.3.6"
+ zustand "^4.3.7"
"@trpc/client@^10.0.0":
version "10.21.1"
@@ -6791,6 +6788,11 @@ parse-json@^5.0.0, parse-json@^5.2.0:
json-parse-even-better-errors "^2.3.0"
lines-and-columns "^1.1.6"
+parse-ms@^3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/parse-ms/-/parse-ms-3.0.0.tgz#3ea24a934913345fcc3656deda72df921da3a70e"
+ integrity sha512-Tpb8Z7r7XbbtBTrM9UhpkzzaMrqA2VXMT3YChzYltwV3P3pM6t8wl7TvpMnSTosz1aQAdVib7kdoys7vYOPerw==
+
parse-node-version@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/parse-node-version/-/parse-node-version-1.0.1.tgz#e2b5dbede00e7fa9bc363607f53327e8b073189b"
@@ -7252,6 +7254,11 @@ prettier@^2.6.2:
resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.8.tgz#e8c5d7e98a4305ffe3de2e1fc4aca1a71c28b1da"
integrity sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==
+pretty-bytes@^6.1.0:
+ version "6.1.0"
+ resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-6.1.0.tgz#1d1cc9aae1939012c74180b679da6684616bf804"
+ integrity sha512-Rk753HI8f4uivXi4ZCIYdhmG1V+WKzvRMg/X+M42a6t7D07RcmopXJMDNk6N++7Bl75URRGsb40ruvg7Hcp2wQ==
+
pretty-format@^27.0.2:
version "27.5.1"
resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-27.5.1.tgz#2181879fdea51a7a5851fb39d920faa63f01d88e"
@@ -7275,6 +7282,13 @@ pretty-hrtime@^1.0.0:
resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
integrity sha512-66hKPCr+72mlfiSjlEB1+45IjXSqvVAIy6mocupoww4tBFE9R9IhwwUGoI4G++Tc9Aq+2rxOt0RFU6gPcrte0A==
+pretty-ms@^8.0.0:
+ version "8.0.0"
+ resolved "https://registry.yarnpkg.com/pretty-ms/-/pretty-ms-8.0.0.tgz#a35563b2a02df01e595538f86d7de54ca23194a3"
+ integrity sha512-ASJqOugUF1bbzI35STMBUpZqdfYKlJugy6JBziGi2EE+AL5JPJGSzvpeVXojxrr0ViUYoToUjb5kjSEGf7Y83Q==
+ dependencies:
+ parse-ms "^3.0.0"
+
process-nextick-args@^2.0.0, process-nextick-args@~2.0.0:
version "2.0.1"
resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
@@ -8190,6 +8204,11 @@ streamsearch@^1.1.0:
resolved "https://registry.yarnpkg.com/streamsearch/-/streamsearch-1.1.0.tgz#404dd1e2247ca94af554e841a8ef0eaa238da764"
integrity sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==
+string-byte-length@^1.6.0:
+ version "1.6.0"
+ resolved "https://registry.yarnpkg.com/string-byte-length/-/string-byte-length-1.6.0.tgz#86cf5d85b7636e6289f119f0c9313895d6c1fd66"
+ integrity sha512-h9KzyolUa+9q6yHPCGzvPOta0VpWqG0/x0o1on22PZL0t+8txWXl0JCkRG/Gvi58HnyDvT1YCzDH2bAOpEc++g==
+
string-hash@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/string-hash/-/string-hash-1.1.3.tgz#e8aafc0ac1855b4666929ed7dd1275df5d6c811b"
@@ -9303,7 +9322,7 @@ zod@^3.19.1, zod@^3.21.4:
resolved "https://registry.yarnpkg.com/zod/-/zod-3.21.4.tgz#10882231d992519f0a10b5dd58a38c9dabbb64db"
integrity sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw==
-zustand@^4.1.5, zustand@^4.3.6:
+zustand@^4.1.5, zustand@^4.3.7:
version "4.3.7"
resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.3.7.tgz#501b1f0393a7f1d103332e45ab574be5747fedce"
integrity sha512-dY8ERwB9Nd21ellgkBZFhudER8KVlelZm8388B5nDAXhO/+FZDhYMuRnqDgu5SYyRgz/iaf8RKnbUs/cHfOGlQ==
From f08e62474c1a0cc5cfd61331a0fba458db357216 Mon Sep 17 00:00:00 2001
From: Joe Karow <58997957+JoeKarow@users.noreply.github.com>
Date: Mon, 18 Dec 2023 17:00:01 -0500
Subject: [PATCH 07/12] reorder exports per @clburlison suggestion
Co-authored-by: Clayton Burlison
---
packages/trpc-panel/package.json | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/packages/trpc-panel/package.json b/packages/trpc-panel/package.json
index 9b61657..d5795cf 100644
--- a/packages/trpc-panel/package.json
+++ b/packages/trpc-panel/package.json
@@ -72,10 +72,10 @@
},
"exports": {
".": {
- "default": "./lib/index.js",
+ "types": "./lib/src/index.d.ts",
"import": "./lib/index.mjs",
"require": "./lib/index.js",
- "types": "./lib/src/index.d.ts"
+ "default": "./lib/index.js"
}
},
"files": [
From a67c49ed148a65118ae4be84503fb075354bdd23 Mon Sep 17 00:00:00 2001
From: aidansunbury
Date: Thu, 7 Nov 2024 17:08:00 -0800
Subject: [PATCH 08/12] revert accidental code format and add yarn to gitignore
---
.gitignore | 5 +-
packages/dev-app/src/pages/index.tsx | 28 +-
.../components/form/ProcedureForm/index.tsx | 438 +++++++++---------
3 files changed, 237 insertions(+), 234 deletions(-)
diff --git a/.gitignore b/.gitignore
index 7015e57..f170435 100644
--- a/.gitignore
+++ b/.gitignore
@@ -45,4 +45,7 @@ testem.log
.DS_Store
Thumbs.db
-stats.html
\ No newline at end of file
+stats.html
+
+# yarn
+.yarn
\ No newline at end of file
diff --git a/packages/dev-app/src/pages/index.tsx b/packages/dev-app/src/pages/index.tsx
index b95018a..1faccd8 100644
--- a/packages/dev-app/src/pages/index.tsx
+++ b/packages/dev-app/src/pages/index.tsx
@@ -9,23 +9,23 @@ import { trpc } from "trpc-panel/react-app/trpc";
const parse = parseRouterWithOptions(appRouter, { transformer: "superjson" });
const App = dynamic(
- Promise.resolve(function () {
- return (
-
- );
- }),
- { ssr: false }
+ Promise.resolve(function () {
+ return (
+
+ );
+ }),
+ { ssr: false },
);
const Component = () => {
- return ;
+ return ;
};
// eslint-disable-next-line @typescript-eslint/require-await
diff --git a/packages/trpc-panel/src/react-app/components/form/ProcedureForm/index.tsx b/packages/trpc-panel/src/react-app/components/form/ProcedureForm/index.tsx
index d8f78d5..352fb38 100644
--- a/packages/trpc-panel/src/react-app/components/form/ProcedureForm/index.tsx
+++ b/packages/trpc-panel/src/react-app/components/form/ProcedureForm/index.tsx
@@ -22,257 +22,257 @@ import { ProcedureFormContextProvider } from "@src/react-app/components/form/Pro
import getSize from "string-byte-length";
const TRPCErrorSchema = z.object({
- meta: z.object({
- responseJSON: z
- .array(
- z.object({
- error: z.object({
- json: z.object({
- code: z.number(),
- data: z.object({
- code: z.string(),
- httpStatus: z.number(),
- stack: z.string().optional(),
- }),
- message: z.string().optional(),
- }),
- }),
- }),
- )
- .min(1),
- }),
+ meta: z.object({
+ responseJSON: z
+ .array(
+ z.object({
+ error: z.object({
+ json: z.object({
+ code: z.number(),
+ data: z.object({
+ code: z.string(),
+ httpStatus: z.number(),
+ stack: z.string().optional(),
+ }),
+ message: z.string().optional(),
+ }),
+ }),
+ })
+ )
+ .min(1),
+ }),
});
export type TRPCErrorType = z.infer;
function isTrpcError(error: unknown): error is TRPCErrorType {
- const parse = TRPCErrorSchema.safeParse(error);
- return parse.success;
+ const parse = TRPCErrorSchema.safeParse(error);
+ return parse.success;
}
export const ROOT_VALS_PROPERTY_NAME = "vals";
export function ProcedureForm({
- procedure,
- name,
+ procedure,
+ name,
}: {
- procedure: ParsedProcedure;
- name: string;
+ procedure: ParsedProcedure;
+ name: string;
}) {
- // null => request was never sent
- // undefined => request successful but nothing returned from procedure
- const [mutationResponse, setMutationResponse] = useState(null);
- const [queryEnabled, setQueryEnabled] = useState(false);
- const [queryInput, setQueryInput] = useState(null);
- const formRef = useRef(null);
- const context = trpc.useContext();
- const [dataSize, setDataSize] = useState();
- const [startTime, setStartTime] = useState();
- const [opDuration, setOpDuration] = useState();
+ // null => request was never sent
+ // undefined => request successful but nothing returned from procedure
+ const [mutationResponse, setMutationResponse] = useState(null);
+ const [queryEnabled, setQueryEnabled] = useState(false);
+ const [queryInput, setQueryInput] = useState(null);
+ const formRef = useRef(null);
+ const context = trpc.useContext();
+ const [dataSize, setDataSize] = useState();
+ const [startTime, setStartTime] = useState();
+ const [opDuration, setOpDuration] = useState();
- function getProcedure() {
- var cur: typeof trpc | (typeof trpc)[string] = trpc;
- for (var p of procedure.pathFromRootRouter) {
- // TODO - Maybe figure out these typings?
- //@ts-ignore
- cur = cur[p];
- }
- return cur;
- }
+ function getProcedure() {
+ var cur: typeof trpc | (typeof trpc)[string] = trpc;
+ for (var p of procedure.pathFromRootRouter) {
+ // TODO - Maybe figure out these typings?
+ //@ts-ignore
+ cur = cur[p];
+ }
+ return cur;
+ }
- const query = (() => {
- const router = getProcedure();
- //@ts-ignore
- return router.useQuery(queryInput, {
- enabled: queryEnabled,
- initialData: null,
- retry: false,
- refetchOnWindowFocus: false,
- onSuccess: (data: unknown) => {
- if (startTime) setOpDuration(Date.now() - startTime);
- setDataSize(getSize(JSON.stringify(data)));
- setStartTime(undefined);
- },
- });
- })() as UseQueryResult;
+ const query = (() => {
+ const router = getProcedure();
+ //@ts-ignore
+ return router.useQuery(queryInput, {
+ enabled: queryEnabled,
+ initialData: null,
+ retry: false,
+ refetchOnWindowFocus: false,
+ onSuccess: (data: unknown) => {
+ if (startTime) setOpDuration(Date.now() - startTime);
+ setDataSize(getSize(JSON.stringify(data)));
+ setStartTime(undefined);
+ },
+ });
+ })() as UseQueryResult;
- function invalidateQuery(input: any) {
- var cur: any = context;
- for (var p of procedure.pathFromRootRouter) {
- cur = cur[p];
- }
- cur.invalidate(input);
- }
+ function invalidateQuery(input: any) {
+ var cur: any = context;
+ for (var p of procedure.pathFromRootRouter) {
+ cur = cur[p];
+ }
+ cur.invalidate(input);
+ }
- const mutation = (() => {
- const router = getProcedure();
- //@ts-ignore
- return router.useMutation({
- retry: false,
- onSuccess: (data: unknown) => {
- if (startTime) setOpDuration(Date.now() - startTime);
- setDataSize(getSize(JSON.stringify(data)));
- setStartTime(undefined);
- },
- });
- })() as UseMutationResult;
+ const mutation = (() => {
+ const router = getProcedure();
+ //@ts-ignore
+ return router.useMutation({
+ retry: false,
+ onSuccess: (data: unknown) => {
+ if (startTime) setOpDuration(Date.now() - startTime);
+ setDataSize(getSize(JSON.stringify(data)));
+ setStartTime(undefined);
+ },
+ });
+ })() as UseMutationResult;
- const {
- control,
- reset: resetForm,
- handleSubmit,
- } = useForm({
- resolver: ajvResolver(wrapJsonSchema(procedure.inputSchema as any), {
- formats: fullFormats,
- }),
- defaultValues: {
- [ROOT_VALS_PROPERTY_NAME]: defaultFormValuesForNode(procedure.node),
- },
- });
- function onSubmit(data: { [ROOT_VALS_PROPERTY_NAME]: any }) {
- setStartTime(Date.now());
- const newData = { json: data[ROOT_VALS_PROPERTY_NAME] };
- if (procedure.procedureType === "query") {
- setQueryInput(newData);
- setQueryEnabled(true);
- invalidateQuery(newData);
- } else {
- mutation.mutateAsync(newData).then(setMutationResponse).catch();
- }
- }
+ const {
+ control,
+ reset: resetForm,
+ handleSubmit,
+ } = useForm({
+ resolver: ajvResolver(wrapJsonSchema(procedure.inputSchema as any), {
+ formats: fullFormats,
+ }),
+ defaultValues: {
+ [ROOT_VALS_PROPERTY_NAME]: defaultFormValuesForNode(procedure.node),
+ },
+ });
+ function onSubmit(data: { [ROOT_VALS_PROPERTY_NAME]: any }) {
+ setStartTime(Date.now());
+ const newData = { json: data[ROOT_VALS_PROPERTY_NAME] };
+ if (procedure.procedureType === "query") {
+ setQueryInput(newData);
+ setQueryEnabled(true);
+ invalidateQuery(newData);
+ } else {
+ mutation.mutateAsync(newData).then(setMutationResponse).catch();
+ }
+ }
- // I've seen stuff online saying form reset should happen in useEffect hook only
- // not really sure though, gonna just leave it for now
- const [shouldReset, setShouldReset] = useState(false);
- useEffect(() => {
- if (shouldReset) {
- resetForm(
- { [ROOT_VALS_PROPERTY_NAME]: defaultFormValuesForNode(procedure.node) },
- {
- keepValues: false,
- keepDirtyValues: false,
- keepDefaultValues: false,
- },
- );
- setShouldReset(false);
- }
- }, [shouldReset]);
- function reset() {
- setShouldReset(true);
- setQueryEnabled(false);
- }
+ // I've seen stuff online saying form reset should happen in useEffect hook only
+ // not really sure though, gonna just leave it for now
+ const [shouldReset, setShouldReset] = useState(false);
+ useEffect(() => {
+ if (shouldReset) {
+ resetForm(
+ { [ROOT_VALS_PROPERTY_NAME]: defaultFormValuesForNode(procedure.node) },
+ {
+ keepValues: false,
+ keepDirtyValues: false,
+ keepDefaultValues: false,
+ }
+ );
+ setShouldReset(false);
+ }
+ }, [shouldReset]);
+ function reset() {
+ setShouldReset(true);
+ setQueryEnabled(false);
+ }
- const data =
- procedure.procedureType === "query"
- ? (query.data?.json ?? null)
- : mutationResponse;
- const error =
- procedure.procedureType == "query" ? query.error : mutation.error;
+ const data =
+ procedure.procedureType === "query"
+ ? query.data?.json ?? null
+ : mutationResponse;
+ const error =
+ procedure.procedureType == "query" ? query.error : mutation.error;
- const fieldName = procedure.node.path.join(".");
+ const fieldName = procedure.node.path.join(".");
- return (
-
-
- {name}
-
- }
- fullPath={procedure.pathFromRootRouter}
- sectionType={procedure.procedureType}
- focusOnScrollRef={formRef}
- >
-
+
+ {data && (
+
+ )}
+ {!data && data !== null && (
+ Successful request but no data was returned
+ )}
+ {error &&
+ (isTrpcError(error) ? (
+
+ ) : (
+ {error}
+ ))}
+
+
+
+ );
}
function XButton({
- control,
- reset,
+ control,
+ reset,
}: {
- control: Control;
- reset: () => void;
+ control: Control;
+ reset: () => void;
}) {
- const { isDirty } = useFormState({ control: control });
+ const { isDirty } = useFormState({ control: control });
- function onClickClear() {
- reset();
- }
+ function onClickClear() {
+ reset();
+ }
- return (
-
- {isDirty && (
-
- )}
-
- );
+ return (
+
+ {isDirty && (
+
+ )}
+
+ );
}
function wrapJsonSchema(jsonSchema: any) {
- delete jsonSchema["$schema"];
+ delete jsonSchema["$schema"];
- return {
- type: "object",
- properties: {
- [ROOT_VALS_PROPERTY_NAME]: jsonSchema,
- },
- required: [],
- additionalProperties: false,
- $schema: "http://json-schema.org/draft-07/schema#",
- };
+ return {
+ type: "object",
+ properties: {
+ [ROOT_VALS_PROPERTY_NAME]: jsonSchema,
+ },
+ required: [],
+ additionalProperties: false,
+ $schema: "http://json-schema.org/draft-07/schema#",
+ };
}
From 1526bb0f2dd1d2231e9d547cc017e2850fb3bdcd Mon Sep 17 00:00:00 2001
From: aidansunbury
Date: Thu, 7 Nov 2024 17:23:15 -0800
Subject: [PATCH 09/12] revert accidental tabs back to spaces
---
packages/dev-app/src/pages/index.tsx | 30 ++--
packages/trpc-panel/package.json | 196 +++++++++++++--------------
2 files changed, 112 insertions(+), 114 deletions(-)
diff --git a/packages/dev-app/src/pages/index.tsx b/packages/dev-app/src/pages/index.tsx
index 1faccd8..ce892fb 100644
--- a/packages/dev-app/src/pages/index.tsx
+++ b/packages/dev-app/src/pages/index.tsx
@@ -8,24 +8,22 @@ import { trpc } from "trpc-panel/react-app/trpc";
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
const parse = parseRouterWithOptions(appRouter, { transformer: "superjson" });
-const App = dynamic(
- Promise.resolve(function () {
- return (
-
- );
- }),
- { ssr: false },
-);
+Promise.resolve(function () {
+ return (
+
+ );
+ }),
+ { ssr: false }
const Component = () => {
- return ;
+ return ;
};
// eslint-disable-next-line @typescript-eslint/require-await
diff --git a/packages/trpc-panel/package.json b/packages/trpc-panel/package.json
index 65cfd66..9148e21 100644
--- a/packages/trpc-panel/package.json
+++ b/packages/trpc-panel/package.json
@@ -1,100 +1,100 @@
{
- "name": "@metamorph/trpc-panel",
- "version": "1.0.5",
- "description": "UI for testing tRPC backends",
- "main": "lib/index.js",
- "module": "lib/index.mjs",
- "typings": "lib/src/index.d.ts",
- "scripts": {
- "test": "jest",
- "test:watch": "jest --watchAll",
- "build": "npx rollup --bundleConfigAsCjs --config rollup.config.js",
- "dev": "rollup --config rollup.config.js --watch --bundleConfigAsCjs"
- },
- "author": "",
- "license": "ISC",
- "exports": {
- ".": {
- "types": "./lib/src/index.d.ts",
- "import": "./lib/index.mjs",
- "require": "./lib/index.js",
- "default": "./lib/index.js"
- }
- },
- "files": [
- "lib/"
- ],
- "directories": {
- "lib": "lib"
- },
- "peerDependencies": {
- "@trpc/server": "^10.0.0",
- "zod": "^3.19.1"
- },
- "devDependencies": {
- "@babel/core": "^7.20.2",
- "@babel/preset-react": "^7.18.6",
- "@emotion/react": "^11.10.5",
- "@emotion/styled": "^11.10.5",
- "@hookform/resolvers": "^2.9.10",
- "@mui/icons-material": "^5.10.16",
- "@mui/material": "^5.10.16",
- "@rollup/plugin-babel": "^6.0.3",
- "@rollup/plugin-commonjs": "^23.0.2",
- "@rollup/plugin-json": "^5.0.1",
- "@rollup/plugin-node-resolve": "^15.0.1",
- "@rollup/plugin-replace": "^5.0.1",
- "@rollup/plugin-terser": "^0.2.0",
- "@rollup/plugin-typescript": "^10.0.1",
- "@tanstack/react-query": "^5.12.2",
- "@testing-library/jest-dom": "^5.16.5",
- "@testing-library/react": "^13.4.0",
- "@testing-library/user-event": "^14.4.3",
- "@trpc/client": "^11.0.0-next-beta.264",
- "@trpc/react-query": "^11.0.0-next-beta.264",
- "@trpc/server": "^11.0.0-next-beta.264",
- "@types/jest": "^29.2.4",
- "@types/json-bigint": "^1.0.1",
- "@types/react": "^18.0.21",
- "@types/react-dom": "^18.0.6",
- "ajv": "^8.11.2",
- "ajv-formats": "^2.1.1",
- "autoprefixer": "^10.4.13",
- "devalue": "^4.2.0",
- "gulp": "^4.0.2",
- "gulp-inline-source": "^4.0.0",
- "gulp-replace": "^1.1.3",
- "jest": "^29.3.1",
- "json-bigint": "^1.0.0",
- "postcss": "^8.4.19",
- "react": "18.2.0",
- "react-dom": "18.2.0",
- "react-hook-form": "^7.39.5",
- "react-hot-toast": "^2.4.0",
- "react-hotkeys-hook": "^4.0.6",
- "rollup": "^3.7.4",
- "rollup-plugin-copy": "^3.4.0",
- "rollup-plugin-livereload": "^2.0.5",
- "rollup-plugin-postcss": "^4.0.2",
- "rollup-plugin-serve": "^2.0.1",
- "rollup-plugin-visualizer": "^5.8.3",
- "superjson": "^1.12.0",
- "tailwindcss": "^3.2.4",
- "ts-jest": "^29.0.3",
- "tslib": "^2.4.1",
- "typescript": "^5.4.5",
- "url": "^0.11.0",
- "zod": "^3.19.1",
- "zustand": "^4.1.5"
- },
- "dependencies": {
- "@textea/json-viewer": "^3.0.0",
- "fuzzysort": "^2.0.4",
- "path": "^0.12.7",
- "pretty-bytes": "^6.1.0",
- "pretty-ms": "^8.0.0",
- "string-byte-length": "^1.6.0",
- "url": "^0.11.0",
- "zod-to-json-schema": "^3.20.0"
- }
+ "name": "@metamorph/trpc-panel",
+ "version": "1.0.5",
+ "description": "UI for testing tRPC backends",
+ "main": "lib/index.js",
+ "module": "lib/index.mjs",
+ "typings": "lib/src/index.d.ts",
+ "scripts": {
+ "test": "jest",
+ "test:watch": "jest --watchAll",
+ "build": "npx rollup --bundleConfigAsCjs --config rollup.config.js",
+ "dev": "rollup --config rollup.config.js --watch --bundleConfigAsCjs"
+ },
+ "author": "",
+ "license": "ISC",
+ "exports": {
+ ".": {
+ "types": "./lib/src/index.d.ts",
+ "import": "./lib/index.mjs",
+ "require": "./lib/index.js",
+ "default": "./lib/index.js"
+ }
+ },
+ "files": [
+ "lib/"
+ ],
+ "directories": {
+ "lib": "lib"
+ },
+ "peerDependencies": {
+ "@trpc/server": "^10.0.0",
+ "zod": "^3.19.1"
+ },
+ "devDependencies": {
+ "@babel/core": "^7.20.2",
+ "@babel/preset-react": "^7.18.6",
+ "@emotion/react": "^11.10.5",
+ "@emotion/styled": "^11.10.5",
+ "@hookform/resolvers": "^2.9.10",
+ "@mui/icons-material": "^5.10.16",
+ "@mui/material": "^5.10.16",
+ "@rollup/plugin-babel": "^6.0.3",
+ "@rollup/plugin-commonjs": "^23.0.2",
+ "@rollup/plugin-json": "^5.0.1",
+ "@rollup/plugin-node-resolve": "^15.0.1",
+ "@rollup/plugin-replace": "^5.0.1",
+ "@rollup/plugin-terser": "^0.2.0",
+ "@rollup/plugin-typescript": "^10.0.1",
+ "@tanstack/react-query": "^5.12.2",
+ "@testing-library/jest-dom": "^5.16.5",
+ "@testing-library/react": "^13.4.0",
+ "@testing-library/user-event": "^14.4.3",
+ "@trpc/client": "^11.0.0-next-beta.264",
+ "@trpc/react-query": "^11.0.0-next-beta.264",
+ "@trpc/server": "^11.0.0-next-beta.264",
+ "@types/jest": "^29.2.4",
+ "@types/json-bigint": "^1.0.1",
+ "@types/react": "^18.0.21",
+ "@types/react-dom": "^18.0.6",
+ "ajv": "^8.11.2",
+ "ajv-formats": "^2.1.1",
+ "autoprefixer": "^10.4.13",
+ "devalue": "^4.2.0",
+ "gulp": "^4.0.2",
+ "gulp-inline-source": "^4.0.0",
+ "gulp-replace": "^1.1.3",
+ "jest": "^29.3.1",
+ "json-bigint": "^1.0.0",
+ "postcss": "^8.4.19",
+ "react": "18.2.0",
+ "react-dom": "18.2.0",
+ "react-hook-form": "^7.39.5",
+ "react-hot-toast": "^2.4.0",
+ "react-hotkeys-hook": "^4.0.6",
+ "rollup": "^3.7.4",
+ "rollup-plugin-copy": "^3.4.0",
+ "rollup-plugin-livereload": "^2.0.5",
+ "rollup-plugin-postcss": "^4.0.2",
+ "rollup-plugin-serve": "^2.0.1",
+ "rollup-plugin-visualizer": "^5.8.3",
+ "superjson": "^1.12.0",
+ "tailwindcss": "^3.2.4",
+ "ts-jest": "^29.0.3",
+ "tslib": "^2.4.1",
+ "typescript": "^5.4.5",
+ "url": "^0.11.0",
+ "zod": "^3.19.1",
+ "zustand": "^4.1.5"
+ },
+ "dependencies": {
+ "@textea/json-viewer": "^3.0.0",
+ "fuzzysort": "^2.0.4",
+ "path": "^0.12.7",
+ "pretty-bytes": "^6.1.0",
+ "pretty-ms": "^8.0.0",
+ "string-byte-length": "^1.6.0",
+ "url": "^0.11.0",
+ "zod-to-json-schema": "^3.20.0"
+ }
}
From c57e4edb215fb6adf7cb343f82b5bf2391373948 Mon Sep 17 00:00:00 2001
From: aidansunbury
Date: Thu, 7 Nov 2024 17:27:25 -0800
Subject: [PATCH 10/12] revert accidental dependency reversion
---
packages/dev-app/src/pages/index.tsx | 22 +++++++++++-----------
packages/trpc-panel/package.json | 2 +-
2 files changed, 12 insertions(+), 12 deletions(-)
diff --git a/packages/dev-app/src/pages/index.tsx b/packages/dev-app/src/pages/index.tsx
index ce892fb..3332543 100644
--- a/packages/dev-app/src/pages/index.tsx
+++ b/packages/dev-app/src/pages/index.tsx
@@ -7,21 +7,21 @@ import { trpc } from "trpc-panel/react-app/trpc";
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
const parse = parseRouterWithOptions(appRouter, { transformer: "superjson" });
-
-Promise.resolve(function () {
+const App = dynamic(
+ Promise.resolve(function () {
return (
-
+
);
}),
{ ssr: false }
-
+)
const Component = () => {
return ;
};
diff --git a/packages/trpc-panel/package.json b/packages/trpc-panel/package.json
index 9148e21..4127d14 100644
--- a/packages/trpc-panel/package.json
+++ b/packages/trpc-panel/package.json
@@ -28,7 +28,7 @@
"lib": "lib"
},
"peerDependencies": {
- "@trpc/server": "^10.0.0",
+ "@trpc/server": "^11.0.0-next-beta.264",
"zod": "^3.19.1"
},
"devDependencies": {
From a0a2faf04842e1433726283e29de7e36ebc51180 Mon Sep 17 00:00:00 2001
From: aidansunbury
Date: Thu, 7 Nov 2024 17:29:26 -0800
Subject: [PATCH 11/12] fix final formatting issue because I'm an idiot
---
packages/dev-app/src/pages/index.tsx | 16 ++++++++--------
1 file changed, 8 insertions(+), 8 deletions(-)
diff --git a/packages/dev-app/src/pages/index.tsx b/packages/dev-app/src/pages/index.tsx
index 3332543..7d57da6 100644
--- a/packages/dev-app/src/pages/index.tsx
+++ b/packages/dev-app/src/pages/index.tsx
@@ -10,14 +10,14 @@ const parse = parseRouterWithOptions(appRouter, { transformer: "superjson" });
const App = dynamic(
Promise.resolve(function () {
return (
-
+
);
}),
{ ssr: false }
From 99a962c7512462ba6f7c7550ebf132a82df22882 Mon Sep 17 00:00:00 2001
From: aidansunbury
Date: Thu, 7 Nov 2024 17:30:01 -0800
Subject: [PATCH 12/12] for real this time
---
packages/dev-app/src/pages/index.tsx | 4 +++-
1 file changed, 3 insertions(+), 1 deletion(-)
diff --git a/packages/dev-app/src/pages/index.tsx b/packages/dev-app/src/pages/index.tsx
index 7d57da6..b95018a 100644
--- a/packages/dev-app/src/pages/index.tsx
+++ b/packages/dev-app/src/pages/index.tsx
@@ -7,6 +7,7 @@ import { trpc } from "trpc-panel/react-app/trpc";
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
const parse = parseRouterWithOptions(appRouter, { transformer: "superjson" });
+
const App = dynamic(
Promise.resolve(function () {
return (
@@ -21,7 +22,8 @@ const App = dynamic(
);
}),
{ ssr: false }
-)
+);
+
const Component = () => {
return ;
};