Git Product home page Git Product logo

tasker-rocket's Introduction

Tasker Rocket ๐Ÿš€

The repository for Tasker Rocket ๐Ÿš€, aka the new Tasker application. This project aims to be a smart front-end for the Tasker-Rocket-content repository. The content repository is responsible for providing the content.

Installation

The installation is quite simple, just prepare the .env file, run npm install and npm run dev and you are good to go.

First, copy the .env.example to .env and fill in the required values.

Please note that the content repository needs to have an accessible main branch. Otherwise, the app will not be able to load the sidebar.

cp .env.example .env

Now you need to retrieve the Supabase URL, this should be provided to you by your organisation. For Windesheim students it can be found here

Then install the dependencies of our project:

npm install

After installing the packages you can now run the app:

npm run dev

Open http://localhost:3000 with your browser to see the result.

Updates

It's important to keep our dependencies up to date, so packages should be updated regularly using the instructions below.

Minor-updates

Minor-updates can be performed by using the command of below:

npm update

Major-updates

Performing major-updates is a bit trickier, first identify the outdated dependencies.

npm outdated

Then update each package one-by-one by reinstalling it

npm install <packagename>@latest

Upgrade all packages at once

It can be quite cumbersome to upgrade each package manually, the npm-check-updates-package can do this for us.

Usage

Show all new dependencies (excluding peerDependencies) for the project in the current directory:

$ npx npm-check-updates --peer
Checking package.json
[====================] 5/5 100%

 eslint             7.32.0  โ†’    8.0.0
 prettier           ^2.7.1  โ†’   ^3.0.0
 svelte            ^3.48.0  โ†’  ^3.51.0
 typescript         >3.0.0  โ†’   >4.0.0
 untildify          <4.0.0  โ†’   ^4.0.0
 webpack               4.x  โ†’      5.x

Run npx npm-check-updates --peer -u to upgrade package.json

Upgrade a project's package file:

Make sure your package file is in version control and all changes have been committed. This will overwrite your package file.

$ npx npm-check-updates --peer -u
Upgrading package.json
[====================] 1/1 100%

 express           4.12.x  โ†’   4.13.x

Run npm install to install new versions.

tasker-rocket's People

Contributors

koenvanmeijeren avatar darnellw2 avatar tim567 avatar timonvos avatar kevinfilletcobos avatar foxtetsuo avatar s1160928 avatar yannickbr avatar

Watchers

 avatar

tasker-rocket's Issues

Resizable sidebar

The sidebar is a fixed width right now. The width gets adjusted based on collapsed or expanded state. The goal is to make it manually resizable by hovering over the border and then dragging.

Werkende markdown checklist

Op het moment werken markdown checklists niet. Dr eerste stap is om dit werkend te maken. Vervolgens een manier om de checkbox states op te slaan (bouwt verder op voortgang in localstorage)

Als developer wil ik de kwaliteit & performance van Tasker-Rocket onderzoeken

Denk hierbij aan:

  • In welke mate de react best practices worden toegepast onderzoeken
  • Hoe goed de performance van de code is
  • Wat de kwaliteit van de code is
  • Hoeveel memory de applicatie gebruikt
  • Wat de performance van de applicatie is op verschillende apparaten
  • Unit/component/E2E-testen toevoegen
  • Test-tooling & CI/CD optimaliseren en uitbreiden
  • Lighthouse uitvoeren
  • Testen of de DOM-tree niet onnodig wordt bijgewerkt als er acties worden uitgevoerd
  • Dit project nadat dit is gerealiseerd aanbieden als voorbeeld/inspiratie-project

header zoekfunctie

Zoeken naar directories en bestanden:

  • Als je een bestand selecteert navigeer je naar de parent folder met het bestand uitgeklapt.
  • Als je een folder selecteert navigeer je naar de folder

image

Configurable icons

Content creator can upload an SVG in the root of a folder as an icon, which will then be displayed next to the folder name

Voortgang delen met andere gebruikers

It is still unclear what techniques to use for this. The idea is that a user can share his recorded progress with another user, either by sharing an url or QR code, etc. So first research the possibilities.

Correct and global error handling

Huidige error handling kan een stuk beter, misschien een hook om globaal errors af te vangen? Component voor error weergave, zodat het eruit ziet als een error en niet slechts text is in een div.

image

Mobile support

Right now it is responsive aside for the top header. The elements within then header (breadcrumbs and darkmode btn) dissapear on a smaller screen. So there needs to be an elegant solution for this. A hamburger menu would probably suffice. Make sure that the breadcrumbs are displayed well.

Content changelog [needs design]

This isssue builds on top of the content change indication (notification) functionality. It entails an overview inside a file (with written content or images) of all the past changes, sort of a history. This can be in the format of a table where you have a list of datetimes for example. Then when you click on an item it opens up the actual changes. You can take it a step further and make it similar to a change view in a Git client (e.g. Fork):

image

file fullscreen mode

fullscreen option voor bestanden (in collapsible ergens een fullscreen knop, design komt er aan)

GitHub repositories zonder main branch kunnen niet worden gebruikt

Describe the bug
When a content repository is used without a main branch, the sidebar is not loaded and the task progress feature throws errors. The Git tree is empty, that's why the app breaks.

To Reproduce
Steps to reproduce the behavior:

Configure a content repository without a main branch
Load the app
Expected behavior
The app tries to load another default branch or throws a user friendly error with the message that the content repo is not correctly loaded.

Additional context
Add any other context about the problem here.

The data fetch request which causes the bug

const { data, isLoading, error } = useImmutableDataFetcher<GitHubTree>(
        fetchJsonData,
        {
            url: `${gitHubConfig.base_url}/repos/${gitHubConfig.content_repository}/git/trees/main?recursive=1`,
            bearerToken: session?.provider_token ?? undefined,
            isPrivateData: gitHubConfig.is_private,
        }
    );

Dashboard page

  • de gebruiker moet kunnen kiezen of subtaken weergegeven worden of niet.
  • De voortgangsbalk reflecteert het aantal voltooide subtaken in een taak.
  • de voortgangsbalk heeft 3 verschillende states: oranje(0-33%), geel (33-66%), groen(>66%)

image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.