Coder Social home page Coder Social logo

gameworkersolidarity / website Goto Github PK

View Code? Open in Web Editor NEW
10.0 0.0 1.0 1.91 MB

A living history of game worker solidarity

Home Page: https://gameworkersolidarity.com

License: GNU General Public License v3.0

TypeScript 95.50% JavaScript 2.72% CSS 1.78%
collective-action workers unions game-developement game-design

website's Introduction

Game Worker Solidarity is mapping and documenting collective movements by game workers striving to improve their working conditions. We're collecting materials created by workers for these movements and aim to document the longer history of resistance in the industry which goes back to its formation.

This repository is for a website backed by a database of events that can be freely searched by location, type of action, and numbers involved for events like the creation of trade union branches, new contracts, strikes, protests, social media campaigns, etc.

Where possible, we'll also interview and record oral histories with participants of these movements to produce a living resource that can help support and inspire more organising in the games industry.

Do you have any information to share with us that we can add to the timeline? Get in touch!

Technical documentation

Check out this early stage, highly WIP documentation for the overall system. Later we will transpose that content to this README file.

Getting started: run it on your machine

First, download the code from github (e.g. git clone).

You will need to copy .env.template to .env.local and fill out the required env variables.

To run the system locally, on your machine you will need:

  • node (recommend installing and managing this via nvm)
  • ideally also yarn, because we pin specific versions of package dependencies using yarn (see ./yarn.lock)

Install the required package dependencies:

yarn
# or
npm install

Then you can run the development server:

yarn dev
# or
npm run dev

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

Development guide

This is a Next.js project bootstrapped with create-next-app. To learn more about Next.js, take a look at the following resources:

Pages

You can start editing the page by modifying pages/index.js. The page auto-updates as you edit the file.

API routes

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.js.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Typescript interfaces and parsers

In development we've been generating schemas from typescript interfaces, to help smooth out API responses. When things aren't as expected, they don't show up.

To add to the schema, add interfaces to types.ts.

To regenerate the schema (at schema.ts):

yarn generateschema

Deployment

This repo auto-deploys to Digital Ocean.

CDN for public file hosting

Cloudinary is used as a public CDN for Airtable images. Here's how it works:

  • The /api/syncToCDN endpoint is responsible for refreshing the cdn_urls to sync Airtable's private attachments to the public CDN and then store the public URLs back in Airtable for serving in the frontend.
  • The hidden cdn_urls column which stores data about the publicly viewable URLs should not be edited manually.
  • Whenever an Airtable record is updated, a webhook will trigger the re-sync. A Github action regularly triggers maintenance script, which will create/refresh the managed webhook to the Airtable.
  • The webhook management script requires an access token in the env (AIRTABLE_API_KEY) configured via this URL as follows:

website's People

Contributors

austinkelmore avatar conatus avatar dependabot[bot] avatar janbaykara avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Forkers

conatus

website's Issues

Assess implications for Airtable's change of attachment URL functionality

Relevant support article on the change: https://support.airtable.com/hc/en-us/articles/4852449595671-Changes-to-Airtable-attachments

In an effort to increase attachment security, on November 8th, 2022 Airtable will be incorporating expiring links functionality. That means when you share attachments stored in Airtable via URL with external colleagues the link you provide them will expire after a couple of hours. Read on to learn more about how to prepare for the upcoming changes.

Currently, Airtable attachments include a static URL where the attachment can be publicly accessed via a web browser. These links never expire and could be accessed by anyone who obtains the attachment’s link. This presents a potential security risk for any files that contain sensitive information. For that reason, we are introducing expiring public-accessible attachment links.

I think we're using attachment URLs for action files, which might mean they expire. On the other hand, we're also using next/image, which does some image caching. Do the two cancel each other out, or do we need to figure out a solution?

Combobox for filters

The filter selection UI is getting unwieldy due to all the options. We should add a text search / autoselect element (known as a combobox) to make it easier to use.

image

Examples:

image

image

Use action’s image thumbnail for social share card

The SolidarityActionCard could do with an og:image tag (etc.) that pulls in the image thumbnail if one is available. Adds a bit of variety to the share cards.

Alternatively we could autogenerate card imagery using the title and other metadata, a bit like how Github does for public repos and issues.

E.g. image

Display selected filter value instead of the filter label

I've been using the Github mobile app and I think they have the right UI model for filtering.

image

image

i.e. Replace the generic label with the selected value, when there is one selected value.

(Only use the generic label when there is more than one selected value, with a counter)

I actually enjoy that they treat filters like an OR, not AND, but I think that's tangential to the main point of this issue.

Happy to PR this, just jotting it down in issue form while it's in mind.

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.