Skip to content

Commit

Permalink
inital setup of apollo alient and getting all cypher scripts and dele…
Browse files Browse the repository at this point in the history
…ting a file
  • Loading branch information
Jas Kuner committed Sep 24, 2020
1 parent 7faf18e commit 100deb7
Show file tree
Hide file tree
Showing 8 changed files with 641 additions and 348 deletions.
6 changes: 5 additions & 1 deletion build_scripts/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,10 @@ module.exports = {
host: '0.0.0.0',
port: 8080,
disableHostCheck: true,
hot: !helpers.isProduction
hot: !helpers.isProduction,
proxy: {
context: ['/graphql', '/files'],
target: 'http://localhost:3000'
}
}
}
6 changes: 5 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@
"@testing-library/jest-dom": "^5.3.0",
"@testing-library/react": "^9.0.1",
"@testing-library/react-hooks": "^2.0.1",
"@types/apollo-upload-client": "^14.1.0",
"@types/jest": "^24.9.0",
"@types/react": "^16.9.23",
"@types/react-redux": "^7.1.9",
Expand Down Expand Up @@ -140,12 +141,14 @@
"xml2js": "^0.4.19"
},
"dependencies": {
"@apollo/client": "^3.2.0",
"@literal-jsx/parser": "^0.1.7",
"@mdx-js/runtime": "^1.6.1",
"@neo4j/browser-lambda-parser": "1.0.5",
"@relate-by-ui/css": "1.0.5",
"@relate-by-ui/relatable": "1.0.1",
"@relate-by-ui/saved-scripts": "^1.0.4",
"apollo-upload-client": "^14.1.2",
"ascii-data-table": "^2.1.1",
"canvg": "^1.5.3",
"codemirror": "^5.29.0",
Expand All @@ -156,6 +159,7 @@
"deepmerge": "^2.1.1",
"file-saver": "^1.3.8",
"firebase": "^7.13.1",
"graphql": "^15.3.0",
"isomorphic-fetch": "^2.2.1",
"jsonic": "^0.3.0",
"jszip": "^3.2.2",
Expand All @@ -165,7 +169,7 @@
"react": "^16.9.0",
"react-dnd": "9.3.2",
"react-dnd-html5-backend": "9.3.2",
"react-dom": "^16.8.1",
"react-dom": "^16.9.0",
"react-redux": "^5.0.7",
"react-spring": "^8.0.27",
"react-suber": "1.0.4",
Expand Down
22 changes: 21 additions & 1 deletion src/browser/AppInit.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@ import { BusProvider } from 'react-suber'
import App from './modules/App/App'
import reducers from 'shared/rootReducer'
import epics from 'shared/rootEpic'
import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client'
import { createUploadLink } from 'apollo-upload-client'

import { createReduxMiddleware, getAll, applyKeys } from 'services/localstorage'
import { APP_START } from 'shared/modules/app/appDuck'
Expand Down Expand Up @@ -89,13 +91,31 @@ const url = window.location.href
// Signal app upstart (for epics)
store.dispatch({ type: APP_START, url, env })

// @todo: will clean this up in later work
// Apollo Client (https://medium.com/@enespalaz/file-upload-with-graphql-9a4927775ef7)
const apolloCache = new InMemoryCache()

const uploadLink = createUploadLink({
uri: '/graphql',
headers: {
'keep-alive': 'true'
}
})

const client = new ApolloClient({
cache: apolloCache,
link: uploadLink
})

const AppInit = () => {
return (
<Provider store={store}>
<BusProvider bus={bus}>
<>
<GlobalStyle />
<App />
<ApolloProvider client={client}>
<App />
</ApolloProvider>
</>
</BusProvider>
</Provider>
Expand Down
2 changes: 2 additions & 0 deletions src/browser/modules/Sidebar/Sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ import DocumentsDrawer from './Documents'
import AboutDrawer from './About'
import SettingsDrawer from './Settings'
import Favorites from './favorites'
import RelateScripts from './relate-scripts'
import StaticScripts from './static-scripts'
import TabNavigation from 'browser-components/TabNavigation/Navigation'
import { DrawerHeader } from 'browser-components/drawer'
Expand Down Expand Up @@ -89,6 +90,7 @@ const Sidebar = ({
<>
<DrawerHeader>Favorites</DrawerHeader>
<Favorites />
<RelateScripts />
{showStaticScripts && <StaticScripts />}
</>
)
Expand Down
3 changes: 2 additions & 1 deletion src/browser/modules/Sidebar/favorites.js
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,8 @@ const mapFavoritesStateToProps = state => {
return {
scriptsNamespace: SLASH,
scripts,
folders
folders,
title: 'Local Cache Scripts'
}
}
const mapFavoritesDispatchToProps = (dispatch, ownProps) => ({
Expand Down
157 changes: 157 additions & 0 deletions src/browser/modules/Sidebar/relate-scripts.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,157 @@
/*
* Copyright (c) 2002-2020 "Neo4j,"
* Neo4j Sweden AB [http://neo4j.com]
* This file is part of Neo4j.
* Neo4j is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*
*/

import React, { useEffect, useState, useRef } from 'react'
import { withBus } from 'react-suber'
import { connect } from 'react-redux'
import MyScripts from '@relate-by-ui/saved-scripts'
import { useQuery, gql, useMutation, NetworkStatus } from '@apollo/client'
import path from 'path'

import * as editor from 'shared/modules/editor/editorDuck'
import { executeCommand } from 'shared/modules/commands/commandsDuck'
import { SLASH } from 'shared/services/export-favorites'
import {
getProjectFilesQueryVars,
removeProjectFileMutationVars,
mapRelateFavorites
} from './relate-scripts.utils'

const GET_PROJECT_FILES = gql`
query GetProject($projectId: String!, $filterValue: String!) {
getProject(name: $projectId) {
files(
filters: [{ field: "extension", type: EQUALS, value: $filterValue }]
) {
name
directory
extension
downloadToken
}
}
}
`
const DELETE_PROJECT_FILE = gql`
mutation RemoveFile($projectId: String!, $filePath: String!) {
removeProjectFile(name: $projectId, filePath: $filePath) {
name
directory
}
}
`

const MyScriptsComponent = props => {
// @todo: handling loading and error?? Pass to MyScripts??
const { loading, error, data, refetch } = useQuery(GET_PROJECT_FILES, {
variables: getProjectFilesQueryVars
})
const [removeFavorite] = useMutation(DELETE_PROJECT_FILE)

const [scripts, setScripts] = useState([])
const isMountedRef = useRef(false)

useEffect(() => {
isMountedRef.current = true
if (data) {
// get cypher file contents
const getRelateFilePromises = data.getProject.files.map(file =>
mapRelateFavorites(file)
)
Promise.all(getRelateFilePromises).then(mappedRelateFiles => {
if (isMountedRef.current) {
setScripts([...mappedRelateFiles])
}
})
}
// cleanup to prevent setting state on unmounted component
return () => (isMountedRef.current = false)
}, [data])

useEffect(() => {
// refetch only once sidebar is closed once
// i.e. 'data' is already present
if (data && refetch) {
refetch()
}
}, [])

return MyScripts({
...props,
scripts,
isRelateScripts: true,
onRemoveScript: favorite => {
const directory = favorite.path.substring(1) // @todo: adding in SLASH to path
const filePath = path.join(directory, favorite.name)
return removeFavorite({
variables: removeProjectFileMutationVars(filePath),
update: (cache, { data: { removeProjectFile } }) => {
const data = cache.readQuery({
query: GET_PROJECT_FILES,
variables: getProjectFilesQueryVars
})
const filteredProjectFiles = data.getProject.files.filter(
file =>
file.directory !== removeProjectFile.directory ||
file.name !== removeProjectFile.name
)
cache.writeQuery({
query: GET_PROJECT_FILES,
data: {
getProject: {
files: filteredProjectFiles
}
},
variables: getProjectFilesQueryVars
})
}
})
}
})
}

const mapFavoritesStateToProps = state => {
return {
scriptsNamespace: SLASH,
title: 'Project Scripts'
}
}
const mapFavoritesDispatchToProps = (dispatch, ownProps) => ({
onSelectScript: favorite =>
ownProps.bus.send(
editor.EDIT_CONTENT,
editor.editContent(favorite.id, favorite.contents)
),
onExecScript: favorite => dispatch(executeCommand(favorite.contents)),
onExportScripts: Function.prototype,
onUpdateFolder: Function.prototype,
onRemoveFolder: Function.prototype
})
const mergeProps = (stateProps, dispatchProps) => {
return {
...stateProps,
...dispatchProps
}
}
const RelateScripts = withBus(
connect(
mapFavoritesStateToProps,
mapFavoritesDispatchToProps,
mergeProps
)(MyScriptsComponent)
)

export default RelateScripts
34 changes: 34 additions & 0 deletions src/browser/modules/Sidebar/relate-scripts.utils.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import remote from 'services/remote'
import { SLASH, CYPHER_FILE_EXTENSION } from 'shared/services/export-favorites'
import { pick } from 'lodash-es'
import uuid from 'uuid'

// @todo: Add documentation...

// will be a function once projectId is available
export const getProjectFilesQueryVars = {
projectId: 'project-03688c10-a811-4c0c-85d4-581e88c2183a',
filterValue: CYPHER_FILE_EXTENSION
}

export const removeProjectFileMutationVars = filePath => ({
...pick(getProjectFilesQueryVars, ['projectId']),
filePath
})

export const mapRelateFavorites = async ({
downloadToken,
name,
directory
}) => ({
id: uuid.v4(),
name,
path: directory.startsWith('.') ? SLASH : `${SLASH}${directory}`, // @todo: need to look into this
contents: await getProjectCypherFileContents(downloadToken, name)
})

const getProjectCypherFileContents = (token, name) =>
remote
.request('GET', `/files/${token}/${name}`)
.then(body => body.text())
.catch(e => console.log('++err', e)) // ?
Loading

0 comments on commit 100deb7

Please sign in to comment.