🏗 WIP fixes for AirDCPP socket connection Part Deux

This commit is contained in:
2022-06-17 22:45:02 -07:00
parent 2244d2f512
commit 9cec1c40a8
6 changed files with 116 additions and 115 deletions

View File

@@ -10,19 +10,18 @@ import {
SETTINGS_SERVICE_BASE_URI,
} from "../constants/endpoints";
export const saveSettings =
(settingsPayload, settingsObjectId?) => async (dispatch) => {
const result = await axios({
url: `${SETTINGS_SERVICE_BASE_URI}/saveSettings`,
method: "POST",
data: { settingsPayload, settingsObjectId },
});
console.log(result.data);
dispatch({
type: SETTINGS_OBJECT_FETCHED,
data: result.data,
});
};
export const saveSettings = (settingsPayload) => async (dispatch) => {
const result = await axios({
url: `${SETTINGS_SERVICE_BASE_URI}/saveSettings`,
method: "POST",
data: { settingsPayload },
});
console.log(result.data);
dispatch({
type: SETTINGS_OBJECT_FETCHED,
data: result.data,
});
};
export const getSettings = (settingsKey?) => async (dispatch) => {
const result = await axios({

View File

@@ -2,7 +2,7 @@ import React, { ReactElement } from "react";
export const AirDCPPSettingsConfirmation = (settingsObject): ReactElement => {
const { settings } = settingsObject;
console.log(settings);
return (
<div className="mt-4 is-clearfix">
<div className="card">
@@ -11,52 +11,17 @@ export const AirDCPPSettingsConfirmation = (settingsObject): ReactElement => {
<div className="content is-size-7">
<dl>
<dt>{settings._id}</dt>
<dt>
Client version:{" "}
{
settings.directConnect.client.airDCPPUserSettings.system_info
.client_version
}
</dt>
<dt>
Hostname:{" "}
{
settings.directConnect.client.airDCPPUserSettings.system_info
.hostname
}
</dt>
<dt>
Platform:{" "}
{
settings.directConnect.client.airDCPPUserSettings.system_info
.platform
}
</dt>
<dt>Client version: {settings.system_info.client_version}</dt>
<dt>Hostname: {settings.system_info.hostname}</dt>
<dt>Platform: {settings.system_info.platform}</dt>
<dt>
Username:{" "}
{
settings.directConnect.client.airDCPPUserSettings.user
.username
}
</dt>
<dt>Username: {settings.user.username}</dt>
<dt>
Active Sessions:{" "}
{
settings.directConnect.client.airDCPPUserSettings.user
.active_sessions
}
</dt>
<dt>Active Sessions: {settings.user.active_sessions}</dt>
<dt>
Permissions:{" "}
<pre>
{JSON.stringify(
settings.directConnect.client.airDCPPUserSettings.user
.permissions,
undefined,
2,
)}
{JSON.stringify(settings.user.permissions, undefined, 2)}
</pre>
</dt>
</dl>

View File

@@ -1,4 +1,4 @@
import React, { ReactElement, useCallback, useContext } from "react";
import React, { ReactElement, useCallback, useContext, useEffect } from "react";
import { Form, Field } from "react-final-form";
import { useDispatch } from "react-redux";
import { saveSettings, deleteSettings } from "../../actions/settings.actions";
@@ -8,33 +8,29 @@ import { isUndefined, isEmpty, isNil } from "lodash";
export const AirDCPPSettingsForm = (): ReactElement => {
const dispatch = useDispatch();
const airDCPPConfiguration = useContext(AirDCPPSocketContext);
const { AirDCPPSocket, settings } = airDCPPConfiguration;
const onSubmit = async (values) => {
const airDCPPSettings = useContext(AirDCPPSocketContext);
const onSubmit = useCallback(async (values) => {
try {
if (!isNil(AirDCPPSocket.session_id)) {
dispatch(
saveSettings({
host: values,
airDCPPUserSettings: settings,
}),
);
}
airDCPPSettings.setSettings(values);
dispatch(
saveSettings({
host: values,
}),
);
} catch (error) {
console.log(error);
}
};
}, []);
const removeSettings = useCallback(async () => {
dispatch(deleteSettings());
}, []);
const validate = async () => {};
const initFormData =
!isEmpty(settings.directConnect) || !isUndefined(settings.directConnect)
? settings.directConnect.client.host
: {};
// const initFormData = !isUndefined(airDCPPSettings)
// ? airDCPPSettings.airDCPPState.settings.directConnect.client.host
// : {};
const initFormData = {};
return (
<>
<Form
@@ -111,17 +107,20 @@ export const AirDCPPSettingsForm = (): ReactElement => {
</form>
)}
/>
{!isEmpty(settings) ? (
<AirDCPPSettingsConfirmation settings={settings} />
{!isUndefined(airDCPPSettings.airDCPPState.socketConnectionInformation) ? (
<AirDCPPSettingsConfirmation
settings={airDCPPSettings.airDCPPState.socketConnectionInformation}
/>
) : null}
{!isEmpty(settings) ? (
{/* {!isUndefined(settings) &&
!isEmpty(settings.directConnect.client.airDCPPUserSettings) ? (
<p className="control mt-4">
<button className="button is-danger" onClick={removeSettings}>
Delete
</button>
</p>
) : null}
) : null} */}
</>
);
};

View File

@@ -25,10 +25,14 @@ import { isEmpty, isNil, isUndefined } from "lodash";
const AirDCPPSocketComponent = (): ReactElement => {
const airDCPPConfiguration = useContext(AirDCPPSocketContext);
const { AirDCPPSocket, settings } = airDCPPConfiguration;
console.log(airDCPPConfiguration);
useEffect(() => {
const foo = async () => {
if (!isUndefined(AirDCPPSocket)) {
if (
!isUndefined(airDCPPConfiguration.airDCPPState) &&
!isEmpty(airDCPPConfiguration.airDCPPState.settings)
) {
await AirDCPPSocket.addListener(
"queue",
"queue_bundle_added",
@@ -40,7 +44,7 @@ const AirDCPPSocketComponent = (): ReactElement => {
}
};
foo();
}, [settings]);
}, []);
return <></>;
};
export const App = (): ReactElement => {

View File

@@ -2,8 +2,7 @@ import React, { ReactElement, useCallback } from "react";
import { flushDb } from "../../actions/settings.actions";
import { useDispatch, useSelector } from "react-redux";
export const SystemSettingsForm = (settingsObject): ReactElement => {
export const SystemSettingsForm = (): ReactElement => {
const dispatch = useDispatch();
const isSettingsCallInProgress = useSelector(
(state: RootState) => state.settings.inProgress,

View File

@@ -1,46 +1,81 @@
import axios from "axios";
import { isEmpty, isUndefined } from "lodash";
import React, { createContext, useEffect, useMemo, useState } from "react";
import { SETTINGS_SERVICE_BASE_URI } from "../constants/endpoints";
import { useDispatch, useSelector } from "react-redux";
import { getSettings } from "../actions/settings.actions";
import AirDCPPSocket from "../services/DcppSearchService";
const AirDCPPSocketContext = createContext({});
const AirDCPPSocketContextProvider = ({ children }) => {
const [airDCPPConfiguration, setValue] = useState({});
// setter for settings for use in the context consumer
const setSettings = (settingsObject) => {
persistSettings({
...airDCPPState,
airDCPPState: {
settings: settingsObject,
socket: {},
socketConnectionInformation: {},
},
});
};
// 1. default zero-state for AirDC++ configuration
const initState = {
airDCPPState: { settings: {}, socket: {}, socketConnectionInformation: {} },
setSettings: setSettings,
};
const dispatch = useDispatch();
const [airDCPPState, persistSettings] = useState(initState);
const airDCPPSettings = useSelector(
(state: RootState) => state.settings.data,
);
// 1. get settings from mongo
useEffect(() => {
const initializeAirDCPPSocket = () => {
axios({
url: `${SETTINGS_SERVICE_BASE_URI}/getSettings`,
method: "POST",
data: "",
})
.then(async (data) => {
const { directConnect } = data.data;
const initializedAirDCPPSocket = new AirDCPPSocket({
protocol: `${directConnect.client.host.protocol}`,
hostname: `${directConnect.client.host.hostname}`,
});
await initializedAirDCPPSocket.connect(
`${directConnect.client.host.username}`,
`${directConnect.client.host.password}`,
true,
);
setValue({
AirDCPPSocket: initializedAirDCPPSocket,
settings: data.data,
});
})
.catch((error) => console.log(error));
};
initializeAirDCPPSocket();
dispatch(getSettings());
}, []);
// 2. If available, init AirDC++ Socket with those settings
useEffect(() => {
if (!isEmpty(airDCPPSettings)) {
initializeAirDCPPSocket(airDCPPSettings);
}
}, [airDCPPSettings]);
// Method to init AirDC++ Socket with supplied settings
const initializeAirDCPPSocket = async (configuration) => {
const {
directConnect: {
client: { host },
},
} = configuration;
const initializedAirDCPPSocket = new AirDCPPSocket({
protocol: `${host.protocol}`,
hostname: `${host.hostname}`,
});
const socketConnectionInformation = await initializedAirDCPPSocket.connect(
`${host.username}`,
`${host.password}`,
true,
);
persistSettings({
...airDCPPState,
airDCPPState: {
settings: configuration,
socket: initializedAirDCPPSocket,
socketConnectionInformation,
},
});
};
// the Provider gives access to the context to its children
return (
<AirDCPPSocketContext.Provider value={airDCPPConfiguration}>
<AirDCPPSocketContext.Provider value={airDCPPState}>
{children}
</AirDCPPSocketContext.Provider>
);
};
const AirDCPPSocketContext = createContext({
airDCPPState: {},
saveSettings: () => {},
});
export { AirDCPPSocketContext, AirDCPPSocketContextProvider };