Skip to content

Commit

Permalink
chore: test
Browse files Browse the repository at this point in the history
  • Loading branch information
tomwisecodes committed Nov 15, 2024
1 parent 38a798a commit 9e24256
Show file tree
Hide file tree
Showing 2 changed files with 82 additions and 52 deletions.
69 changes: 56 additions & 13 deletions apps/nextjs/src/components/AppComponents/Chat/chat-start.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -92,13 +92,26 @@ export function ChatStart() {
],
);
const [validationError, setValidationError] = useState<string | null>(null);
const userCanSubmit =
selectedSubject && selectedKeyStage && selectedLength && input
? true
: false;

const [userCanSubmit, setUserCanSubmit] = useState(false);

useEffect(() => {
if (selectedSubject && selectedKeyStage && selectedLength && input) {
setUserCanSubmit(true);
} else {
setUserCanSubmit(false);
}
}, [
selectedSubject,
selectedKeyStage,
selectedLength,
input,
setUserCanSubmit,
]);

const submit = useCallback(
async (message: string) => {
if (!userCanSubmit) {
if (!selectedSubject || !selectedKeyStage || !selectedLength || !input) {
setValidationError(
`The following field(s) are missing: ${
!selectedSubject ? "Subject" : ""
Expand All @@ -115,7 +128,7 @@ export function ChatStart() {
create(message);
}
},
[create, setDialogWindow, demo.isDemoUser, setIsSubmitting, userCanSubmit],
[create, setDialogWindow, demo.isDemoUser, setIsSubmitting],
);

const interstitialSubmit = useCallback(async () => {
Expand Down Expand Up @@ -198,13 +211,26 @@ export function ChatStart() {
variant="link"
className="pl-0"
onClick={async () => {
trackEvent(`chat: ${message.message}`);
setInput("roman britain");
setSelectedKeyStage("Key Stage 3");
setSelectedSubject("History");
setSelectedLength("60 mins");
if (typeof initialPrompt === "string") {
await submit(initialPrompt);
try {
trackEvent(`chat: ${message.message}`);
await populateAllStartChatFields({
setInput,
setSelectedKeyStage,
setSelectedSubject,
setSelectedLength,
});

if (typeof initialPrompt === "string") {
// wait for 0.5s to ensure the state is updated
setTimeout(async () => {
await submit(initialPrompt);
}, 500);
}
} catch (error) {
console.error(
"Error handling button click:",
error,
);
}
}}
>
Expand Down Expand Up @@ -517,3 +543,20 @@ export function useOutsideClick(callback: () => void) {

return ref;
}

async function populateAllStartChatFields({
setInput,
setSelectedKeyStage,
setSelectedSubject,
setSelectedLength,
}: {
setInput: (value: string) => void;
setSelectedKeyStage: (value: string) => void;
setSelectedSubject: (value: string) => void;
setSelectedLength: (value: string) => void;
}) {
setInput("roman britain");
setSelectedKeyStage("Key Stage 3");
setSelectedSubject("History");
setSelectedLength("60 mins");
}
65 changes: 26 additions & 39 deletions apps/nextjs/src/components/AppComponents/Chat/markdown.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,10 @@ export const MemoizedReactMarkdownWithStyles = ({

// UseCallback to avoid inline function recreation
const handleAppend = useCallback(
(content: string) => append({ content, role: "user" }),
(content: string) => {
console.log("Appending message:", content);
append({ content, role: "user" });
},
[append],
);

Expand Down Expand Up @@ -80,19 +83,19 @@ export const MemoizedReactMarkdownWithStyles = ({
);
},
p({ children }) {
const isStringChild = (child: any): child is string =>
typeof child === "string";

const textChildren = React.Children.toArray(children)
.filter(isStringChild)
.join("");

if (
Array.isArray(children) &&
(children[children.length - 1]?.includes(
"proceed to the final step",
) ||
children[children.length - 1]?.includes(
"move on to the final step",
) ||
children[children.length - 1]?.includes(
"complete the lesson plan",
))
textChildren.includes("proceed to the final step") ||
textChildren.includes("move on to the final step") ||
textChildren.includes("complete the lesson plan")
) {
const text = children.slice(0, -2)[0].split("Otherwise, tap")[0];
const text = textChildren.split("Otherwise, tap")[0];
return (
<div className="flex flex-col gap-5">
<p className={cn("mb-7 last:mb-0", className)}>{text}</p>
Expand All @@ -103,17 +106,13 @@ export const MemoizedReactMarkdownWithStyles = ({
</div>
);
}

if (
Array.isArray(children) &&
(children[children.length - 1]?.includes(
"proceed to the next step",
) ||
children[children.length - 1]?.includes(
"move on to the next step",
) ||
children[children.length - 3]?.includes("Otherwise, tap"))
textChildren.includes("proceed to the next step") ||
textChildren.includes("move on to the next step") ||
textChildren.includes("Otherwise, tap")
) {
const text = children.slice(0, -2)[0].split("Otherwise, tap")[0];
const text = textChildren.split("Otherwise, tap")[0];
return (
<div className="flex flex-col gap-5">
<p className={cn("mb-7 last:mb-0", className)}>{text}</p>
Expand All @@ -125,24 +124,9 @@ export const MemoizedReactMarkdownWithStyles = ({
);
}

if (
Array.isArray(children) &&
children[2]?.includes("start from scratch")
) {
return (
<div className="flex flex-col gap-5">
<p className={cn("mb-7 last:mb-0", className)}>
If not, ask me something or else, or:
</p>
<InLineButton
onClick={() => handleAppend("Continue from scratch")}
text="Continue from scratch"
/>
</div>
);
}
return <p className={cn("mb-7 last:mb-0", className)}>{children}</p>;
},

h1({ children }) {
return (
<Flex align="center" gap="3" className="mt-20">
Expand Down Expand Up @@ -213,12 +197,15 @@ export const MemoizedReactMarkdownWithStyles = ({
</MemoizedReactMarkdown>
);
};

const InLineButton = memo(
({ text, onClick }: { text: string; onClick: () => void }) => {
const handleClick = useCallback(() => {
onClick();
}, [onClick]);

return (
<button
onClick={onClick}
onClick={handleClick}
className="my-6 w-fit border-spacing-4 rounded-lg border border-black border-opacity-30 bg-white p-7 text-blue"
>
{text}
Expand Down

0 comments on commit 9e24256

Please sign in to comment.