Add export and import pages

[sanchopanda]

Fixes #177

Motivation

Screenshot or Video

Checklist

• [ ] Don’t rush. Check all changes in PR again.
• [ ] Run pnpm test.
• [ ] Think about changing documentation.
  • If you added a script to scripts/, add a comment with a description.
  • If you added a new folder, add its description to the project’s README.md.
  • If you added config, describe how we use this tool in the config’s comment.
  • If you added something to the project’s architecture, describe it in the project’s README.md.
  • Try to focus on “why?”, not “how?”.
• [ ] If you added a new dependency, check our requirements.
• [ ] Think about testing
  • If you added a feature, add unit tests.
  • If you added a new state to the UI, add visual tests.
  • If you fixed the bug, think about preventing bug regression in the future.
• If you changed web client:
  • [ ] Think about moving code to core/. What code will also be useful on other platforms?
  • [ ] Run pnpm size and check the difference in the JS bundle size. Is it relevant to the changes? Change the limit in web/.size-limit.json if necessary.
  • [ ] The UI was checked in Chrome and Firefox (and Safari or Epiphany if you have them).
  • [ ] Think about keyboard UX. Is it easy to use the new feature with only one hand on a keyboard? Is it easy to understand what keys to press?
  • [ ] Think about HTML semantics.
  • [ ] Think about accessibility. Check a11y recommendations. Think about how screen reader users will use the tool. Is it easy to use on a screen with bad contrast?
  • [ ] Think about translations.
  • [ ] Think about right-to-left languages. What parts of the screen should be mirrored for Arabic or Hebrew languages?
• If you changed web/main/ files:
  • Do you need to backport styles changes to web/public/404.html or web/public/500.html?
  • Think about app loading styles inlined in index.html.
• If you changed core/:
  • [ ] Think about making types more precise. Can you better explain data relations by type?
  • [ ] Think about conflict resolution. We don’t need some very smart changing merging; just 2 changes of the same item on different clients should not break the database. What if the user changes an item on one machine and removes it on another?
  • [ ] Think about log and storage migration.
• If you changed English translations:
  • [ ] Change translation ID if you change the meaning of the text.

[github-actions[bot]]

Pull request auto-reviewer

Since you’ve made changes to files in web/main/ consider these points:

• Do you need to backport styles changes to web/public/404.html or web/public/500.html?
• Think about app loading styles inlined in index.html.

[github-actions[bot]]

Pull request auto-reviewer

Since you changed core/:

• [ ] Think about making types more precise. Can you better explain data relations by type?
• [ ] Think about conflict resolution. We don’t need some very smart changing merging; just 2 changes of the same item on different clients should not break the database. What if the user changes an item on one machine and removes it on another?
• [ ] Think about log and storage migration.

[github-actions[bot]]

Pull request auto-reviewer

Since you’ve made changes to files in web/main/ consider these points:

• Do you need to backport styles changes to web/public/404.html or web/public/500.html?
• Think about app loading styles inlined in index.html.

[github-actions[bot]]

Pull request auto-reviewer

Since you changed core/:

• [ ] Think about making types more precise. Can you better explain data relations by type?
• [ ] Think about conflict resolution. We don’t need some very smart changing merging; just 2 changes of the same item on different clients should not break the database. What if the user changes an item on one machine and removes it on another?
• [ ] Think about log and storage migration.

[github-actions[bot]]

Pull request auto-reviewer

Since you’ve made changes to files in web/main/ consider these points:

• Do you need to backport styles changes to web/public/404.html or web/public/500.html?
• Think about app loading styles inlined in index.html.

[github-actions[bot]]

Pull request auto-reviewer

Since you changed core/:

• [ ] Think about making types more precise. Can you better explain data relations by type?
• [ ] Think about conflict resolution. We don’t need some very smart changing merging; just 2 changes of the same item on different clients should not break the database. What if the user changes an item on one machine and removes it on another?
• [ ] Think about log and storage migration.

[ai]

Sorry for repeating messages of auto-reviewer. We are still in the development this feature.

[sanchopanda]

I'm very sorry for taking so long. It probably requires a lot more improvements, but at least it works.

[ai]

No-no, it is a really complex task. Thanks.

I will review in a few days (need a recovery after the conferences).

[ai]

Can you write me to @sitnik?

I will give you my OPML file. When I try to use it, import page rendered this (everything OK), but Import button doesn’t work.

The same with loader-tests/example.opml

[ai]

It works, amazing!

I will do a little deeper review later. But we need storybook and coverage.

BTW, do you have Telegram or Discord? You can write me to https://t.me/sitnik

[sanchopanda]

I will do a little deeper review later. But we need storybook and coverage.

Yes, I struggled with tests, now working on it

[sanchopanda]

BTW, do you have Telegram or Discord? You can write me to https://t.me/sitnik

telegram

[sanchopanda]

seems ready for a new review)

[ai]

Thanks a lot! It was big and complex work.