TCP Support

admin-web/src/api/authAPI.ts

@@ -1,4 +1,4 @@
-import http from "./http";
+import http, {ID} from "./http";
 
 export function checkSampleTokenCorrect(token: string) {
     return http.post('/auth/st/check', {
@@ -7,7 +7,7 @@ export function checkSampleTokenCorrect(token: string) {
 }
 
 
-export function getSSOInviteCode(networkId:number):Promise<string> {
+export function getSSOInviteCode(networkId:ID):Promise<string> {
     // @ts-ignore
     return http.get<string>(`/auth/oauth/${networkId}/device_code`, {
         // @ts-ignore

admin-web/src/api/http.ts

@@ -7,10 +7,13 @@ const instance = axios.create({
     timeout: 5 * 1000,
 })
 
+
+export type ID = string;
 export interface CreatedSuccess {
-    id: number
+    id: ID
 }
 
+
 export interface Page<T> {
     total: number
     list: T[]

admin-web/src/api/networkAPI.ts

@@ -1,15 +1,19 @@
-import http, {CreatedSuccess, Page} from "./http";
+import http, {CreatedSuccess, ID, Page} from "./http";
 
+export enum NetworkProtocol {
+    TCP, UDP
+}
 
 export interface NetworkSetting {
     mtu: number,
     keepAlive: number,
     dns?: string,
     port: number,
+    protocol: NetworkProtocol,
 }
 
 export interface Network {
-    id: number,
+    id: ID,
     name: string,
     setting: NetworkSetting,
     createdAt: string,
@@ -31,25 +35,26 @@ export function networkList(name: string | null, page: number = 1, pageSize: num
 export interface CreateNetwork {
     name: string,
     addressRange: string,
+    protocol: NetworkProtocol,
 }
 
 export function createNetwork(data: CreateNetwork) {
     return http.post<CreatedSuccess>('/network', data)
 }
 
-export function updateNetwork(id: number, data: Network) {
+export function updateNetwork(id: ID, data: Network) {
     return http.put<Network>(`/network/${id}`, data)
 }
 
-export function getNetwork(id: number) {
+export function getNetwork(id: ID) {
     return http.get<Network>(`/network/${id}`).then(r => r.data)
 }
 
-export function getNetworkInviteCode(networkId: number) {
+export function getNetworkInviteCode(networkId: ID) {
     return http.get<string>(`/network/${networkId}/invite_code`).then(r => r.data)
 }
 
 
-export function deleteNetwork(id:number) {
+export function deleteNetwork(id:ID) {
     return http.delete(`/network/${id}`)
 }

admin-web/src/api/nodeAPI.ts

@@ -1,4 +1,4 @@
-import http, {CreatedSuccess} from "./http";
+import http, {CreatedSuccess, ID} from "./http";
 
 
 export enum NodeStatus {
@@ -10,11 +10,11 @@ export enum NodeType {
 }
 
 export interface Node {
-    id: number,
+    id: ID,
     nodeType: NodeType,
     status: NodeStatus,
     setting: NodeSetting,
-    networkId: number,
+    networkId: ID,
     name: string,
 }
 
@@ -34,7 +34,7 @@ export interface UpdateNode {
     setting: NodeSetting,
 }
 
-export function getNodeList(networkId: number, page: number = 1, pageSize: number = 10) {
+export function getNodeList(networkId: ID, page: number = 1, pageSize: number = 10) {
     return http.get<Node[]>(`/node/${networkId}`, {
         params: {
             page,
@@ -50,22 +50,22 @@ export interface CreateNode {
     setting: NodeSetting,
 }
 
-export function createNode(networkId: number, data: CreateNode) {
+export function createNode(networkId: ID, data: CreateNode) {
     return http.post<CreatedSuccess>(`/node/${networkId}`, data)
 }
 
-export function getNode(networkId: number, nodeId: number) {
+export function getNode(networkId: ID, nodeId: ID) {
     return http.get<Node>(`/node/${networkId}/${nodeId}`).then(r => r.data)
 }
 
-export function updateNode(networkId: number, nodeId: number, data: UpdateNode) {
+export function updateNode(networkId: ID, nodeId: ID, data: UpdateNode) {
     return http.put(`/node/${networkId}/${nodeId}`, data)
 }
 
-export function getNodeActiveCode(networkId: number, nodeId: number) {
+export function getNodeActiveCode(networkId: ID, nodeId: ID) {
     return http.get<string>(`/node/${networkId}/${nodeId}/active_code`).then(r => r.data)
 }
 
-export function updateNodeStatus(networkId: number, nodeId: number, status: NodeStatus.Forbid | NodeStatus.Normal) {
+export function updateNodeStatus(networkId: ID, nodeId: ID, status: NodeStatus.Forbid | NodeStatus.Normal) {
     return http.put(`/node/${networkId}/${nodeId}/status`, {status})
 }

admin-web/src/view/network/CreateNetworkPage.tsx

@@ -1,9 +1,9 @@
-import {Button, Form, Input, message} from "antd";
+import {Button, Form, Input, message, Select} from "antd";
 import {useIntl} from "react-intl";
-import {CreateNetwork, createNetwork} from "../../api/networkAPI";
+import {CreateNetwork, createNetwork, NetworkProtocol} from "../../api/networkAPI";
 import {useNavigate} from "react-router-dom";
 
-
+const {Option} = Select;
 export function CreateNetworkPage() {
     const [form] = Form.useForm<CreateNetwork>()
     const navi = useNavigate()
@@ -23,6 +23,9 @@ export function CreateNetworkPage() {
         form={form}
         labelCol={{span: 8}}
         wrapperCol={{span: 16}}
+        initialValues={{
+            protocol: NetworkProtocol.UDP
+        }}
     >
         <Form.Item
             label={intl.formatMessage({id: 'name'})}
@@ -40,6 +43,17 @@ export function CreateNetworkPage() {
         >
             <Input placeholder="10.2.0.0/16"/>
         </Form.Item>
+        <Form.Item
+            label="Protocol"
+            required
+            rules={[{required: true}]}
+            name="protocol"
+        >
+            <Select>
+                <Option value={NetworkProtocol.TCP}>TCP</Option>
+                <Option value={NetworkProtocol.UDP}>UDP</Option>
+            </Select>
+        </Form.Item>
         <Form.Item wrapperCol={{offset: 8, span: 16}}>
             <Button type="ghost" onClick={onFinish}>{intl.formatMessage({id: 'submit'})}</Button>
         </Form.Item>

admin-web/src/view/network/NetworkDetailPage.tsx

@@ -1,25 +1,27 @@
 import {useEffect} from "react";
-import {getNetwork, Network, updateNetwork} from "../../api/networkAPI";
+import {getNetwork, Network, NetworkProtocol, updateNetwork} from "../../api/networkAPI";
 import {useParams} from "react-router-dom";
-import {Button, Col, Form, Input, InputNumber, Row} from "antd";
+import {Button, Col, Form, Input, InputNumber, message, Row, Select} from "antd";
 import {useIntl} from "react-intl";
 import {useForm} from "antd/es/form/Form";
 
+const {Option} = Select;
 
 export default function NetworkDetailPage() {
     const {networkId} = useParams<{ networkId: string }>()
     const intl = useIntl()
     const [form] = useForm<Network>()
 
     useEffect(() => {
-        getNetwork(parseInt(networkId!)).then((d) => {
+        getNetwork(networkId!).then((d) => {
             form.setFieldsValue(d)
         })
     }, [networkId, form])
 
     const submit = async () => {
         const data = await form.validateFields()
-        await updateNetwork(parseInt(networkId!), data)
+        await updateNetwork(networkId!, data)
+        message.info(intl.formatMessage({id: 'result.updateSuccess'}, {'0': intl.formatMessage({id: 'nav.network'})}))
     }
     return (
         <>
@@ -62,6 +64,15 @@ export default function NetworkDetailPage() {
                                          max={600}/>
                         </Form.Item>
                     </Col>
+                    <Col span={8}>
+                        <Form.Item rules={[{required: true}]} name={['setting','protocol']}
+                                   label="Protocol">
+                            <Select disabled>
+                                <Option value={NetworkProtocol.TCP}>TCP</Option>
+                                <Option value={NetworkProtocol.UDP}>UDP</Option>
+                            </Select>
+                        </Form.Item>
+                    </Col>
                 </Row>
             </Form>
             <div style={{textAlign: 'center', marginTop: '20px'}}>
@@ -70,6 +81,7 @@ export default function NetworkDetailPage() {
         </>
     )
 }
+// add Nodes Navigator, Invite Code
 // <Col span={8}>
 //     <Form.Item name={['setting', 'dns']} label="Default DNS"><Input/></Form.Item>
 // </Col>

admin-web/src/view/network/NetworkListPage.tsx

@@ -5,7 +5,7 @@ import {deleteNetwork, getNetworkInviteCode, Network, networkList} from "../../a
 import {useEffect, useState} from "react";
 import DayjsFormat from "../../component/DayjsFormat";
 import {Link, useSearchParams} from "react-router-dom";
-import {defaultPage, Page} from "../../api/http";
+import {defaultPage, ID, Page} from "../../api/http";
 import {QRCodeCanvas} from "qrcode.react";
 import copy from "copy-to-clipboard";
 import {getPersistenceToken, getSSOInviteCode} from "../../api/authAPI";
@@ -23,13 +23,13 @@ export default function NetworkListPage() {
         networkList(name, page).then((d) => setData(d))
     }, [name, page])
 
-    const showInviteModel = (id: number) => {
+    const showInviteModel = (id: ID) => {
         if((getPersistenceToken()??'').startsWith('Bearer')) {
             getSSOInviteCode(id).then(r => setShowSSO(r))
         }
         getNetworkInviteCode(id).then(setShowModal)
     }
-    const deleteNetworkAction = async (id: number) => {
+    const deleteNetworkAction = async (id: ID) => {
         await deleteNetwork(id)
         message.info(intl.formatMessage({id: 'result.deleteSuccess'},
             {'0': intl.formatMessage({id: 'nav.network'})}))

admin-web/src/view/node/CreateNodePage.tsx

@@ -16,7 +16,7 @@ export function CreateNodePage() {
     const intl = useIntl()
     useEffect(() => {
         if (networkId) {
-            getNetwork(parseInt(networkId)).then(r => setNetwork(r))
+            getNetwork(networkId).then(r => setNetwork(r))
         }
     }, [networkId])
 
@@ -36,7 +36,7 @@ export function CreateNodePage() {
             delete data.ip
         }
 
-        const {id} = (await createNode(parseInt(networkId as string), data)).data
+        const {id} = (await createNode(networkId!, data)).data
         message.info(intl.formatMessage({id: 'result.createSuccess'}, {'0': intl.formatMessage({id: 'nav.node'})}))
         navi(`/network/${networkId}/node/${id}`, {replace: true})
     }

admin-web/src/view/node/NodeDetailPage.tsx

@@ -71,8 +71,7 @@ export default function NodeDetailPage() {
 
     useEffect(() => {
         if (networkId && nodeId) {
-            const networkIdNum = parseInt(networkId)
-            Promise.all([getNetwork(networkIdNum), getNode(networkIdNum, parseInt(nodeId))]).then(r => {
+            Promise.all([getNetwork(networkId), getNode(networkId, nodeId)]).then(r => {
                 setNetwork(r[0])
                 form.setFieldsValue(r[1])
             })
@@ -91,7 +90,7 @@ export default function NodeDetailPage() {
             name: data.name,
             setting: data.setting,
         }
-        await updateNode(parseInt(networkId as string), parseInt(nodeId as string), updateData)
+        await updateNode(networkId!, nodeId!, updateData)
         message.info(intl.formatMessage({id: 'result.updateSuccess'}, {'0': intl.formatMessage({id: 'nav.node'})}))
     }
 

admin-web/src/view/node/NodeListPage.tsx

@@ -7,21 +7,22 @@ import {useIntl} from "react-intl";
 import {enumToDesc} from "../../local/intl";
 import {QRCodeCanvas} from "qrcode.react";
 import copy from "copy-to-clipboard";
+import {ID} from "../../api/http";
 
 export default function NodeListPage() {
     const {networkId} = useParams<{ networkId: string }>()
     const [showActiveCode, setShowActiveCode] = useState<string>()
     const [data, setData] = useState<Node[]>([])
     const intl = useIntl()
     useEffect(() => {
-        getNodeList(parseInt(networkId!)).then((d) => setData(d.data))
+        getNodeList(networkId!).then((d) => setData(d.data))
     }, [networkId])
 
-    const showActiveModalAction = async (networkId: number, nodeId: number) => {
+    const showActiveModalAction = async (networkId: ID, nodeId: ID) => {
         const activeCode = await getNodeActiveCode(networkId, nodeId)
         setShowActiveCode(activeCode)
     }
-    const updateNodeStatusAction = async (networkId: number, nodeId: number, status: NodeStatus.Forbid | NodeStatus.Normal) => {
+    const updateNodeStatusAction = async (networkId: ID, nodeId: ID, status: NodeStatus.Forbid | NodeStatus.Normal) => {
         await updateNodeStatus(networkId, nodeId, status)
         message.info(intl.formatMessage({id: 'result.updateSuccess'}, {'0': intl.formatMessage({id: 'status'})}))
         getNodeList(networkId).then((d) => setData(d.data))

backend/README.md

@@ -2,4 +2,5 @@ If Scala 3 is a good choice?
 
 ### TODO
 
-- [ ] create IpArrange util to handle all, should be careful use. 
+- [ ] create IpArrange util to handle all, should be careful use. 
+- [ ] needs async runtime(thread pool) to handle push. 

backend/build.sbt

@@ -13,6 +13,9 @@ Compile / PB.targets := Seq(
 )
 Compile / PB.protoSources += file("../protobuf")
 
+// zio-json default value needs this
+ThisBuild / scalacOptions ++= Seq("-Yretain-trees")
+
 import Dependencies._
 
 lazy val app = project

backend/src/main/resources/application.conf

@@ -31,6 +31,7 @@ mqtt {
 
 
 # should set keycloak or simple.
+# please set this in private.conf wehn develop.
 auth {
   # ref from keycloak config, you can download it from keycloak/realm/client
   #keycloak {
@@ -47,5 +48,5 @@ auth {
   #  userId: "admin"
   #}
 }
-
+# you can set your private config in private.conf file
 include "private.conf"

backend/src/main/scala/com/timzaak/fornet/controller/AuthController.scala

@@ -3,7 +3,7 @@ package com.timzaak.fornet.controller
 import com.google.common.base.Charsets
 import com.timzaak.fornet.config.AppConfig
 import com.timzaak.fornet.controller.auth.AppAuthSupport
-import com.timzaak.fornet.dao.{ NetworkDao, NetworkStatus }
+import com.timzaak.fornet.dao.{NetworkDao, NetworkStatus}
 import com.timzaak.fornet.di.DI.hashId
 import com.typesafe.config.Config
 import org.hashids.Hashids