Notion Assignment Import

A fully-configurable Chromium, Firefox, and Safari extension to load Canvas assignments into a Notion database, at just the click of a button—unlock your full time-management and productivity potential!

• Features
• Screenshots
  • Extension Popup
  • Notion Database Examples
  • Extension Options
• Discord Server
• Setup Instructions
  • Safari Instructions
  • Configurable Options
  • Advanced Options
  • Unlock Date, Due Date, and Date Span
  • Course Code Overrides
  • Page Emojis
• Troubleshooting
  • Wrong Timezone
• Release Notes
  • BREAKING CHANGES
  • v5
  • v4
  • v5.0.0
  • Migration Instructions
  • v4.3.0
  • Migration Instructions
• Building For Local Development
• How It Works
  • Assignment Fetching
  • Notion Import
• Contributors
• Privacy Policy
• Licence

Features

• 💄 Simple, user-friendly interface
• 📄 Provided Notion database template
• 🔧 Configurable options, with input validation
• 🗄️ Category database property for seamless integration into an existing tasks database
• 🔍 No duplication of assignments already in the database
• 📝 Updating previously imported assignments with new Canvas changes
• ⚙️ Fine-tuning of database property names & values
• ✏️ Overriding of Canvas course names
• 😀 Emojis for Notion page icons
• 🧑‍💻 Open source
• 🔒 Private and secure—all data is stored locally. I do not log or save any user data.

Screenshots

Extension Popup

Notion Database Examples

Extension Options

Discord Server

To be notified with updates and changelogs, to get in touch, or just to lurk, join the Discord server!

Setup Instructions

[!TIP] A setup video is also available to follow-along with!

1. Install the Chromium extension, Firefox add-on, or Safari extension.

2. Duplicate this Notion database template (or create/modify your own!).

3. Click on the options icon to configure the extension.

4. Click Authorise with Notion to add the integration to your Notion workspace, and share your relevant database(s).

   [!IMPORTANT] There is a known issue when trying to sign in to Notion using the Continue with Google option.
   This is an issue with the browser and cannot be fixed by this extension.
   If you encounter this issue, please try logging in directly with your email and password.

[!NOTE] for Safari
Due to browser API limitations, OAuth2 is not currently supported. As a temporary stop-gap, support for a Notion Internal Integration has been retained.

1. Follow steps 1 and 2 on this page to create a new Internal Integration.
2. Paste the Notion Internal Integration Token into the input field.

5. Select the desired target database in the Database dropdown.

   [!NOTE] Databases that have not been directly shared with the integration (ie those which are a child of a shared page) might not immediately appear. Use the Refresh button until the desired database appears.

6. Configure the Property Names and Property Values if necessary.

   [!TIP] If you have duplicated my database template, you do not need to change the applied defaults.

7. Configure the Timezone, Course Code Overrides, and Page Emojis options if necessary.

   [!TIP] Course Code Overrides can be found under Advanced Options.

8. Open the Canvas page for the course you wish to import.

   [!IMPORTANT] You should be on a URL that looks something like https://<canvas.auckland.ac.nz>/courses/72763/**/*.

   • <canvas.auckland.ac.nz> should be your own institution's Canvas URL.
   • /**/* means that you can be on the course home page, or any subpage—the important part is /courses/...../.

9. Click Copy from Canvas.

10. You should see the course appear in the Saved Assignments list.

    1. Click Expand to view a list of individual saved assignments.
    2. Click Clear to remove the saved assignments from storage.

11. Repeat steps 8 and 9 as desired.

12. Once you have finished saving assignments, click the Export to Notion button to export to your Notion database.

Safari Instructions

[!WARNING] This is an unsigned extension that is not installed through the Apple App Store.
This means that you will not receive automatic updates, and you must repeat the below installation steps if you wish to update your extension.
This may change in a future update.
To be notified of new releases, join the Discord server.

1. Download the latest notion-assignment-import-safari_latest.zip archive from releases/safari.

2. Unzip the .zip archive.

3. Navigate to the file Notion Canvas Assignment Import in Notion Canvas Assignment Import/Content/MacOS.

4. Open up the terminal app. Paste in this command:

chmod +x

1. Drag and drop the Notion Canvas Assignment Import file into your terminal window. You should now have something that looks like this:

chmod +x /Users/YOUR_USERNAME/Downloads/Notion\ Canvas\ Assignment\ Import/Contents/MacOS/Notion\ Canvas\ Assignment\ Import

6. Hit Enter. You may now close the terminal.

7. Rename the folder Notion Canvas Assignment Import to Notion Canvas Assignment Import.app.

   This turns the folder into an app.

8. Now drag and drop the app into the applications folder.

9. Open the app.

   • If you have successfully opened the app, skip to Step 11.
   • If you have issues opening the app with an error message saying the app is unsafe, continue below.

10. Open System Preferences and go to Security and Privacy -> General. There should be a prompt about applications from unidentified developers. Click Open Anyway. Click allow for any further prompts.

11. Reopen the app.

12. Go to Safari Preferences -> Advanced and enable Show Develop menu in menu bar.

13. Go to the Develop menu in the menu bar, and click Allow unsigned extensions.

14. Go back to Safari Preferences and now go to the Extensions pane. Enable the extension.

15. Done!

Configurable Options

Advanced Options

