forked from cerc-io/laconic-console
Server Console App directly from the server.
Use Moustache to create template and set config in page. Use babel plugins to process GQL (and fix GQL queries). Added service type.
This commit is contained in:
richburdon
@@ -0,0 +1,16 @@
|
||||
//
|
||||
// Copyright 2020 DxOS.org
|
||||
//
|
||||
|
||||
import debug from 'debug';
|
||||
import React from 'react';
|
||||
import { render } from 'react-dom';
|
||||
|
||||
import { Main } from '@dxos/console-client';
|
||||
|
||||
// Load from global printed into HTML page via template.
|
||||
const { config } = window.__DXOS__;
|
||||
|
||||
debug.enable(config.system.debug);
|
||||
|
||||
render(<Main config={config} />, document.getElementById('root'));
|
||||
@@ -1,101 +0,0 @@
|
||||
//
|
||||
// Copyright 2020 DxOS.org
|
||||
//
|
||||
|
||||
import debug from 'debug';
|
||||
import express from 'express';
|
||||
import fs from 'fs';
|
||||
import path from 'path';
|
||||
import yaml from 'js-yaml';
|
||||
import { ApolloServer, gql } from 'apollo-server-express';
|
||||
import { print } from 'graphql/language';
|
||||
|
||||
import SYSTEM_STATUS from '@dxos/console-client/gql/system_status.graphql';
|
||||
|
||||
import { createResolvers } from './resolvers';
|
||||
|
||||
import SCHEMA from './gql/api.graphql';
|
||||
|
||||
const config = yaml.safeLoad(
|
||||
fs.readFileSync(path.join(__dirname, '../../../node_modules/@dxos/console-client/config.yml')));
|
||||
|
||||
const log = debug('dxos:console:server');
|
||||
|
||||
debug.enable(config.system.debug);
|
||||
|
||||
//
|
||||
// Express server.
|
||||
//
|
||||
|
||||
const app = express();
|
||||
|
||||
//
|
||||
// CORS
|
||||
//
|
||||
|
||||
// import cors from 'cors'
|
||||
// https://expressjs.com/en/resources/middleware/cors.html
|
||||
// https://www.prisma.io/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d
|
||||
// app.use(cors({
|
||||
// origin: true,
|
||||
// credentials: true
|
||||
// }));
|
||||
|
||||
//
|
||||
// React app
|
||||
//
|
||||
|
||||
const { app: { publicUrl } } = config;
|
||||
|
||||
// TODO(burdon): Load via WNS.
|
||||
app.get(`${publicUrl}(/:filePath)?`, (req, res) => {
|
||||
const { filePath = 'index.html' } = req.params;
|
||||
const file = path.join(__dirname, '../../../node_modules/@dxos/console-client/dist/production', filePath);
|
||||
res.sendFile(file);
|
||||
});
|
||||
|
||||
//
|
||||
// Apollo Server
|
||||
// https://www.apollographql.com/docs/apollo-server/api/apollo-server
|
||||
//
|
||||
|
||||
const server = new ApolloServer({
|
||||
typeDefs: SCHEMA,
|
||||
|
||||
resolvers: createResolvers(config),
|
||||
|
||||
// https://www.apollographql.com/docs/apollo-server/testing/graphql-playground
|
||||
// https://github.com/prisma-labs/graphql-playground#usage
|
||||
// introspection: true,
|
||||
playground: {
|
||||
settings: {
|
||||
'editor.theme': 'light'
|
||||
},
|
||||
tabs: [
|
||||
{
|
||||
name: 'Status',
|
||||
endpoint: config.api.path,
|
||||
query: print(gql(SYSTEM_STATUS))
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
//
|
||||
// Apollo middleware
|
||||
// https://www.apollographql.com/docs/apollo-server/api/apollo-server/#apolloserverapplymiddleware
|
||||
//
|
||||
|
||||
server.applyMiddleware({
|
||||
app,
|
||||
path: config.api.path
|
||||
});
|
||||
|
||||
//
|
||||
// Start server
|
||||
//
|
||||
|
||||
const { api: { port } } = config;
|
||||
app.listen({ port }, () => {
|
||||
log(`Running: http://localhost:${port}`);
|
||||
});
|
||||
@@ -0,0 +1,138 @@
|
||||
//
|
||||
// Copyright 2020 DxOS.org
|
||||
//
|
||||
|
||||
import bodyParser from 'body-parser';
|
||||
import debug from 'debug';
|
||||
import express from 'express';
|
||||
import mustache from 'mustache-express';
|
||||
import fs from 'fs';
|
||||
import yaml from 'js-yaml';
|
||||
import { ApolloServer, gql } from 'apollo-server-express';
|
||||
import { print } from 'graphql/language';
|
||||
import yargs from 'yargs';
|
||||
|
||||
import SYSTEM_STATUS from '@dxos/console-client/src/gql/system_status.graphql';
|
||||
|
||||
import { createResolvers } from './resolvers';
|
||||
|
||||
import SCHEMA from '../gql/api.graphql';
|
||||
|
||||
const argv = yargs
|
||||
.option('config', {
|
||||
alias: 'c',
|
||||
description: 'Config file',
|
||||
type: 'string'
|
||||
})
|
||||
.option('verbose', {
|
||||
alias: 'v',
|
||||
description: 'Verbse info',
|
||||
type: 'boolean'
|
||||
})
|
||||
.help()
|
||||
.alias('help', 'h')
|
||||
.argv;
|
||||
|
||||
const configFile = argv.config || process.env.CONFIG_FILE;
|
||||
if (!configFile) {
|
||||
yargs.showHelp();
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
const config = yaml.safeLoad(fs.readFileSync(configFile));
|
||||
|
||||
const log = debug('dxos:console:server');
|
||||
|
||||
debug.enable(config.system.debug);
|
||||
|
||||
if (argv.verbose) {
|
||||
log(JSON.stringify(config, undefined, 2));
|
||||
}
|
||||
|
||||
//
|
||||
// Express server.
|
||||
//
|
||||
|
||||
const app = express();
|
||||
|
||||
app.set('views', `${__dirname}/views`);
|
||||
app.set('view engine', 'mustache');
|
||||
app.engine('mustache', mustache());
|
||||
app.use(bodyParser.urlencoded({ extended: true }));
|
||||
|
||||
// TODO(burdon): Add react, webpack deps
|
||||
|
||||
// TODO(burdon): app.use(compression());
|
||||
|
||||
//
|
||||
// CORS
|
||||
//
|
||||
|
||||
// import cors from 'cors'
|
||||
// https://expressjs.com/en/resources/middleware/cors.html
|
||||
// https://www.prisma.io/blog/enabling-cors-for-express-graphql-apollo-server-1ef999bfb38d
|
||||
// app.use(cors({
|
||||
// origin: true,
|
||||
// credentials: true
|
||||
// }));
|
||||
|
||||
//
|
||||
// React app
|
||||
// TODO(burdon): Can we load this via WNS?
|
||||
//
|
||||
|
||||
const { app: { publicUrl } } = config;
|
||||
|
||||
const bundles = [
|
||||
'runtime', 'vendor', 'material-ui', 'dxos', 'main'
|
||||
];
|
||||
|
||||
app.use(`${publicUrl}/lib`, express.static('./dist/client'));
|
||||
|
||||
app.get(publicUrl, (req, res) => {
|
||||
res.render('console', {
|
||||
title: 'Console',
|
||||
container: 'root',
|
||||
config: JSON.stringify(config),
|
||||
scripts: bundles.map(bundle => ({ src: `${publicUrl}/lib/${bundle}.bundle.js` }))
|
||||
});
|
||||
});
|
||||
|
||||
//
|
||||
// Apollo Server and middleware
|
||||
// https://www.apollographql.com/docs/apollo-server/api/apollo-server
|
||||
// https://www.apollographql.com/docs/apollo-server/api/apollo-server/#apolloserverapplymiddleware
|
||||
//
|
||||
|
||||
const server = new ApolloServer({
|
||||
typeDefs: SCHEMA,
|
||||
|
||||
resolvers: createResolvers(config),
|
||||
|
||||
// https://www.apollographql.com/docs/apollo-server/testing/graphql-playground
|
||||
// https://github.com/prisma-labs/graphql-playground#usage
|
||||
// introspection: true,
|
||||
playground: {
|
||||
settings: {
|
||||
'editor.theme': config.app.theme
|
||||
},
|
||||
tabs: [
|
||||
{
|
||||
name: 'Status',
|
||||
endpoint: config.api.path,
|
||||
query: print(gql(SYSTEM_STATUS))
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
server.applyMiddleware({ app, path: config.api.path });
|
||||
|
||||
//
|
||||
// Start server
|
||||
//
|
||||
|
||||
const { api: { port } } = config;
|
||||
app.listen({ port }, () => {
|
||||
log(`Running: http://localhost:${port}`);
|
||||
});
|
||||
@@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>{{ title }}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="{{ container }}"></div>
|
||||
|
||||
<!-- Config loaded by client. -->
|
||||
<script charset="utf-8" type="application/javascript">
|
||||
window.__DXOS__ = { config: {{{ config }}} };
|
||||
</script>
|
||||
|
||||
<!-- React bundles. -->
|
||||
{{#scripts}}
|
||||
<script charset="utf-8" type="application/javascript" src="{{src}}"></script>
|
||||
{{/scripts}}
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user