zeuswpi / g2-frontend Goto Github PK

View Code? Open in Web Editor NEW

6.0 6.0 0.0 11.03 MB

Front-end application for G2.

Home Page: https://g2-project.ga

License: MIT License

JavaScript 1.19% HTML 0.33% Vue 74.54% TypeScript 23.46% SCSS 0.48%

hacktoberfest typescript vue

g2-frontend's Introduction

ZeusWPI

Zeus Extraordinary Uploading Service With Productive (Prolog) Interface

Development

Install SWI-Prolog using asdf.

asdf install

This project relies on Redis for performant session storage. You can start an instance using the provided docker-compose.devel.yml file.

Next create the required directories.

mkdir -p {data,files}

Then start the development (Live reload) server using:

swipl src/main.pl devel 5000

Or run the above steps by running make devel.

Visit your browser at http://localhost:5000.

Deployment

The deployment setup is contained in the provided docker-compose.yml file.

There are 3 environment variables to change:

Key	Value
ZEUSWPI_CLIENT_ID	The OAUTH Client ID
ZEUSWPI_CLIENT_SECRET	The OAUTH Secret
ZEUSWPI_REDIRECT_URI	The OAUTH Redirect URI (Set the correct domain)

You also need to create the required directories in this mode. As these will be mounted as volumes in the container.

mkdir -p {data,files}

Then start with:

docker compose up -d

Adding admins

First the person you want make an admin has to log in to the application once. Then on the server find the user fact in the database data/user.db

assert(user(69,"the_admin",user)).

and update the record to

assert(user(69,"the_admin",admin)).

then restart the application.

g2-frontend's People

Contributors

Stargazers

Watchers

g2-frontend's Issues

Add caching to api data

Right now a lot of components have to pass data causing long pass through streams of certain information.
Introducing a caching layer would allow these components to do a request by themselves.
If the data has already been fetched, it would not send a request, but rather return the cached result.

The cache layer should have the following characteristics:

Cache is session specific.
Reloading the page will not serve the same cache, but rather build a new one. This is important since the data present is rather subjective to change.
Cache should be updated automatically when updating/deleting data
Eg: when a project is deleted using DELETE /projects/{id} it should also be deleted from GET /projects or GET /projects/{id}
Cache should work completely transparent to the components

Add tags page

Add a tag page with:

Table with available tags
Ability to create tags
Ability to delete tags
Ability to modify tags

test issue

Nothing to see here

Encode issue/pull table filters inside the URL

Encode issue/pull table filters inside the URL.
Reloading the page will keep the same parameters.

persist dark-mode after page refresh

Sorting on time is not working correctly in the issue/pull table

Add page specific titles

Add page specific titles so multiple tabs of G2 would be easier to manage.

eg:

Project pages would have the name and description in the title
Search page would have the query in the title
...

Migrate to better routing syntax

Use router object syntax instead of the regular path syntax.
Using the regular path syntax can sometimes cause unwanted behaviour

Unable to press enter to submit form

Some forms do not have the correct submit function, making it impossible to press enter to submit.

Simple settings screen

Contains:

Link github organisation
- 2 textfields for the app keys.

This app can be of the organization, then it will by default have access to the organizations information, or it can be of a user but then g2 will only be able to access what the user can access.

Hover over tag with empty description shows empty popup

I think not showing the popup is more sensible.

Project screen

List important files/docs

Show latest activity?

If linked to repository

List issues of repo
List branches of repo
Only be able to change state when logged in and authorized to edit.

Keep in mind that nested projects will be added in the feature and that this will be a central thing in the ui.

Home screen

List of top projects
A button to add a new project for logged in users.

Login will probably be directly with zeus oauth, as a start.
Have a button, probably just on the home screen to the login url, this will redirect to the zeus endpoint and afterwards redirect back to our app.
-> https://github.com/ZeusWPI/g2/wiki/Users

Context menu of featured items in the Featured page always shows 'feature'

The context menu behaves correctly in the issues tab. It says feature for unfeatured items unfeature for featured items.
In the featured tab it should always say 'unfeature' but it says 'feature'.

Project

Make it possible to:

make projects
add repos to projects
view projects

Add server-side rendering

Add server-side rendering support.

This would benefit the application in a few ways:

Better SEO: web crawlers are not able to load async data.
Ability to view the application without Javascript enabled.
Faster first contentful paint

Invalid tags/projects are removed when searching

When searching invalid tags/projects are removed after receiving the data from the server.
This can cause confusion.

Showing items older then a year can be displayed better.

At the moment this is frequently seen Geopend door .., 502 day(s) ago

I think somthing like 1 year and 137 days ago would be more appropriate.

Css dark/light theme media query

https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme

Add indication that something is featured in the full list of items.

for example in the tab of the issues of a project a star could be placed besides the name to indicate it's starred. This would be more obvious then having to right click on every issue.

As a bonus we could use the star to unfeature it with one simple click.

Add new project screen

Ability to list repositories from linked organizations to link them to a new project.
Automaticaly set name of project to the same of the repository if chosen. Otherwise, chose your own name.

Port to @vue/composition-api instead of vue-class-component

The new composition API for Vue 3 is available under the official @vue/composition-api package. Since the composition API will be natively supported in Vue 3, it may be in our best interest to start using that instead. It will allow for:

Better Typescript support
Native implementation over a 3th party library
Easier migration to Vue 3 down the line
Easier to learn due to more resources available (part of the Vue core)