Skip to content

Commit

Permalink
Merge eabcc1a into ef04840
Browse files Browse the repository at this point in the history
  • Loading branch information
poplexity authored Aug 22, 2023
2 parents ef04840 + eabcc1a commit 2ee5213
Show file tree
Hide file tree
Showing 21 changed files with 379 additions and 60 deletions.
24 changes: 15 additions & 9 deletions .github/workflows/build_job.yml
Original file line number Diff line number Diff line change
Expand Up @@ -30,13 +30,15 @@ jobs:
node-version: '16.17.0'
- run: yarn global add @quasar/cli
- run: yarn install
- run: quasar build
- run: mkdir dist/spa/functions && cp -a functions/* dist/spa/functions/
- run: quasar build -m ssr -d
- run: mkdir dist/ssr/functions
- run: echo "export async function onRequest(context) { return new Response('Hello, world!') }" > dist/ssr/functions/hello.js
- run: echo "<html><body>hi</body></html>" > dist/ssr/index.html
- name: upload
uses: actions/upload-artifact@v3
with:
name: ${{ inputs.network }}-build
path: dist/spa
path: dist/ssr
test:
name: test
runs-on: ubuntu-latest
Expand Down Expand Up @@ -90,15 +92,18 @@ jobs:
- uses: actions/download-artifact@v3
with:
name: ${{ inputs.network }}-build
path: dist/spa
- run: cp -a dist/spa/functions .
path: dist/ssr
# - run: echo $(ls -l)
- run: cp -a dist/ssr/functions .
- run: ls -la functions
# - run: cd dist/spa/functions/ssr && yarn install && cd -
- name: publish
uses: cloudflare/pages-action@v1
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
accountId: ${{ inputs.account_id }}
projectName: ${{ inputs.project }}
directory: dist/spa
directory: dist/ssr
# Optional: Enable this if you want to have GitHub Deployments triggered
# gitHubToken: ${{ secrets.GITHUB_TOKEN }}
# the branch is used for the URL, it does not need to equal the current branch so we can
Expand All @@ -115,15 +120,16 @@ jobs:
- uses: actions/download-artifact@v3
with:
name: ${{ inputs.network }}-build
path: dist/spa
- run: cp -a dist/spa/functions .
path: dist/ssr
# - run: cp -a dist/ssr/functions .
# - run: cd dist/ssr/functions && yarn install && cd -
- name: publish
uses: cloudflare/pages-action@v1
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
accountId: ${{ inputs.account_id }}
projectName: ${{ inputs.project }}
directory: dist/spa
directory: dist/ssr
# Optional: Enable this if you want to have GitHub Deployments triggered
# gitHubToken: ${{ secrets.GITHUB_TOKEN }}
# the branch is used for the URL, it does not need to equal the current branch so we can
Expand Down
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ yarn lint
### Build the app for production
```bash
yarn build
cd dist/spa
cd dist/ss
quasar serve
```

Expand Down
11 changes: 0 additions & 11 deletions functions/testing.js

This file was deleted.

4 changes: 2 additions & 2 deletions netlify.toml
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
[build]
publish = "dist/spa"
publish = "dist/ssr"

[context.environment]
NODE_VERSION = "14"
NODE_VERSION = "16"

[[redirects]]
from = "/*"
Expand Down
8 changes: 6 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "telos-template",
"name": "teloscan",
"version": "1.4.4",
"description": "Teloscan block explorer",
"description": "Telos EVM block explorer",
"productName": "Teloscan",
"author": "Jesse Schulman <jesse@caleos.io>",
"private": true,
Expand Down Expand Up @@ -33,6 +33,8 @@
"fs": "^0.0.1-security",
"highlight.js": "10",
"highlightjs-solidity": "^2.0.3",
"isomorphic-fetch": "^3.0.0",
"localstorage-polyfill": "^1.0.1",
"moment": "^2.29.4",
"quasar": "2",
"ual-anchor": "^1.0.0",
Expand All @@ -50,7 +52,9 @@
"devDependencies": {
"@babel/core": "7.19.3",
"@babel/eslint-parser": "^7.13.14",
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@babel/preset-env": "7.19.3",
"@babel/regjsgen": "^0.8.0",
"@quasar/app-webpack": "3.6.2",
"@types/jest": "29.1.1",
"@types/lodash": "^4.14.182",
Expand Down
24 changes: 20 additions & 4 deletions quasar.conf.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
/* eslint-env node */

