#85 [Tracking] Typescript UI and API migration with new features

[Anonymous]

Originally created by: supreme-gg-gg

Migration to TypeScript Ink as discussed in [#84]. This is the tracking issue for the migration. Please subscribe for major updates that we comment here.

Migration (Done)

Stage 1: Foundation and Chat

• Project setup with Ink
• Migrate auth system, sessions, config, commands
• Migrate threads UI and messages UI with typescript API + navigation

Stage 2: Chat UI, Commands

• Restore support for all the Chat Commands and CLI commands (scheduling, media, analytics, notification overview, configuration commands)
• Ensure media handling (upload / download) function properly, support image display
• Displaying reactions, thread replies, editing / deleting messages

Stage 3: Realtime messaging support

See [#74]

Finally various CI updates, documentation updates, releases, build...

Development

The main branch for this migration task will be origin/ts-migration/main. We will be merging PRs into this branch, and on major milestones merge to main as development release. Python client will not be affected at all during the process. Our new TS client will currently be completely self-contained in instagram-ts directory.

Resources (collecting all the references needed):

• instagram private api -- ts
• instagram mqtt
• ink -- pls scroll down to "useful components" section as well
• meow

[Anonymous]

Originally posted by: Quimisagi

Nice
Wondering how I should get started.

[Anonymous]

Originally posted by: supreme-gg-gg

Nice Wondering how I should get started.

You can create PRs to the ts-migration-main branch. It's a little bit messy right now since I'm still figuring out the new structure and tech stack and I'll try to open a few more specific [migration] sub-issues. But feel free to work on new features like [#83] (or similar [#43]), ink image might be a good library to start

[Anonymous]

Originally posted by: supreme-gg-gg

Adding these two resources for frontend migration:

• Here is a list of UI components in Ink pre-built by the creator, @inkjs/ui is already installed you can just import (think of this like using Rich styling components back in the python client: https://github.com/vadimdemedes/ink-ui

• Pastel, for CLI apps (easy integration with multiple commands and subcommands for Ink apps) https://github.com/vadimdemedes/pastel

Both are by the same creator so integration should be very easy and optimised

[Anonymous]

Originally posted by: supreme-gg-gg

renamed ts-migration-main to ts-migration/main, feature branches can be named like ts-migration/feature-1 for better convention. the new setup has been documented in instagram-ts/README.md

[Anonymous]

Originally posted by: supreme-gg-gg

Status update:

1. Planned dev release of TS client by end of august (i.e. you need to build manually with npm run build)

2. Planned release on npm registry soon after chat commands migration is done and all UI components are consistent across emulators and platforms

[Anonymous]

Ticket changed by: supreme-gg-gg

• status: open --> closed

[Anonymous]

Originally posted by: supreme-gg-gg

Oops this was accidentally closed. We got a bit delayed with the dev release, will also push back the formal release by a few days / weeks. The next stage timeline:

1. Migrate all the chat commands [feature]
2. Fix project vulnerabilities, linter issues, switch ascii art to other non-canvas dependent packages, etc. [technical debt]
3. New CI for releasing on npm!

Let's say by late September this would be available on NPM by the latest 😄

Now that the basic setup of the new client is done, everyone can start contributing to it! However, please keep your PRs directed to ts-migration/main for now until we've formally made a NPM release, then all merges would be against main.

Followed by (planned to finish by mid-Oct):

• Realtime messaging!!! [#74] (the big boss)

cc @endernoke how does this sounds overall? These probably won't be as challenging as reworking the entire image system lol, so I expect it to be a quite chill timeline

[Anonymous]

Ticket changed by: supreme-gg-gg

• status: closed --> open

[Anonymous]

Originally posted by: endernoke

Oops this was accidentally closed. We got a bit delayed with the dev release, will also push back the formal release by a few days / weeks. The next stage timeline:

1. Migrate all the chat commands [feature]
2. Fix project vulnerabilities, linter issues, switch ascii art to other non-canvas dependent packages, etc. [technical debt]
3. New CI for releasing on npm!

Let's say by late September this would be available on NPM by the latest 😄

Now that the basic setup of the new client is done, everyone can start contributing to it! However, please keep your PRs directed to ts-migration/main for now until we've formally made a NPM release, then all merges would be against main.

Followed by (planned to finish by mid-Oct):

• Realtime messaging!!! [feature] real-time chat updates [#74] (the big boss)

cc @endernoke how does this sounds overall? These probably won't be as challenging as reworking the entire image system lol, so I expect it to be a quite chill timeline

Sounds great 👍
2 and 3 would be quite easy I believe (I've already eliminated all vulnerabilities from ink-picture)

Also, while we're still early and the technical debt hasn't really accumulated yet, we might want to start trying to work out a viable plugins system when making changes, so we won't need to rewrite important architecture in the future lol, see [#40]

[Anonymous]

Originally posted by: supreme-gg-gg

Fellow Instagramers I think we've almost come to the end of this tracking issue! All the migration steps will be completed once [#145] is merged and the minor issues such as adding tests etc are completed. Before we make our first beta release, if anyone has any questions / suggestions that we should first look into, please comment here. Otherwise, we will be closing ts-migration/main and moving all development back to main directly for new features.

[Anonymous]

Originally posted by: supreme-gg-gg

Happy to announce that the beta is live on npm! npm install -g @i7m/instagram-cli@beta

We will be closing this soon as exit the migration phase. There are still a lot of work to do for TS client! However, they will be tracked as separate feature issues and all PR will be merged to main instead of ts-migration/main, just as the regular python development cycle!

[Anonymous]

Ticket changed by: endernoke

• status: open --> closed