Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix issues 380 and 365: Editor issues and infinite network requests in Edit Post #387

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Fix issues 380 and 365: Editor issues and infinite network requests in Edit Post #387

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2d7ec57
Fixed infinite network requests in Post View page
vivek7405 Feb 10, 2024
ecc6aee
Fixed editor issues
vivek7405 Feb 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 30 additions & 26 deletions components/editor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,34 +9,49 @@ import { cn } from "@/lib/utils";
import LoadingDots from "./icons/loading-dots";
import { ExternalLink } from "lucide-react";
import { toast } from "sonner";
import { useDebounce } from "use-debounce";

type PostWithSite = Post & { site: { subdomain: string | null } | null };

export default function Editor({ post }: { post: PostWithSite }) {
let [isPendingSaving, startTransitionSaving] = useTransition();
let [isPendingPublishing, startTransitionPublishing] = useTransition();
const [data, setData] = useState<PostWithSite>(post);
const [hydrated, setHydrated] = useState(false);

const url = process.env.NEXT_PUBLIC_VERCEL_ENV
? `https://${data.site?.subdomain}.${process.env.NEXT_PUBLIC_ROOT_DOMAIN}/${data.slug}`
: `http://${data.site?.subdomain}.localhost:3000/${data.slug}`;

// listen to CMD + S and override the default behavior
// useEffect(() => {
// const onKeyDown = (e: KeyboardEvent) => {
// if (e.metaKey && e.key === "s") {
// e.preventDefault();
// startTransitionSaving(async () => {
// await updatePost(data);
// });
// }
// };
// document.addEventListener("keydown", onKeyDown);
// return () => {
// document.removeEventListener("keydown", onKeyDown);
// };
// }, [data, startTransitionSaving]);

const [debouncedData] = useDebounce(data, 1000);
useEffect(() => {
const onKeyDown = (e: KeyboardEvent) => {
if (e.metaKey && e.key === "s") {
e.preventDefault();
startTransitionSaving(async () => {
await updatePost(data);
});
}
};
document.addEventListener("keydown", onKeyDown);
return () => {
document.removeEventListener("keydown", onKeyDown);
};
}, [data, startTransitionSaving]);
if (
data.title === post.title &&
data.description === post.description &&
data.content === post.content
) {
return;
}
startTransitionSaving(async () => {
await updatePost(data);
setData((prev) => ({ ...prev, updatedAt: new Date() }));
});
}, [debouncedData]);

return (
<div className="relative min-h-[500px] w-full max-w-screen-lg border-stone-200 p-12 px-8 dark:border-stone-700 sm:mb-[calc(20vh)] sm:rounded-lg sm:border sm:px-12 sm:shadow-lg">
Expand Down Expand Up @@ -112,18 +127,7 @@ export default function Editor({ post }: { post: PostWithSite }) {
content: editor?.storage.markdown.getMarkdown(),
}));
}}
onDebouncedUpdate={() => {
if (
data.title === post.title &&
data.description === post.description &&
data.content === post.content
) {
return;
}
startTransitionSaving(async () => {
await updatePost(data);
});
}}
disableLocalStorage={true}
/>
</div>
);
Expand Down
2 changes: 1 addition & 1 deletion components/nav.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ export default function Nav({ children }: { children: ReactNode }) {
setSiteId(id);
});
}
}, [segments, id]);
}, [id]);

const tabs = useMemo(() => {
if (segments[0] === "site" && id) {
Expand Down