diff --git a/components/percentage.jsx b/components/percentage.jsx
new file mode 100644
index 0000000..d249a5a
--- /dev/null
+++ b/components/percentage.jsx
@@ -0,0 +1,29 @@
+import { Component } from "react";
+
+export default class extends Component {
+ render() {
+ const leftActivity = this.props.activity
+ .filter(a => a.ch === "l")
+ .map(a => a.endTime - a.startTime)
+ .reduce((a, c) => a + c, 0);
+ const rightActivity = this.props.activity
+ .filter(a => a.ch === "r")
+ .map(a => a.endTime - a.startTime)
+ .reduce((a, c) => a + c, 0);
+
+ return (
+
+ - 会話時間 (ms)
+ - {leftActivity + rightActivity}
+ - 会話の割合
+ -
+ 左{" "}
+
+ {leftActivity / (leftActivity + rightActivity)}
+ {" "}
+ 右
+
+
+ );
+ }
+}
diff --git a/components/vad.jsx b/components/vad.jsx
index 241f7f6..c1de31f 100644
--- a/components/vad.jsx
+++ b/components/vad.jsx
@@ -1,5 +1,6 @@
import { Component } from "react";
import * as _VAD from "vad.js/lib/vad.js";
+import Percentage from "./percentage";
import Kaburi from "./kaburi";
export default class extends Component {
@@ -109,6 +110,7 @@ export default class extends Component {
右
{this.state.right && "発話中..."}
+
);