What is the difference between Unlock Date, Due Date, and Date Span?

Good question—this was ultimately a design decision I made for maximum flexibility.

This enables many possible use-cases, such as:

1. Timelines to be created by Date Span;
2. Calendars to be set to:
   1. Date Span, or
   2. Due Date only.
3. Reminders to be set independent to the due date;
4. Manipulation of the start/end dates on a timeline independent to the unlock/due date; and
5. Sorting assignments by due date, rather than only being able to sort by unlock date.

   Notion doesn't let you sort Date (span) properties by their end date—only their start date.

Of course, you are welcome to configure any of these property names to be ❌ Exclude—these properties are ignored on import.

Course Code Overrides

Example: The course title in the page breadcrumb on Canvas is Course Title, but you want it to be saved in your database as COURSE 121.

Configure Course Code Overrides to the following:

Page Emojis

Example: You want all COURSE 121 pages to have the 👨‍💻 emoji, and all COURSE 101 pages to have the 👀 emoji.

Configure Page Emojis to the following:

Troubleshooting

Wrong Timezone

If your assignments are being imported into Notion in the wrong timezone, please first ensure that you have configured the Timezone option correctly.

[!IMPORTANT] After configuring a Timezone, you must then Clear and re-copy your Saved Assignments in the extension popup.
Timezone offsets are applied when assignments are initially copied from Canvas, and not when assignments are exported to Notion.

[!NOTE] To prevent erroneous clears, the extension will automatically restore cleared assignments if the extension popup is closed before the Cleared! success status is displayed.

Release Notes

[!TIP] For a full changelog of notable changes, see CHANGELOG.md.
Also see Releases.

BREAKING CHANGES

[!CAUTION] If you are an existing user, you may be affected by these breaking changes following an update.

v5

1. Support has been added to update existing pages with changed assignment details (eg name, due date, points, etc.). This requires an additional integration capability, so existing users must reauthorise with Notion.

v4

1. Support for a configurable Notion 'Status' property has been removed, as Notion has implemented their own built-in Status property. To fix assignments being imported without a 'Status' value, change your database property to be of type Status, and assign a DEFAULT value.

   Read more here.

v5.0.0

1. Assignments already imported to Notion can now be updated when details are changed on Canvas. See (#385).
2. Past assignments can now be imported to Notion (#386).
3. Assignments without due dates are now correctly imported (#251).
4. Timezone validation now works as expected (#252).
5. ⌘ + s can now be used to save changes on the Options page on macOS.

Migration Instructions

1. Existing users must reauthorise with Notion, as a new Update Content permission is required.

v4.3.0

1. Notion pages now include the assignment's Canvas description (#59).
2. Added support for a new 'Points' number database property (#61) to tag the assignment's points value.
3. Changed the colour of Advanced Options headings to ease identification.
4. Renamed Available Date to Unlock Date.

Migration Instructions

1. To leverage the new support for a Points property, you must create a new Notion number database property, and configure it on the Options Page.

Building For Local Development

This project uses gulp and esbuild under the bonnet to bundle the compiled JavaScript files to be browser-ready.

1. Fork/clone this repository.

2. Run npm ci --include=dev to install the required dependencies.

3. Run the appropriate build script:

   1. npm run watch to build in watch mode.
   2. npm run debug to build source-mapped, non-minified dist files that are easier to debug.
   3. npm run build for minified dist files.

4. A dist/ directory will be created containing a separate extension root folder for each supported vendor.

How It Works

Assignment Fetching

1. The fetch.ts content script is injected into the active Canvas tab.

2. window.location is used to extract the institution's Canvas origin, as well as the specific pathname of the active tab.

3. The pathname is matched against a regular expression to extract the Canvas :course_id, such as 72763.

4. A same-host fetch() request is made from the active Canvas tab to the following Canvas REST API endpoints, with the logged-in user's cookies:

   1. GET /api/v1/courses/:id, to get the course code.
   2. GET /api/v1/courses/:course_id/assignment_groups, to get a list of assignments.

5. Relevant information is extracted from each Assignment object, and the following configurations applied:

   1. Course Code Overrides, and
   2. Page Emojis.

      [!NOTE] Assignments without an unlock_at date (ie are already unlocked) are set to be unlocked from the top of the next hour, relative to the current time.

6. Fetched assignments are saved by course in browser local storage (see IFetchedAssignment and SavedAssignment in fetch.ts).

Notion Import

7. The OAuth2 token is used to authorise with the Notion API.

8. The saved assignment data is retrieved from local storage.

9. The configured Database is queried to avoid import of duplicate assignments (by matching assignment URLs).

10. The configured Database Properties are used to create a new database page for each assignment with the Notion API.

Contributors

1. Thank you to @PolarWolf314 for doing the conversion work to add Safari support!
2. Thank you to @MatthewLamperski for #89!
3. Thank you to @brandon-mason for #424!

Privacy Policy

In a nutshell, I store only what data is absolutely necessary. This data is stored locally, and is never transmitted back to me.

Refer to the Privacy Policy for my full privacy policy.

Licence

notion-assignment-import is licensed under MIT modified with a Commons Clause.

Basically, don't try to re-badge and monetise this extension.

This extension began as a free, open-source hobby project to help University students save time—no adverts, no data mining, no other asterisks.

I am firm on it remaining as such.