Initial Collection State System implementation
Co-authored-by: Liyas Thomas <hi@liyasthomas.com>
This commit is contained in:
579
newstore/collections.ts
Normal file
579
newstore/collections.ts
Normal file
@@ -0,0 +1,579 @@
|
||||
import { pluck } from "rxjs/operators"
|
||||
import DispatchingStore, { defineDispatchers } from "./DispatchingStore"
|
||||
|
||||
interface Collection {
|
||||
name: string
|
||||
folders: Collection[]
|
||||
requests: any[]
|
||||
}
|
||||
|
||||
const defaultRESTCollectionState = {
|
||||
state: [
|
||||
<Collection>{
|
||||
name: "My Collection",
|
||||
folders: [],
|
||||
requests: [],
|
||||
},
|
||||
],
|
||||
}
|
||||
|
||||
const defaultGraphqlCollectionState = {
|
||||
state: [
|
||||
<Collection>{
|
||||
name: "My GraphQL Collection",
|
||||
folders: [],
|
||||
requests: [],
|
||||
},
|
||||
],
|
||||
}
|
||||
|
||||
type RESTCollectionStoreType = typeof defaultRESTCollectionState
|
||||
type GraphqlCollectionStoreType = typeof defaultGraphqlCollectionState
|
||||
|
||||
type CollectionStoreType = RESTCollectionStoreType | GraphqlCollectionStoreType
|
||||
|
||||
function navigateToFolderWithIndexPath(
|
||||
collections: Collection[],
|
||||
indexPaths: number[]
|
||||
) {
|
||||
if (indexPaths.length === 0) return null
|
||||
|
||||
let target = collections[indexPaths.shift() as number]
|
||||
|
||||
while (indexPaths.length > 0)
|
||||
target = target.folders[indexPaths.shift() as number]
|
||||
|
||||
return target !== undefined ? target : null
|
||||
}
|
||||
|
||||
const collectionDispatchers = defineDispatchers({
|
||||
setCollections(
|
||||
_: CollectionStoreType,
|
||||
{ entries }: { entries: Collection[] }
|
||||
) {
|
||||
return {
|
||||
state: entries,
|
||||
}
|
||||
},
|
||||
|
||||
appendCollections(
|
||||
{ state }: CollectionStoreType,
|
||||
{ entries }: { entries: Collection[] }
|
||||
) {
|
||||
return {
|
||||
state: [...state, ...entries],
|
||||
}
|
||||
},
|
||||
|
||||
addCollection(
|
||||
{ state }: CollectionStoreType,
|
||||
{ collection }: { collection: Collection }
|
||||
) {
|
||||
return {
|
||||
state: [...state, collection],
|
||||
}
|
||||
},
|
||||
|
||||
removeCollection(
|
||||
{ state }: CollectionStoreType,
|
||||
{ collectionIndex }: { collectionIndex: number }
|
||||
) {
|
||||
return {
|
||||
state: state.filter((_, i) => i !== collectionIndex),
|
||||
}
|
||||
},
|
||||
|
||||
editCollection(
|
||||
{ state }: CollectionStoreType,
|
||||
{
|
||||
collectionIndex,
|
||||
collection,
|
||||
}: { collectionIndex: number; collection: Collection }
|
||||
) {
|
||||
return {
|
||||
state: state.map((col, index) =>
|
||||
index === collectionIndex ? collection : col
|
||||
),
|
||||
}
|
||||
},
|
||||
|
||||
addFolder(
|
||||
{ state }: CollectionStoreType,
|
||||
{ name, path }: { name: string; path: string }
|
||||
) {
|
||||
const newFolder: Collection = {
|
||||
name,
|
||||
folders: [],
|
||||
requests: [],
|
||||
}
|
||||
|
||||
const newState = state
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
const target = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (target === null) {
|
||||
console.log(`Could not parse path '${path}'. Ignoring add folder request`)
|
||||
return {}
|
||||
}
|
||||
|
||||
target.folders.push(newFolder)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
|
||||
editFolder(
|
||||
{ state }: CollectionStoreType,
|
||||
{ path, folder }: { path: string; folder: string }
|
||||
) {
|
||||
const newState = state
|
||||
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
const target = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (target === null) {
|
||||
console.log(
|
||||
`Could not parse path '${path}'. Ignoring edit folder request`
|
||||
)
|
||||
return {}
|
||||
}
|
||||
|
||||
Object.assign(target, folder)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
|
||||
removeFolder({ state }: CollectionStoreType, { path }: { path: string }) {
|
||||
const newState = state
|
||||
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
if (indexPaths.length === 0) {
|
||||
console.log(
|
||||
"Given path too short. If this is a collection, use removeCollection dispatcher instead. Skipping request."
|
||||
)
|
||||
return {}
|
||||
}
|
||||
// We get the index path to the folder itself,
|
||||
// we have to find the folder containing the target folder,
|
||||
// so we pop the last path index
|
||||
const folderIndex = indexPaths.pop() as number
|
||||
|
||||
const containingFolder = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (containingFolder === null) {
|
||||
console.log(
|
||||
`Could not resolve path '${path}'. Skipping removeFolder dispatch.`
|
||||
)
|
||||
return {}
|
||||
}
|
||||
|
||||
containingFolder.folders.splice(folderIndex, 1)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
|
||||
editRequest(
|
||||
{ state }: CollectionStoreType,
|
||||
{
|
||||
path,
|
||||
requestIndex,
|
||||
requestNew,
|
||||
}: { path: string; requestIndex: number; requestNew: any }
|
||||
) {
|
||||
const newState = state
|
||||
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
const targetLocation = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (targetLocation === null) {
|
||||
console.log(
|
||||
`Could not resolve path '${path}'. Ignoring editRequest dispatch.`
|
||||
)
|
||||
|
||||
return {}
|
||||
}
|
||||
|
||||
targetLocation.requests = targetLocation.requests.map((req, index) =>
|
||||
index !== requestIndex ? req : requestNew
|
||||
)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
|
||||
saveRequestAs(
|
||||
{ state }: CollectionStoreType,
|
||||
{ path, request }: { path: string; request: any }
|
||||
) {
|
||||
const newState = state
|
||||
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
const targetLocation = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (targetLocation === null) {
|
||||
console.log(
|
||||
`Could not resolve path '${path}'. Ignoring saveRequestAs dispatch.`
|
||||
)
|
||||
|
||||
return {}
|
||||
}
|
||||
|
||||
targetLocation.requests.push(request)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
|
||||
removeRequest(
|
||||
{ state }: CollectionStoreType,
|
||||
{ path, requestIndex }: { path: string; requestIndex: number }
|
||||
) {
|
||||
const newState = state
|
||||
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
const targetLocation = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (targetLocation === null) {
|
||||
console.log(
|
||||
`Could not resolve path '${path}'. Ignoring removeRequest dispatch.`
|
||||
)
|
||||
|
||||
return {}
|
||||
}
|
||||
|
||||
targetLocation.requests.splice(requestIndex, 1)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
|
||||
moveRequest(
|
||||
{ state }: CollectionStoreType,
|
||||
{
|
||||
path,
|
||||
requestIndex,
|
||||
destinationPath,
|
||||
}: { path: string; requestIndex: number; destinationPath: string }
|
||||
) {
|
||||
const newState = state
|
||||
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
const targetLocation = navigateToFolderWithIndexPath(newState, indexPaths)
|
||||
|
||||
if (targetLocation === null) {
|
||||
console.log(
|
||||
`Could not resolve source path '${path}'. Skipping moveRequest dispatch.`
|
||||
)
|
||||
return {}
|
||||
}
|
||||
|
||||
const req = targetLocation.requests[requestIndex]
|
||||
|
||||
const destIndexPaths = destinationPath.split("/").map((x) => parseInt(x))
|
||||
|
||||
const destLocation = navigateToFolderWithIndexPath(newState, destIndexPaths)
|
||||
|
||||
if (destLocation === null) {
|
||||
console.log(
|
||||
`Could not resolve destination path '${destinationPath}'. Skipping moveRequest dispatch.`
|
||||
)
|
||||
|
||||
return {}
|
||||
}
|
||||
|
||||
destLocation.requests.push(req)
|
||||
targetLocation.requests.splice(requestIndex, 1)
|
||||
|
||||
return {
|
||||
state: newState,
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
export const restCollectionStore = new DispatchingStore(
|
||||
defaultRESTCollectionState,
|
||||
collectionDispatchers
|
||||
)
|
||||
|
||||
export const graphqlCollectionStore = new DispatchingStore(
|
||||
defaultGraphqlCollectionState,
|
||||
collectionDispatchers
|
||||
)
|
||||
|
||||
export function setRESTCollections(entries: Collection[]) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "setCollections",
|
||||
payload: {
|
||||
entries,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export const restCollections$ = restCollectionStore.subject$.pipe(
|
||||
pluck("state")
|
||||
)
|
||||
|
||||
export const graphqlCollections$ = graphqlCollectionStore.subject$.pipe(
|
||||
pluck("state")
|
||||
)
|
||||
|
||||
export function appendRESTCollections(entries: Collection[]) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "appendCollections",
|
||||
payload: {
|
||||
entries,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function addRESTCollection(collection: Collection) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "addCollection",
|
||||
payload: {
|
||||
collection,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function removeRESTCollection(collectionIndex: number) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "removeCollection",
|
||||
payload: {
|
||||
collectionIndex,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function editRESTCollection(
|
||||
collectionIndex: number,
|
||||
collection: Collection
|
||||
) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "editCollection",
|
||||
payload: {
|
||||
collectionIndex,
|
||||
collection,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function addRESTFolder(name: string, path: string) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "addFolder",
|
||||
payload: {
|
||||
name,
|
||||
path,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function editRESTFolder(path: string, folder: Collection) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "editFolder",
|
||||
payload: {
|
||||
path,
|
||||
folder,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function removeRESTFolder(path: string) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "removeFolder",
|
||||
payload: {
|
||||
path,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function editRESTRequest(
|
||||
path: string,
|
||||
requestIndex: number,
|
||||
requestNew: any
|
||||
) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "editRequest",
|
||||
payload: {
|
||||
path,
|
||||
requestIndex,
|
||||
requestNew,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function saveRESTRequestAs(path: string, request: any) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "saveRequestAs",
|
||||
payload: {
|
||||
path,
|
||||
request,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function removeRESTRequest(path: string, requestIndex: number) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "removeRequest",
|
||||
payload: {
|
||||
path,
|
||||
requestIndex,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function moveRESTRequest(
|
||||
path: string,
|
||||
requestIndex: number,
|
||||
destinationPath: string
|
||||
) {
|
||||
restCollectionStore.dispatch({
|
||||
dispatcher: "moveRequest",
|
||||
payload: {
|
||||
path,
|
||||
requestIndex,
|
||||
destinationPath,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function setGraphqlCollections(entries: Collection[]) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "setCollections",
|
||||
payload: {
|
||||
entries,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function appendGraphqlCollections(entries: Collection[]) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "appendCollections",
|
||||
payload: {
|
||||
entries,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function addGraphqlCollection(collection: Collection) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "addCollection",
|
||||
payload: {
|
||||
collection,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function removeGraphqlCollection(collectionIndex: number) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "removeCollection",
|
||||
payload: {
|
||||
collectionIndex,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function editGraphqlCollection(
|
||||
collectionIndex: number,
|
||||
collection: Collection
|
||||
) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "editCollection",
|
||||
payload: {
|
||||
collectionIndex,
|
||||
collection,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function addGraphqlFolder(name: string, path: string) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "addFolder",
|
||||
payload: {
|
||||
name,
|
||||
path,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function editGraphqlFolder(path: string, folder: Collection) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "editFolder",
|
||||
payload: {
|
||||
path,
|
||||
folder,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function removeGraphqlFolder(path: string) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "removeFolder",
|
||||
payload: {
|
||||
path,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function editGraphqlRequest(
|
||||
path: string,
|
||||
requestIndex: number,
|
||||
requestNew: any
|
||||
) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "editRequest",
|
||||
payload: {
|
||||
path,
|
||||
requestIndex,
|
||||
requestNew,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function saveGraphqlRequestAs(path: string, request: any) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "saveRequestAs",
|
||||
payload: {
|
||||
path,
|
||||
request,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function removeGraphqlRequest(path: string, requestIndex: number) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "removeRequest",
|
||||
payload: {
|
||||
path,
|
||||
requestIndex,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function moveGraphqlRequest(
|
||||
path: string,
|
||||
requestIndex: number,
|
||||
destinationPath: string
|
||||
) {
|
||||
graphqlCollectionStore.dispatch({
|
||||
dispatcher: "moveRequest",
|
||||
payload: {
|
||||
path,
|
||||
requestIndex,
|
||||
destinationPath,
|
||||
},
|
||||
})
|
||||
}
|
||||
@@ -8,6 +8,12 @@ import {
|
||||
setRESTHistoryEntries,
|
||||
setGraphqlHistoryEntries,
|
||||
} from "./history"
|
||||
import {
|
||||
restCollectionStore,
|
||||
graphqlCollectionStore,
|
||||
setGraphqlCollections,
|
||||
setRESTCollections,
|
||||
} from "./collections"
|
||||
|
||||
function checkAndMigrateOldSettings() {
|
||||
const vuexData = JSON.parse(window.localStorage.getItem("vuex") || "{}")
|
||||
@@ -22,6 +28,22 @@ function checkAndMigrateOldSettings() {
|
||||
delete vuexData.postwoman.settings
|
||||
window.localStorage.setItem("vuex", JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
if (vuexData.postwoman && vuexData.postwoman.collections) {
|
||||
const restColls = vuexData.postwoman.collections
|
||||
window.localStorage.setItem("collections", JSON.stringify(restColls))
|
||||
|
||||
delete vuexData.postwoman.collections
|
||||
window.localStorage.setItem("vuex", JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
if (vuexData.postwoman && vuexData.postwoman.collectionsGraphql) {
|
||||
const gqlColls = vuexData.postwoman.collectionsGraphql
|
||||
window.localStorage.setItem("collectionsGraphql", JSON.stringify(gqlColls))
|
||||
|
||||
delete vuexData.postwoman.collectionsGraphql
|
||||
window.localStorage.setItem("vuex", JSON.stringify(vuexData))
|
||||
}
|
||||
}
|
||||
|
||||
function setupSettingsPersistence() {
|
||||
@@ -59,9 +81,31 @@ function setupHistoryPersistence() {
|
||||
})
|
||||
}
|
||||
|
||||
function setupCollectionsPersistence() {
|
||||
const restCollectionData = JSON.parse(
|
||||
window.localStorage.getItem("collections") || "[]"
|
||||
)
|
||||
|
||||
const graphqlCollectionData = JSON.parse(
|
||||
window.localStorage.getItem("collectionsGraphql") || "[]"
|
||||
)
|
||||
|
||||
setRESTCollections(restCollectionData)
|
||||
setGraphqlCollections(graphqlCollectionData)
|
||||
|
||||
restCollectionStore.subject$.subscribe(({ state }) => {
|
||||
window.localStorage.setItem("collections", JSON.stringify(state))
|
||||
})
|
||||
|
||||
graphqlCollectionStore.subject$.subscribe(({ state }) => {
|
||||
window.localStorage.setItem("collectionsGraphql", JSON.stringify(state))
|
||||
})
|
||||
}
|
||||
|
||||
export function setupLocalPersistence() {
|
||||
checkAndMigrateOldSettings()
|
||||
|
||||
setupSettingsPersistence()
|
||||
setupHistoryPersistence()
|
||||
setupCollectionsPersistence()
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user