chore(release): 0.0.15

Run sas code route

CHANGELOG.md

@@ -2,6 +2,38 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.0.15](https://github.com/sasjs/server/compare/v0.0.14...v0.0.15) (2022-01-06)
+
+
+### Bug Fixes
+
+* **studio:** web component updated ([2d77222](https://github.com/sasjs/server/commit/2d77222ae8a139acd9d96466d0e68291c4ebd70e))
+* updated route for sas code ([e1eb044](https://github.com/sasjs/server/commit/e1eb04494a5650726c95990f74fc719eced4ccb5))
+* **web:** autosave and autofocus ([51ee8c0](https://github.com/sasjs/server/commit/51ee8c0825f021d1d67b2d765d5b434cbf248a1f))
+* **web:** parsing of webout ([a115160](https://github.com/sasjs/server/commit/a1151606f21e0007e2b1ca1245d592d96866f62a))
+* **web:** sticky tabs on Studio + extra run code button removed ([450d99f](https://github.com/sasjs/server/commit/450d99f06e5929eb1679e6203284e4faa44e19b0))
+
+### [0.0.14](https://github.com/sasjs/server/compare/v0.0.13...v0.0.14) (2021-12-19)
+
+
+### Bug Fixes
+
+* actually a README change, the fix was in the previous commit (updating ms_webout) that should have been a PR, to trigger a release ([d86c841](https://github.com/sasjs/server/commit/d86c841f1fb94455ac3500f215a42b4acb8b0017))
+* bumping sasjs/core with adjustment to ms_webout() ([076b866](https://github.com/sasjs/server/commit/076b866c020fb017512c2764801022a57fe4cca8))
+* switch to main branch ([ceca370](https://github.com/sasjs/server/commit/ceca370e2757baf2e8ebb90dab6dfd27f7b990fc))
+
+### [0.0.13](https://github.com/sasjs/server/compare/v0.0.12...v0.0.13) (2021-12-16)
+
+
+### Features
+
+* **studio:** run selected code + open in studio ([27129a8](https://github.com/sasjs/server/commit/27129a8921084c72968383fdbc2ecbd2f417456c))
+
+
+### Bug Fixes
+
+* output for Studio ([e5be0e6](https://github.com/sasjs/server/commit/e5be0e678965b05c64bcc8f55c48a366e0ff55a3))
+
 ### [0.0.12](https://github.com/sasjs/server/compare/v0.0.11...v0.0.12) (2021-12-15)
 
 

README.md

@@ -8,6 +8,15 @@ SASjs Server provides a NodeJS wrapper for calling the SAS binary executable. It
 
 One major benefit of using SASjs Server (alongside other components of the SASjs framework such as the [CLI](https://cli.sasjs.io), [Adapter](https://adapter.sasjs.io) and [Core](https://core.sasjs.io) library) is that the projects you create can be very easily ported to SAS 9 (Stored Process server) or Viya (Job Execution server).
 
+## Installation
+
+Just download the relevant package from the [releases](https://github.com/sasjs/server/releases) page and trigger, either by double clicking (windows) or executing from commandline.
+
+You are presented with two prompts:
+
+* Location of your `sas.exe` / `sas.sh` executable
+* Path to a filesystem location for Stored Programs and temporary files
+
 ## Configuration
 
 Configuration is made in the `configuration` section of `package.json`:

api/.env.example

@@ -8,4 +8,4 @@ AUTH_CODE_SECRET=<secret>
 DB_CONNECT=mongodb+srv://<DB_USERNAME>:<DB_PASSWORD>@<CLUSTER>/<DB_NAME>?retryWrites=true&w=majority
 
 SAS_PATH=/opt/sas/sas9/SASHome/SASFoundation/9.4/sas
-SAS_DRIVE=./tmp
+DRIVE_PATH=./tmp

api/package.json

@@ -41,12 +41,12 @@
   },
   "release": {
     "branches": [
-      "master"
+      "main"
     ]
   },
   "author": "Analytium Ltd",
   "dependencies": {
-    "@sasjs/core": "^2.48.6",
+    "@sasjs/core": "^3.0.2",
     "@sasjs/utils": "2.34.1",
     "bcryptjs": "^2.4.3",
     "cors": "^2.8.5",

api/public/swagger.yaml

@@ -92,6 +92,16 @@ components:
                 - clientSecret
             type: object
             additionalProperties: false
+        ExecuteSASCodePayload:
+            properties:
+                code:
+                    type: string
+                    description: 'Code of SAS program'
+                    example: '* SAS Code HERE;'
+            required:
+                - code
+            type: object
+            additionalProperties: false
         MemberType.folder:
             enum:
                 - folder
@@ -501,6 +511,30 @@ paths:
                     application/json:
                         schema:
                             $ref: '#/components/schemas/ClientPayload'
+    /SASjsApi/code/execute:
+        post:
+            operationId: ExecuteSASCode
+            responses:
+                '200':
+                    description: Ok
+                    content:
+                        application/json:
+                            schema:
+                                type: string
+            description: 'Execute SAS code.'
+            summary: 'Run SAS Code and returns log'
+            tags:
+                - CODE
+            security:
+                -
+                    bearerAuth: []
+            parameters: []
+            requestBody:
+                required: true
+                content:
+                    application/json:
+                        schema:
+                            $ref: '#/components/schemas/ExecuteSASCodePayload'
     /SASjsApi/drive/deploy:
         post:
             operationId: Deploy
@@ -972,6 +1006,26 @@ paths:
                         format: double
                         type: number
                     example: '6789'
+    /SASjsApi/session:
+        get:
+            operationId: Session
+            responses:
+                '200':
+                    description: Ok
+                    content:
+                        application/json:
+                            schema:
+                                $ref: '#/components/schemas/UserResponse'
+                            examples:
+                                'Example 1':
+                                    value: {id: 123, username: johnusername, displayName: John}
+            summary: 'Get session info (username).'
+            tags:
+                - Session
+            security:
+                -
+                    bearerAuth: []
+            parameters: []
     /SASjsApi/stp/execute:
         get:
             operationId: ExecuteReturnRaw
@@ -1027,26 +1081,6 @@ paths:
                     application/json:
                         schema:
                             $ref: '#/components/schemas/ExecuteReturnJsonPayload'
-    /SASjsApi/session:
-        get:
-            operationId: Session
-            responses:
-                '200':
-                    description: Ok
-                    content:
-                        application/json:
-                            schema:
-                                $ref: '#/components/schemas/UserResponse'
-                            examples:
-                                'Example 1':
-                                    value: {id: 123, username: johnusername, displayName: John}
-            summary: 'Get session info (username).'
-            tags:
-                - Session
-            security:
-                -
-                    bearerAuth: []
-            parameters: []
 servers:
     -
         url: /
@@ -1072,3 +1106,6 @@ tags:
     -
         name: STP
         description: 'Operations about STP'
+    -
+        name: CODE
+        description: 'Operations on SAS code'

api/src/controllers/code.ts

@@ -0,0 +1,63 @@
+import express from 'express'
+import { Request, Security, Route, Tags, Post, Body } from 'tsoa'
+import { ExecutionController } from './internal'
+import { PreProgramVars } from '../types'
+
+interface ExecuteSASCodePayload {
+  /**
+   * Code of SAS program
+   * @example "* SAS Code HERE;"
+   */
+  code: string
+}
+
+@Security('bearerAuth')
+@Route('SASjsApi/code')
+@Tags('CODE')
+export class CodeController {
+  /**
+   * Execute SAS code.
+   * @summary Run SAS Code and returns log
+   */
+  @Post('/execute')
+  public async executeSASCode(
+    @Request() request: express.Request,
+    @Body() body: ExecuteSASCodePayload
+  ): Promise<string> {
+    return executeSASCode(request, body)
+  }
+}
+
+const executeSASCode = async (req: any, { code }: ExecuteSASCodePayload) => {
+  try {
+    const result = await new ExecutionController().executeProgram(
+      code,
+      getPreProgramVariables(req),
+      { ...req.query, _debug: 131 },
+      undefined,
+      true
+    )
+
+    return result as string
+  } catch (err: any) {
+    throw {
+      code: 400,
+      status: 'failure',
+      message: 'Job execution failed.',
+      error: typeof err === 'object' ? err.toString() : err
+    }
+  }
+}
+
+const getPreProgramVariables = (req: any): PreProgramVars => {
+  const host = req.get('host')
+  const protocol = req.protocol + '://'
+  const { user, accessToken } = req
+  return {
+    username: user.username,
+    userId: user.userId,
+    displayName: user.displayName,
+    serverUrl: protocol + host,
+    accessToken
+  }
+}

api/src/controllers/index.ts

@@ -1,7 +1,8 @@
 export * from './auth'
 export * from './client'
+export * from './code'
 export * from './drive'
 export * from './group'
+export * from './session'
 export * from './stp'
 export * from './user'
-export * from './session'

api/src/controllers/internal/Execution.ts

@@ -6,7 +6,7 @@ import { PreProgramVars, TreeNode } from '../../types'
 import { generateFileUploadSasCode, getTmpFilesFolderPath } from '../../utils'
 
 export class ExecutionController {
-  async execute(
+  async executeFile(
     programPath: string,
     preProgramVariables: PreProgramVars,
     vars: { [key: string]: string | number | undefined },
@@ -16,8 +16,23 @@ export class ExecutionController {
     if (!(await fileExists(programPath)))
       throw 'ExecutionController: SAS file does not exist.'
 
-    let program = await readFile(programPath)
+    const program = await readFile(programPath)
 
+    return this.executeProgram(
+      program,
+      preProgramVariables,
+      vars,
+      otherArgs,
+      returnJson
+    )
+  }
+  async executeProgram(
+    program: string,
+    preProgramVariables: PreProgramVars,
+    vars: { [key: string]: string | number | undefined },
+    otherArgs?: any,
+    returnJson?: boolean
+  ) {
     const sessionController = getSessionController()
 
     const session = await sessionController.getSession()

api/src/controllers/internal/Session.ts

@@ -110,7 +110,7 @@ export class SessionController {
 
     // TODO: don't wait forever
     while ((await fileExists(codeFilePath)) && !session.crashed) {}
-    console.log('session crashed?', !!session.crashed, session.crashed)
+    console.log('session crashed?', !!session.crashed, session.crashed || '')
 
     session.ready = true
     return Promise.resolve(session)

api/src/controllers/stp.ts

@@ -40,6 +40,7 @@ export class STPController {
   ): Promise<string> {
     return executeReturnRaw(request, _program)
   }
+
   /**
    * Trigger a SAS program using it's location in the _program parameter.
    * Enable debugging using the _debug parameter.
@@ -72,7 +73,7 @@ const executeReturnRaw = async (
       .replace(new RegExp('/', 'g'), path.sep) + '.sas'
 
   try {
-    const result = await new ExecutionController().execute(
+    const result = await new ExecutionController().executeFile(
       sasCodePath,
       getPreProgramVariables(req),
       query
@@ -101,7 +102,7 @@ const executeReturnJson = async (
   const filesNamesMap = req.files?.length ? makeFilesNamesMap(req.files) : null
 
   try {
-    const { webout, log } = (await new ExecutionController().execute(
+    const { webout, log } = (await new ExecutionController().executeFile(
       sasCodePath,
       getPreProgramVariables(req),
       { ...req.query, ...req.body },

api/src/routes/api/code.ts

@@ -0,0 +1,25 @@
+import express from 'express'
+import { runSASValidation } from '../../utils'
+import { CodeController } from '../../controllers/'
+
+const runRouter = express.Router()
+
+const controller = new CodeController()
+
+runRouter.post('/execute', async (req, res) => {
+  const { error, value: body } = runSASValidation(req.body)
+  if (error) return res.status(400).send(error.details[0].message)
+
+  try {
+    const response = await controller.executeSASCode(req, body)
+    res.send(response)
+  } catch (err: any) {
+    const statusCode = err.code
+
+    delete err.code
+
+    res.status(statusCode).send(err)
+  }
+})
+
+export default runRouter

api/src/routes/api/index.ts

@@ -11,6 +11,7 @@ import {
 
 import driveRouter from './drive'
 import stpRouter from './stp'
+import codeRouter from './code'
 import userRouter from './user'
 import groupRouter from './group'
 import clientRouter from './client'
@@ -31,6 +32,7 @@ router.use(
 router.use('/drive', authenticateAccessToken, driveRouter)
 router.use('/group', desktopRestrict, groupRouter)
 router.use('/stp', authenticateAccessToken, stpRouter)
+router.use('/code', authenticateAccessToken, codeRouter)
 router.use('/user', desktopRestrict, userRouter)
 router.use(
   '/',

api/src/routes/api/stp.ts

@@ -1,5 +1,5 @@
 import express from 'express'
-import { executeProgramRawValidation } from '../../utils'
+import { executeProgramRawValidation, runSASValidation } from '../../utils'
 import { STPController } from '../../controllers/'
 import { FileUploadController } from '../../controllers/internal'
 

api/src/utils/connectDB.ts

@@ -8,7 +8,10 @@ import { getRealPath } from '@sasjs/utils'
 export const connectDB = async () => {
   // NOTE: when exporting app.js as agent for supertest
   // we should exlcude connecting to the real database
-  if (process.env.NODE_ENV !== 'test') {
+  if (process.env.NODE_ENV === 'test') {
+    process.driveLoc = path.join(process.cwd(), 'tmp')
+    return
+  } else {
     const { MODE } = process.env
 
     if (MODE?.trim() !== 'server') {

api/src/utils/validation.ts

@@ -77,6 +77,11 @@ export const updateFileDriveValidation = (data: any): Joi.ValidationResult =>
     fileContent: Joi.string().required()
   }).validate(data)
 
+export const runSASValidation = (data: any): Joi.ValidationResult =>
+  Joi.object({
+    code: Joi.string().required()
+  }).validate(data)
+
 export const executeProgramRawValidation = (data: any): Joi.ValidationResult =>
   Joi.object({
     _program: Joi.string().required()

api/tsoa.json

@@ -38,6 +38,10 @@
       {
         "name": "STP",
         "description": "Operations about STP"
+      },
+      {
+        "name": "CODE",
+        "description": "Operations on SAS code"
       }
     ],
     "yaml": true,

docker-compose.yml

@@ -43,7 +43,7 @@ services:
       - ./web:/usr/server/web
 
   mongodb:
-    image: mongo:latest
+    image: mongo:5.0.4
     ports:
       - 27017:27017
     volumes:

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "server",
-  "version": "0.0.12",
+  "version": "0.0.15",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "server",
-      "version": "0.0.12",
+      "version": "0.0.15",
       "devDependencies": {
         "prettier": "^2.3.1",
         "standard-version": "^9.3.2"

package.json

@@ -1,7 +1,8 @@
 {
   "name": "server",
-  "version": "0.0.12",
+  "version": "0.0.15",
   "description": "NodeJS wrapper for calling the SAS binary executable",
+  "repository": "https://github.com/sasjs/server",
   "scripts": {
     "server": "npm run server:prepare && npm run server:start",
     "server:prepare": "cd web && npm ci && npm run build && cd ../api && npm ci && cd ..",

web/src/components/home.tsx

@@ -23,7 +23,7 @@ const Home = () => {
         and contributions are welcomed.
       </p>
       <p>
-        SASjs Server is maintained by the SASjs Apps team -{' '}
+        SASjs Server is maintained by the SAS Apps team -{' '}
         <a
           href="https://sasapps.io/contact-us"
           target="_blank"

web/src/containers/Drive/main.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react'
+import { Link } from 'react-router-dom'
 import axios from 'axios'
 
 import Editor from '@monaco-editor/react'
@@ -89,10 +90,10 @@ const Main = (props: any) => {
             style={{ position: 'absolute', left: '50%', top: '50%' }}
           />
         )}
-        {!isLoading && props?.selectedFilePath !== '' && !editMode && (
+        {!isLoading && props?.selectedFilePath && !editMode && (
           <code style={{ whiteSpace: 'break-spaces' }}>{fileContent}</code>
         )}
-        {!isLoading && props?.selectedFilePath !== '' && editMode && (
+        {!isLoading && props?.selectedFilePath && editMode && (
           <Editor
             height="95%"
             value={fileContent}
@@ -110,17 +111,26 @@ const Main = (props: any) => {
         <Button
           variant="contained"
           onClick={handleEditSaveBtnClick}
-          disabled={isLoading || props?.selectedFilePath === ''}
+          disabled={isLoading || !props?.selectedFilePath}
         >
           {!editMode ? 'Edit' : 'Save'}
         </Button>
         <Button
           variant="contained"
           onClick={handleCancelExecuteBtnClick}
-          disabled={isLoading || props?.selectedFilePath === ''}
+          disabled={isLoading || !props?.selectedFilePath}
         >
           {editMode ? 'Cancel' : 'Execute'}
         </Button>
+        {props?.selectedFilePath && (
+          <Button
+            variant="contained"
+            component={Link}
+            to={`/SASjsStudio?_program=${props.selectedFilePath}`}
+          >
+            Open in Studio
+          </Button>
+        )}
       </Stack>
     </Box>
   )

web/src/containers/Studio/index.tsx

@@ -1,14 +1,165 @@
-import React from 'react'
+import React, { useEffect, useRef, useState } from 'react'
+import axios from 'axios'
 
-import CssBaseline from '@mui/material/CssBaseline'
 import Box from '@mui/material/Box'
+import { Button, Paper, Stack, Tab } from '@mui/material'
+import { makeStyles } from '@mui/styles'
+import Editor, { OnMount } from '@monaco-editor/react'
+import { useLocation } from 'react-router-dom'
+import { TabContext, TabList, TabPanel } from '@mui/lab'
+
+const useStyles = makeStyles(() => ({
+  root: {
+    fontSize: '1rem',
+    color: 'gray',
+    '&.Mui-selected': {
+      color: 'black'
+    }
+  }
+}))
 
 const Studio = () => {
+  const location = useLocation()
+  const [fileContent, setFileContent] = useState('')
+  const [log, setLog] = useState('')
+  const [webout, setWebout] = useState('')
+  const [tab, setTab] = React.useState('1')
+  const handleTabChange = (_e: any, newValue: string) => {
+    setTab(newValue)
+  }
+
+  const editorRef = useRef(null as any)
+  const handleEditorDidMount: OnMount = (editor) => {
+    editor.focus()
+    editorRef.current = editor
+  }
+
+  const getSelection = () => {
+    const editor = editorRef.current as any
+    const selection = editor?.getModel().getValueInRange(editor?.getSelection())
+    return selection ?? ''
+  }
+
+  const handleRunBtnClick = () => runCode(getSelection() || fileContent)
+
+  const runCode = (code: string) => {
+    axios
+      .post(`/SASjsApi/code/execute`, { code })
+      .then((res: any) => {
+        setLog(`<div><h2>SAS Log</h2><pre>${res?.data?.log}</pre></div>`)
+
+        let weboutString: string
+        try {
+          weboutString = res.data.webout
+            .split('>>weboutBEGIN<<')[1]
+            .split('>>weboutEND<<')[0]
+        } catch (_) {
+          weboutString = res?.data?.webout ?? ''
+        }
+
+        let webout: string
+        try {
+          webout = JSON.stringify(JSON.parse(weboutString), null, 4)
+        } catch (_) {
+          webout = weboutString
+        }
+
+        setWebout(`<pre><code>${webout}</code></pre>`)
+        setTab('2')
+      })
+      .catch((err) => console.log(err))
+  }
+
+  useEffect(() => {
+    const content = localStorage.getItem('fileContent') ?? ''
+    setFileContent(content)
+  }, [])
+
+  useEffect(() => {
+    if (fileContent.length) {
+      localStorage.setItem('fileContent', fileContent)
+    }
+  }, [fileContent])
+
+  useEffect(() => {
+    const params = new URLSearchParams(location.search)
+    const programPath = params.get('_program')
+
+    if (programPath?.length)
+      axios
+        .get(`/SASjsApi/drive/file?filePath=${programPath}`)
+        .then((res: any) => setFileContent(res.data.fileContent))
+        .catch((err) => console.log(err))
+  }, [location.search])
+
+  const classes = useStyles()
   return (
-    <Box className="main">
-      <CssBaseline />
-      <h2>This is container for SASjs studio</h2>
+    <>
+      <br />
+      <br />
+      <br />
+      <Box sx={{ width: '100%', typography: 'body1' }}>
+        <TabContext value={tab}>
+          <Box
+            sx={{
+              borderBottom: 1,
+              borderColor: 'divider'
+            }}
+            style={{ position: 'fixed', background: 'white', width: '100%' }}
+          >
+            <TabList onChange={handleTabChange} centered>
+              <Tab className={classes.root} label="Code" value="1" />
+              <Tab className={classes.root} label="Log" value="2" />
+              <Tab className={classes.root} label="Webout" value="3" />
+            </TabList>
           </Box>
+          <TabPanel value="1">
+            {/* <Toolbar /> */}
+            <Paper
+              sx={{
+                height: '70vh',
+                marginTop: '50px',
+                padding: '10px',
+                overflow: 'auto',
+                position: 'relative'
+              }}
+              elevation={3}
+            >
+              <Editor
+                height="95%"
+                value={fileContent}
+                onMount={handleEditorDidMount}
+                onChange={(val) => {
+                  if (val) setFileContent(val)
+                }}
+              />
+            </Paper>
+            <Stack
+              spacing={3}
+              direction="row"
+              sx={{ justifyContent: 'center', marginTop: '20px' }}
+            >
+              <Button variant="contained" onClick={handleRunBtnClick}>
+                Run SAS Code
+              </Button>
+            </Stack>
+          </TabPanel>
+          <TabPanel value="2">
+            <div
+              id="sas_log"
+              style={{ marginTop: '50px' }}
+              dangerouslySetInnerHTML={{ __html: log }}
+            />
+          </TabPanel>
+          <TabPanel value="3">
+            <div
+              style={{ marginTop: '50px' }}
+              dangerouslySetInnerHTML={{ __html: webout }}
+            />
+          </TabPanel>
+        </TabContext>
+      </Box>
+    </>
   )
 }