Giter Club home page Giter Club logo

ckan-ui's Introduction

Lifecycle:Maturing

CKAN-UI

Requirements

  • CKAN (with solr/postgres), running

Components

This repository consists of two components a frontend and a backend. There is a helm chart to deploy this as part of the bcgov/helm-charts repo.

The frontend uses asynchronous calls to the backend (bridge) which handles the calls to all of the other services like CKAN,Keycloak (SSO),Google Analytics, etc. These services are outside of the scope of this document but are expected to exist for this to work. The backend bridge upon getting the information from the service can perform some formatting and return it to the frontend. Additionally the backend may use caching or anything else as needed to better serve the end user from a reliability and speed perspective. Dockerfiles are provided and the frontend is hosted with Caddy server, the backend bridge is expected to be run from a place it is easily accessible to the frontend at a HOSTNAME variable passed into the frontend image. The backend image expects to be provided a configuration file that matches the format of backend/config/(default|dev).json.

Backend

Modify backend/config/dev.json (or test/prod as might be the case) by copying the template and overriding the values custom to your environment (Ckan url, solr url, port)

Run the backend with npm start in the backend directory or npm run serve to do hot reloading (dev)

Front end

Modify frontend/vue.config.js and frontend/src/config/config.js by changing the values as needed

Run the frontend with npm run build && npm install -g serve && serve -s dist in the frontend directory or npm run serve to do hot reloading (dev)

Docker Container

Build the backend docker container with

docker build .

Run the backend container container with

hostip=$(ifconfig en0 | awk '$1 == "inet" {print $2}')
docker run -p 3000:3000 -v $(pwd)/backend/config:/app/config --add-host=docker:$hostip $CONTAINER_ID

Replacing $CONTAINER_ID with the output from docker build (or the tag if you tagged it)

Build the frontend docker container with

docker build . -f Dockerfile-frontend

Run the backend container container with

hostip=$(ifconfig en0 | awk '$1 == "inet" {print $2}')
docker run -p 8080:8080 -e HOSTNAME=docker --add-host=docker:$hostip $CONTAINER_ID

Replacing $CONTAINER_ID with the output from docker build (or the tag if you tagged it)

Helm

Create a config.yaml in helm/ckan-ui/ create it from a copy of values.yaml, overriding the values as needed.

Install

helm install ./helm/ckan-ui -n ckan-ui -f ./helm/ckan-ui/config.yaml

Upgrade

helm upgrade ckan-ui ./helm/ckan-ui -f ./helm/ckan-ui/config.yaml

ckan-ui's People

Contributors

adodge-bcg avatar alixcote avatar annikaliving avatar brandonsharratt avatar crigdongov avatar dependabot[bot] avatar gurman10 avatar jachurchill avatar joe-taylor avatar repo-mountie[bot] avatar ryleyw avatar stevechapmanbcdx avatar terrylanktree avatar timosse avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ckan-ui's Issues

Autocomplete Fields are not Working

This applies to the keywords field on datasets and the iso topic category field on resources. Behaviour is not exactly the same but code is similar so will look at both at once

Add icons to labels to action lists

The design for the following views has been modified to add icons adjacent to the existing labels:

  • Dataset view;
  • Resource view;
  • Organization view; and
  • Group view

Move some of the logic

Some of the logic for how to display/sort objects is in the vuex store, we should move things that don't affect lists (at least) the backend bridge in an attempt to normalize the data so if the backend changes with a new version of CKAN or if the backend isn't CKAN it would be easier to change it.

Fix history router

The history router is broken investigate and fix. (This is the router that removes the # from the url and allows people to url link to specific pages)

VueJS UI - Login

@BrandonSharratt commented on Thu Feb 28 2019

See epic but add the ability to login, probably keycloak related. Depends on Mikes user stories that come of this, but investigate for now


@BrandonSharratt commented on Tue Mar 05 2019

ckanext-keycloak exists and although buggy does work with minor changes for us. It will even tie into existing users.

The ui uses keycloak authentication and then uses the jwt to authorize with ckan.

Keycloaks default timeout is 5 minutes on the token so we'll need to build renewal into the token


@BrandonSharratt commented on Tue Mar 05 2019

I've made it refresh tokens in the window between expired and refresh tokens being valid (keycloak default is access expires in 5, refresh expires in 10, so therefore it would refresh the token on a call made between 5 and 10).

UX Research Report

Prepare a report that summarizes the research findings to date. Include report methodology. Include recommendations for UI/UX modifications, additional research and other pertinent issue. Link recommendations to evidence developed from research.

Resource List Loads with duplicates

Resource list on dataset page loads correctly initially but when the full details are fetched one of the resources will overwrite other resources randomly

Backlog

Bucket to document backlog items as they arise.

Organization Filter

We might want to change this down the line. There are a lot of orgs - when open, it takes up a lot of room.

Post MVP, do we want to change this to scroll (or some other solution)?

Investigate Speed

The new UI has an increasingly high time to load as we add libraries and code, investigate ways to speed up page load.

Improve error messaging when back end fails to respond

In CADI and CATI, the back end will occasionally fail with no error message. The behaviour from the user's perspective is a perpetual spinner (that is, the failure is not graceful).

How do we handle this error more gracefully? Reviewed with dev group => recommended implementation is timeout that alerts user that there has been a failure and invite user to reload application.

Related, but not pertinent - Issue may arise from config differences between CADI and CATI. Probably best to diff the containerization setup between CADI and CATI.

Resource View: Design

Design the Resouce View.
Design these ancillary views:

  • Resource Preview view; and
  • Resource View Schema view

Dataset Page spins indefinitely when schema isn't already pulled from the api

Load up a dataset page, the loader will spin indefinitely when schema isn't already pulled from the api.

You can simulate this by logging in or out on that page.

See if you can fix and also increase performance (speed up page load)

Probably cache the schema in the backend bridge. delete the old view fallback, and have a "This is taking a long time to load fall back instead"

VueJS UI

As a user,

I want a new ui

so that shiny.

As a developer,

I want a new ui

so that concerns are separated thus making maintenance is easier.

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.