images work kinda

This commit is contained in:
2024-11-20 13:41:45 -07:00
parent ecf213ebef
commit 507c5f05ad
3 changed files with 50 additions and 38 deletions

View File

@@ -34,44 +34,53 @@ export const useUpdateImageSettingsForAssignment = ({
const [assignment] = useAssignmentQuery(moduleName, assignmentName); const [assignment] = useAssignmentQuery(moduleName, assignmentName);
const updateSettings = useUpdateLocalCourseSettingsMutation(); const updateSettings = useUpdateLocalCourseSettingsMutation();
const [isUpdatingSettings, setIsUpdatingSettings] = useState(false); const [isUpdatingSettings, setIsUpdatingSettings] = useState(false);
const createCanvasUrlMutation =
trpc.canvasFile.getCanvasFileUrl.useMutation();
// useEffect(() => { useEffect(() => {
// if (isUpdatingSettings) { if (isUpdatingSettings) {
// console.log("not updating image assets, still loading"); console.log("not updating image assets, still loading");
// return; return;
// } }
// setIsUpdatingSettings(true); setIsUpdatingSettings(true);
// const assignmentMarkdown = markdownToHtmlNoImages(assignment.description); const assignmentMarkdown = markdownToHtmlNoImages(assignment.description);
// const imageSources = extractImageSources(assignmentMarkdown); const imageSources = extractImageSources(assignmentMarkdown);
// const imagesToUpdate = imageSources.filter((source) => const imagesToUpdate = imageSources.filter((source) =>
// settings.assets.every((a) => a.sourceUrl !== source) settings.assets.every((a) => a.sourceUrl !== source)
// ); );
// console.log("images to update", imagesToUpdate); console.log("images to update", imagesToUpdate);
if (imagesToUpdate.length)
// Promise.all( {
// imagesToUpdate.map(async (source) => { Promise.all(
// // todo: get canvas url imagesToUpdate.map(async (source) => {
// const canvasUrl = ""; // todo: get canvas url
// return { sourceUrl: source, canvasUrl }; // const canvasUrl = "";
// }) const canvasUrl = await createCanvasUrlMutation.mutateAsync({
// ).then(async (newAssets) => { sourceUrl: source,
// await updateSettings.mutateAsync({ canvasCourseId: settings.canvasId,
// settings: { });
// ...settings, console.log("got canvas url", source, canvasUrl);
// assets: [...settings.assets, ...newAssets], return { sourceUrl: source, canvasUrl };
// }, })
// }); ).then(async (newAssets) => {
// setIsUpdatingSettings(false); await updateSettings.mutateAsync({
// }); settings: {
// }, [ ...settings,
// assignment.description, assets: [...settings.assets, ...newAssets],
// isUpdatingSettings, },
// settings, });
// settings.assets, setIsUpdatingSettings(false);
// updateSettings, });}
// ]); }, [
assignment.description,
createCanvasUrlMutation,
isUpdatingSettings,
settings,
settings.assets,
updateSettings,
]);
}; };
export const useAssignmentNamesQuery = (moduleName: string) => { export const useAssignmentNamesQuery = (moduleName: string) => {

View File

@@ -38,7 +38,7 @@ export const uploadToCanvasPart1 = async (
canvasCourseId: number canvasCourseId: number
) => { ) => {
try { try {
const url = `${canvasApi}/courses/${canvasCourseId}/assignment_groups`; const url = `${canvasApi}/courses/${canvasCourseId}/files`;
const formData = new FormData(); const formData = new FormData();
@@ -69,7 +69,7 @@ export const uploadToCanvasPart2 = async ({
try { try {
const formData = new FormData(); const formData = new FormData();
Object.keys(formData).forEach((key) => { Object.keys(upload_params).forEach((key) => {
formData.append(key, upload_params[key]); formData.append(key, upload_params[key]);
}); });
@@ -95,7 +95,7 @@ export const uploadToCanvasPart2 = async ({
} }
return response.data.url; return response.data.url;
} catch (error) { } catch (error) {
console.error("Error uploading file to Canvas part 1:", error); console.error("Error uploading file to Canvas part 2:", error);
throw error; throw error;
} }
}; };

View File

@@ -17,15 +17,18 @@ export const canvasFileRouter = router({
) )
.mutation(async ({ input: { sourceUrl, canvasCourseId } }) => { .mutation(async ({ input: { sourceUrl, canvasCourseId } }) => {
const localTempFile = await downloadUrlToTempDirectory(sourceUrl); const localTempFile = await downloadUrlToTempDirectory(sourceUrl);
console.log("local temp file", localTempFile);
const { upload_url, upload_params } = await uploadToCanvasPart1( const { upload_url, upload_params } = await uploadToCanvasPart1(
localTempFile, localTempFile,
canvasCourseId canvasCourseId
); );
console.log("part 1 done", upload_url, upload_params);
const canvasUrl = await uploadToCanvasPart2({ const canvasUrl = await uploadToCanvasPart2({
pathToUpload: localTempFile, pathToUpload: localTempFile,
upload_url, upload_url,
upload_params, upload_params,
}); });
console.log("canvas url done");
return canvasUrl; return canvasUrl;
}), }),
}); });