Coder Social home page Coder Social logo

albericod / overwolf-modern-react-boilerplate Goto Github PK

View Code? Open in Web Editor NEW
55.0 3.0 16.0 10.43 MB

OMRB is a free and open source opinionated boilerplate based on React that helps developers create fast, modular and modern overwolf app.

Home Page: https://www.npmjs.com/package/cra-template-overwolf-typescript-redux

License: MIT License

HTML 1.94% JavaScript 2.62% CSS 9.99% TypeScript 85.46%
overwolf redux-devtools overwolf-store react custom-hooks reactjs modularity games overlay overlays

overwolf-modern-react-boilerplate's Issues

[Question] Starting app

I'm having trouble with starting app generated using this template in Overwolf.

I don't understand which command should I use to create (unpacked) extension. Could you provide short instruction how to do it?

Support debug_url in the manifest

Is your feature request related to a problem? Please describe.
Currently, the focus of the project seems to be, develop in the browser and build for overwolf later.

Describe the solution you'd like
We should support the debug_url property in the manifest to allow for react hot reloading as well is reactive development within the overwolf client.

Describe alternatives you've considered
N/A

Additional context
tl;dr this is great for web browser base development but we should instead shift to allowing for development while in-game using the overwolf client.

[CRA] Create automatic publish to NPM with GitHub Actions

Is your feature request related to a problem? Please describe.

There is a better way with GitHub Actions to release and publish a new version in every new commit automatic.

Describe the solution you'd like.

Create a Github Action to release and publish a new package.

npm run pack-overwolf failed to create a Files folder.

Describe the bug
create-production-overwolf-build.sh failed to create a Files folder in app folder. Which fails to correctly package the app bundle to zip and install opk package to overwolf client.

Before:
cd app mv ../index.html Files mv ../static Files echo 'Compiled successfully!'

After
cd app mkdir Files mv ../index.html Files mv ../static Files echo 'Compiled successfully!'

Alternatively, you can add Files folder to the public/app and will be built with npm run build.

Create Automatic Zip and OPK with GitHub Actions when new commit comming to main branch

Is your feature request related to a problem? Please describe.

It's possible to automatize the process of generating a new OPK in every new feature instead to run the command manually local, this offers a continuous integration of each new commit.

Describe the solution you'd like

Currently exist some scripts to generate a new OPK and ZIP, so the general idea is to create a GitHub Actions to call these scripts when a new commit/PR/merge is submitted.

In the perfect scenario, the newly generated OPK should be disposed of in the overwolf app store automatically by the API, but the API does not exist yet, it's in planning by overwolf team.

Describe alternatives you've considered

There are other alternatives to Github Actions

  • Circle CI
  • Jenkins
  • Azure Pipelines
  • GitLab CI

observe changes when overwolf language setting changes for the i18n use current language

Is your feature request related to a problem? Please describe.
the boilerplate does not detect a new language when it is already loaded, the ideal is that the language is always to propagate when the user switches to a new language in the settings of the overwolf application.

Describe the solution you'd like
using the current overwolf documentation the implementation would be something like this:

function changeLanguage({ language }: { language: string }) {
  i18n.changeLanguage(language);
}

overwolf.settings.language.onLanguageChanged.removeListener(changeLanguage);
overwolf.settings.language.onLanguageChanged.addListener(changeLanguage);

Describe alternatives you've considered
N/A

Additional context
overwolf language api reference: https://overwolf.github.io/docs/api/overwolf-settings-language
i18n reference: https://www.i18next.com

changelog model for overwolf review (QA)

Is your feature request related to a problem? Please describe.
Whenever a new version is generated, we must maintain a changelog so that overwolf's review team can efficiently test the new version.

Describe the solution you'd like
changelog file must follow the semantic versioning and keep a changelog convetion.

Additional context
refrence for submit your OPK for review by the Overwolf team: https://overwolf.github.io/docs/topics/submit-for-review#2-submit-for-review

change overwolf language api

Is your feature request related to a problem? Please describe.
the overwolf language api has been updated, the boilerplate needs to be updated to the new way of identifying the current overwolf language.

Describe the solution you'd like
change old way to new way

//old version 
overwolf.settings.getCurrentOverwolfLanguage(result => {
  i18n.use(initReactI18next).init({
      resources,
      lng: result.language,
      ...
})
______________________________________
//new version
overwolf.settings.language.get((result: IInitI18N) => {
  i18n.use(initReactI18next).init({
      resources,
      lng: result.language,
      ...
})

Describe alternatives you've considered
N/A

Additional context
overwolf language reference: https://overwolf.github.io/docs/api/overwolf-settings-language

Overwolf ADS SDK Integration

Is your feature request related to a problem? Please describe.

this feature will simplify the implementation of overwolf AD SDK

Describe the solution you'd like

this solution should be simple and modern using the new React hook API.
e.g

const container = useOWAd({width: 400, height: 300 });

<div ref={container} />

Describe alternatives you've considered

an alternative for implementing the ads would be to update the overwolf hooks package.

https://www.npmjs.com/package/overwolf-hooks

e.g

import { useOWAd } from 'overwolf-hooks';

const [containerRef, owAdMethods ] = useOWAd({width: 400, height: 300 });
//owAdMethods.refreshAd()
//owAdMethods.stopAd()

<div ref={containerRef} />

Additional context
references for overwolf ads sdk https://overwolf.github.io/docs/start/ads-sdk-overview

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.