require('dotenv').config();
const env = require('./public/env')(process);
const env = require('./src/env/index.js');
const ESLintPlugin = require('eslint-webpack-plugin');
const nodePolyfillWebpackPlugin = require('node-polyfill-webpack-plugin');

Expand All @@ -30,8 +30,17 @@ module.exports = function(/* ctx */) {
// app boot file (/src/boot)
// --> boot files are part of "main.js"
// https://quasar.dev/quasar-cli/boot-files
boot: ['ual', 'hyperion', 'i18n', 'api', 'telosApi', 'evm', 'q-component-defaults'],

boot: [
{ path: 'ssr', client: false }, // this boot file gets embedded only on server-side
{ path: 'ual', server: false }, // this boot file gets embedded only on client-side
'hyperion',
'i18n',
'api',
'telosApi',
'evm',
'hyperion',
'q-component-defaults',
],
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
css: ['fonts/silka/silka.css', 'app.sass'],

Expand Down Expand Up @@ -102,7 +111,10 @@ module.exports = function(/* ctx */) {
// directives: [],

// Quasar plugins
plugins: ['Notify'],
plugins: [
'Notify',
'Meta',
],
},

// animations: 'all', // --- includes all animations
Expand All @@ -112,6 +124,10 @@ module.exports = function(/* ctx */) {
// https://quasar.dev/quasar-cli/developing-ssr/configuring-ssr
ssr: {
pwa: false,
middlewares: [
'compression', // TODO: maybe only this one when it's prod?
'render', // keep this as last one
],
},

// https://quasar.dev/quasar-cli/developing-pwa/configuring-pwa
Expand Down
8 changes: 8 additions & 0 deletions src-ssr/middlewares/compression.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import compression from 'compression';
import { ssrMiddleware } from 'quasar/wrappers';

export default ssrMiddleware(({ app }) => {
app.use(
compression({ threshold: 0 }),
);
});
56 changes: 56 additions & 0 deletions src-ssr/middlewares/render.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
import { RenderError } from '@quasar/app-webpack';
import { ssrMiddleware } from 'quasar/wrappers';

// This middleware should execute as last one
// since it captures everything and tries to
// render the page with Vue

export default ssrMiddleware(({ app, resolve, render, serve }) => {
// we capture any other Express route and hand it
// over to Vue and Vue Router to render our page
app.get(resolve.urlPath('*'), (req, res) => {
res.setHeader('Content-Type', 'text/html');

render(/* the ssrContext: */ { req, res })
.then((html) => {
// now let's send the rendered html to the client
res.send(html);
})
.catch((err: RenderError) => {
// oops, we had an error while rendering the page

// we were told to redirect to another URL
if (err.url) {
if (err.code) {
res.redirect(err.code, err.url);
} else {
res.redirect(err.url);
}
} else if (err.code === 404) {
// hmm, Vue Router could not find the requested route

// Should reach here only if no "catch-all" route
// is defined in /src/routes
res.status(404).send('404 | Page Not Found');
} else if (process.env.DEV) {
// well, we treat any other code as error;
// if we're in dev mode, then we can use Quasar CLI
// to display a nice error page that contains the stack
// and other useful information

// serve.error is available on dev only
serve.error({ err, req, res });
} else {
// we're in production, so we should have another method
// to display something to the client when we encounter an error
// (for security reasons, it's not ok to display the same wealth
// of information as we do in development)

// Render Error Page on production or
// create a route (/src/routes) for an error page and redirect to it
res.status(500).send('500 | Internal Server Error');
// console.error(err.stack)
}
});
});
});
12 changes: 12 additions & 0 deletions src-ssr/production-export.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/**
* Start the SSR server or export your handler for serverless use
* or export whatever else fits your needs.
*
* https://v2.quasar.dev/quasar-cli/developing-ssr/ssr-production-export
*
* This file is used ONLY on production.
*/

import { ssrProductionExport } from 'quasar/wrappers';

export default ssrProductionExport(async ({ ssrHandler }: { ssrHandler: unknown }) => ({ onRequest: ssrHandler }));
10 changes: 10 additions & 0 deletions src-ssr/ssr-flag.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/* eslint-disable */
// THIS FEATURE-FLAG FILE IS AUTOGENERATED,
// REMOVAL OR CHANGES WILL CAUSE RELATED TYPES TO STOP WORKING
import "quasar/dist/types/feature-flag";

declare module "quasar/dist/types/feature-flag" {
interface QuasarFeatureFlags {
ssr: true;
}
}
13 changes: 6 additions & 7 deletions src/boot/evm.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,15 +37,14 @@ class ProviderManager {
return providerContainer.provider;
}
}
export default boot(({ app, store }) => {
const hyperion = axios.create({
baseURL: process.env.NETWORK_EVM_ENDPOINT,
});

const hyperion = axios.create({
baseURL: process.env.NETWORK_EVM_ENDPOINT,
});

const contractManager = new ContractManager(hyperion);
contractManager.init();
const contractManager = new ContractManager(hyperion);
contractManager.init();

export default boot(({ app, store }) => {
store.$providerManager = app.config.globalProperties.$providerManager = new ProviderManager();
store.$evm = app.config.globalProperties.$evm = evm;
store.$evmEndpoint = app.config.globalProperties.$evmEndpoint = hyperion;
Expand Down
20 changes: 14 additions & 6 deletions src/boot/i18n.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,17 @@ import { boot } from 'quasar/wrappers';
import { createI18n } from 'vue-i18n';
import messages from 'src/i18n';

export default boot(({ app }) => {
// Get user's last chosen language from local storage
let lastChosenLanguage = localStorage.getItem('language');
export default boot(({ app, ssrContext }) => {
let lastChosenLanguage;

//if not present in local storage then check user browser language
if(!lastChosenLanguage) {
lastChosenLanguage = navigator.language.toLowerCase().split(/[_-]+/)[0];
if (!ssrContext) {
// Get user's last chosen language from local storage
lastChosenLanguage = localStorage.getItem('language');

//if not present in local storage then check user browser language
if (!lastChosenLanguage) {
lastChosenLanguage = navigator.language.toLowerCase().split(/[_-]+/)[0];
}
}
// Check if the browser language is supported, if not, fall back to 'en-us'
if(!Object.keys(messages).includes(lastChosenLanguage)) {
Expand All @@ -28,6 +32,10 @@ export default boot(({ app }) => {

// Listen for language-changed event
const setLocale = (newLanguage) => {
if (ssrContext) {
return;
}

const currentLanguage = localStorage.getItem('language');

if (newLanguage !== currentLanguage) {
Expand Down
4 changes: 2 additions & 2 deletions src/boot/q-component-defaults.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,13 +36,13 @@ function isTouchDevice() {
return mq(query);
}
// more info on params: https://v2.quasar.dev/quasar-cli/boot-files
export default boot((/* { app, router, ... } */) => {
export default boot(({ ssrContext }) => {
// https://github.com/quasarframework/quasar/discussions/8761#discussioncomment-1042529
// This addresses an issue with q-tooltip where the tooltip disappears almost instantly on mobile,
// while behaving as expected on desktop. Adding the hide-delay prop fixes mobile, but makes tooltips
// behave incorrectly (delaying tooltip close after mouseleave) for desktop. This solution is to simply set
// the default hide delay based on touch vs non-touch client. This value can then be overridden per-instance if
// required, as this only changes the default prop value
const tooltipHideDelay = isTouchDevice() ? 9999999 : undefined;
const tooltipHideDelay = !ssrContext && isTouchDevice() ? 9999999 : undefined;
setDefault(QTooltip, 'hideDelay', tooltipHideDelay);
});
13 changes: 13 additions & 0 deletions src/boot/ssr.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import { boot } from 'quasar/wrappers';
import env from 'src/env';

export default boot(async({ ssrContext }) => {
if (!ssrContext) {
return;
}

await import('localstorage-polyfill');
await import('isomorphic-fetch');

Object.assign(process.env, env);
});
5 changes: 5 additions & 0 deletions src/components/header/AppHeader.vue
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,17 @@ export default {
menuHiddenDesktop: false,
searchHiddenMobile: true,
isTestnet: process.env.NETWORK_EVM_CHAIN_ID !== 40,
isMounted: false,
}),
computed: {
...mapGetters('login', [
'isLoggedIn',
'isNative',
]),
},
mounted() {
this.isMounted = true;
},
methods: {
...mapMutations('login', [
'setLogin',
Expand Down Expand Up @@ -301,6 +305,7 @@ export default {
<q-separator class="c-header__menu-separator"/>

<li
v-if="isMounted"
class="c-header__menu-li"
tabindex="0"
aria-label="enable dark theme"
Expand Down
Loading

0 comments on commit 2ee5213

Please sign in to comment.