docs/tui2.svg

<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" contentStyleType="text/css" height="864px" preserveAspectRatio="none" style="width:1010px;height:864px;background:#FFFFFF;" version="1.1" viewBox="0 0 1010 864" width="1010px" zoomAndPan="magnify"><defs/><g><!--MD5=[17d534d0ab23b25c73ca3455a7ef31f6]
cluster ss_p--><g id="cluster_ss_p"><path d="M616,158.4331 L695,158.4331 A3.75,3.75 0 0 1 697.5,160.9331 L704.5,180.9214 L1001,180.9214 A2.5,2.5 0 0 1 1003.5,183.4214 L1003.5,636.8831 A2.5,2.5 0 0 1 1001,639.3831 L616,639.3831 A2.5,2.5 0 0 1 613.5,636.8831 L613.5,160.9331 A2.5,2.5 0 0 1 616,158.4331 " fill="none" style="stroke:#000000;stroke-width:1.5;"/><line style="stroke:#000000;stroke-width:1.5;" x1="613.5" x2="704.5" y1="180.9214" y2="180.9214"/><text fill="#000000" font-family="sans-serif" font-size="14" font-weight="bold" lengthAdjust="spacing" textLength="78" x="617.5" y="173.9683">State Store</text></g><!--MD5=[1f393450223f87c2170963ec2772d71b]
cluster um_p--><g id="cluster_um_p"><path d="M16,348.9231 L129,348.9231 A3.75,3.75 0 0 1 131.5,351.4231 L138.5,371.4114 L571,371.4114 A2.5,2.5 0 0 1 573.5,373.9114 L573.5,855.3731 A2.5,2.5 0 0 1 571,857.8731 L16,857.8731 A2.5,2.5 0 0 1 13.5,855.3731 L13.5,351.4231 A2.5,2.5 0 0 1 16,348.9231 " fill="none" style="stroke:#000000;stroke-width:1.5;"/><line style="stroke:#000000;stroke-width:1.5;" x1="13.5" x2="138.5" y1="371.4114" y2="371.4114"/><text fill="#000000" font-family="sans-serif" font-size="14" font-weight="bold" lengthAdjust="spacing" textLength="112" x="17.5" y="364.4583">UI Management</text></g><!--MD5=[6c6f92573cfc5dec1624c9507009f723]
cluster pages--><g id="cluster_pages"><path d="M64,525.8931 L107,525.8931 A3.75,3.75 0 0 1 109.5,528.3931 L116.5,548.3814 L249,548.3814 A2.5,2.5 0 0 1 251.5,550.8814 L251.5,815.3731 A2.5,2.5 0 0 1 249,817.8731 L64,817.8731 A2.5,2.5 0 0 1 61.5,815.3731 L61.5,528.3931 A2.5,2.5 0 0 1 64,525.8931 " fill="none" style="stroke:#000000;stroke-width:1.5;"/><line style="stroke:#000000;stroke-width:1.5;" x1="61.5" x2="116.5" y1="548.3814" y2="548.3814"/><text fill="#000000" font-family="sans-serif" font-size="14" font-weight="bold" lengthAdjust="spacing" textLength="42" x="65.5" y="541.4283">Pages</text></g><!--MD5=[67a6735b2a5707e03290b64fb931c9ce]
cluster components--><g id="cluster_components"><path d="M328,704.3831 L420,704.3831 A3.75,3.75 0 0 1 422.5,706.8831 L429.5,726.8714 L496,726.8714 A2.5,2.5 0 0 1 498.5,729.3714 L498.5,815.3731 A2.5,2.5 0 0 1 496,817.8731 L328,817.8731 A2.5,2.5 0 0 1 325.5,815.3731 L325.5,706.8831 A2.5,2.5 0 0 1 328,704.3831 " fill="none" style="stroke:#000000;stroke-width:1.5;"/><line style="stroke:#000000;stroke-width:1.5;" x1="325.5" x2="429.5" y1="726.8714" y2="726.8714"/><text fill="#000000" font-family="sans-serif" font-size="14" font-weight="bold" lengthAdjust="spacing" textLength="91" x="329.5" y="719.9183">Components</text></g><!--MD5=[d3b87fe592c1f372fd33513d4fab95fd]
entity server_handle--><g id="elem_server_handle"><rect fill="#F1F1F1" height="46.4883" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="135" x="666" y="201.4331"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="781" y="206.4331"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="779" y="208.4331"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="779" y="212.4331"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="95" x="681" y="234.9683">Server Handle</text></g><!--MD5=[8759b649f4e9d7f07301d809ca1df107]
entity state_store--><g id="elem_state_store"><rect fill="#F1F1F1" height="62.9766" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="114" x="645.5" y="391.9231"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="739.5" y="396.9231"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="737.5" y="398.9231"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="737.5" y="402.9231"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="74" x="660.5" y="425.4583">State Store</text><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="71" x="660.5" y="441.9466">Main Loop</text></g><!--MD5=[f350ee6f6cc17b9109e91461bf56a5ea]
entity state--><g id="elem_state"><rect fill="#F1F1F1" height="46.4883" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="74" x="905.5" y="400.1631"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="959.5" y="405.1631"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="957.5" y="407.1631"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="957.5" y="411.1631"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="34" x="920.5" y="433.6983">State</text></g><!--MD5=[4f4175225de46297a73ce4670d313708]
entity state_ch--><g id="elem_state_ch"><rect fill="#F1F1F1" height="46.4883" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="135" x="757" y="568.8931"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="872" y="573.8931"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="870" y="575.8931"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="870" y="579.8931"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="95" x="772" y="602.4283">State Channel</text></g><!--MD5=[f84dc35e01dba86759a9a8d93832bc91]
entity user_management--><g id="elem_user_management"><rect fill="#F1F1F1" height="62.9766" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="164" x="385.5" y="560.6531"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="529.5" y="565.6531"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="527.5" y="567.6531"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="527.5" y="571.6531"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="124" x="400.5" y="594.1883">User Management</text><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="71" x="400.5" y="610.6766">Main Loop</text></g><!--MD5=[488ea78647dfdf5b52edf74e6f6e6b2d]
entity action_ch--><g id="elem_action_ch"><rect fill="#F1F1F1" height="62.9766" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="119" x="304" y="391.9231"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="403" y="396.9231"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="401" y="398.9231"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="401" y="402.9231"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="79" x="319" y="425.4583">User Action</text><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="57" x="319" y="441.9466">Channel</text></g><!--MD5=[dcee545b971fda4841015ff49382b51a]
entity chat_page--><g id="elem_chat_page"><rect fill="#F1F1F1" height="46.4883" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="109" x="98" y="568.8931"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="187" y="573.8931"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="185" y="575.8931"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="185" y="579.8931"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="69" x="113" y="602.4283">Chat Page</text></g><!--MD5=[2fc9eabe35d3d0beb6b6068183e4e53b]
entity connect_page--><g id="elem_connect_page"><rect fill="#F1F1F1" height="46.4883" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="134" x="85.5" y="747.3831"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="199.5" y="752.3831"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="197.5" y="754.3831"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="197.5" y="758.3831"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="94" x="100.5" y="780.9183">Connect Page</text></g><!--MD5=[1c3e0d9d689b9973cc07ef642e87be9f]
entity input_box--><g id="elem_input_box"><rect fill="#F1F1F1" height="46.4883" rx="2.5" ry="2.5" style="stroke:#181818;stroke-width:0.5;" width="106" x="368.5" y="747.3831"/><rect fill="#F1F1F1" height="10" style="stroke:#181818;stroke-width:0.5;" width="15" x="454.5" y="752.3831"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="452.5" y="754.3831"/><rect fill="#F1F1F1" height="2" style="stroke:#181818;stroke-width:0.5;" width="4" x="452.5" y="758.3831"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="66" x="383.5" y="780.9183">Input Box</text></g><!--MD5=[25f39ff3125211ef680e2c11887b87e4]
entity chat_server--><g id="elem_chat_server"><ellipse cx="733.5" cy="39.9414" fill="#F1F1F1" rx="12" ry="12" style="stroke:#181818;stroke-width:0.5;"/><line style="stroke:#181818;stroke-width:0.5;" x1="721.5" x2="745.5" y1="53.9414" y2="53.9414"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="79" x="694" y="69.4766">Chat Server</text><text fill="#000000" font-family="sans-serif" font-size="14" font-style="italic" lengthAdjust="spacing" textLength="93" x="687" y="20.9883">«Chat Server»</text></g><!--MD5=[8fc3522a43f8c7199df5e09e5bb0188e]
entity user--><g id="elem_user"><ellipse cx="21.5" cy="194.9331" fill="#F1F1F1" rx="8" ry="8" style="stroke:#181818;stroke-width:0.5;"/><path d="M21.5,202.9331 L21.5,229.9331 M8.5,210.9331 L34.5,210.9331 M21.5,229.9331 L8.5,244.9331 M21.5,229.9331 L34.5,244.9331 " fill="none" style="stroke:#181818;stroke-width:0.5;"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacing" textLength="31" x="6" y="259.9683">User</text></g><!--MD5=[80b7482a6710a4fcd4be59194f4b69e7]
reverse link server_handle to state_store--><!--MD5=[926cc3a5837efef64dfbf5f2744d345f]
link server_handle to state_store--><g id="link_server_handle_state_store"><path d="M729.06,253.8731 C723.56,288.7331 714.21,348.1031 708.19,386.2731 " fill="none" id="server_handle-state_store" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="707.33,390.7431,712.67,382.4676,708.101,385.8029,704.7657,381.234,707.33,390.7431" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="729.94,249.2431,724.5964,257.5163,729.1668,254.183,732.5001,258.7534,729.94,249.2431" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="189" x="723.5" y="306.4915">Subscribe to the Server Events</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="132" x="752" y="321.802">and Send Commands</text></g><!--MD5=[8b6193eb590b659b6f92142632363393]
link state to state_ch--><!--MD5=[aa158f2009fce0813671d6349cdd24c7]
link chat_server to server_handle--><g id="link_chat_server_server_handle"><path d="M733.5,78.5331 C733.5,113.2831 733.5,164.1431 733.5,195.5131 " fill="none" id="chat_server-server_handle" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="733.5,200.1331,737.5,191.1331,733.5,195.1331,729.5,191.1331,733.5,200.1331" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="733.5,73.7731,729.5,82.7731,733.5,78.7731,737.5,82.7731,733.5,73.7731" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="128" x="741" y="116.0015">TCP Communication</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="141" x="734.5" y="131.312">via the Comms Library</text></g><!--MD5=[6196dbf7d7917181c8231940e4e7b8aa]
link chat_page to connect_page--><!--MD5=[a6fa3e04534a74a9b93db1fe1ffafbd3]
link action_ch to user_management--><!--MD5=[1c6d266c9282f49d666e2bb385e9f0d1]
reverse link pages to user_management--><!--MD5=[0d817b2f6097754f4d517c52027578f8]
link user_management to pages--><g id="link_user_management_pages"><path d="M385.22,592.1431 C354.965,592.1431 321.5875,592.1431 294.8275,592.1431 C281.4475,592.1431 269.7219,592.1431 260.8681,592.1431 C258.6547,592.1431 256.6207,592.1431 254.7853,592.1431 C253.8676,592.1431 252.9995,592.1431 252.1834,592.1431 C251.9794,592.1431 251.7786,592.1431 251.5812,592.1431 " fill="none" id="user_management-to-pages" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="251.5812,592.1431,260.5812,596.1431,256.5812,592.1431,260.5812,588.1431,251.5812,592.1431" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="83" x="273.18" y="555.7115">Render Pages</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="105" x="262.18" y="571.022">According to the</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="89" x="270.18" y="586.3326">State Changes</text></g><!--MD5=[2048ec9aeb43cc33265a7902af0def12]
link components to pages--><!--MD5=[ff9f88a4b1a3018f10e22ee69b71c924]
link pages to components--><g id="link_pages_components"><path d="M251.7171,665.6372 C251.8192,665.8636 251.9218,666.0898 252.0249,666.3159 C253.6752,669.9337 255.4593,673.5212 257.3525,677.0668 C261.1389,684.158 265.3618,691.0816 269.8242,697.745 C278.7491,711.0719 288.6319,723.3581 297.8963,733.8631 C307.1606,744.3681 315.8066,753.0919 322.2577,759.2937 C323.064,760.069 323.8361,760.8048 324.5709,761.4998 C324.7545,761.6735 324.9359,761.8447 325.1148,762.0133 C325.2043,762.0977 325.2932,762.1813 325.3815,762.2643 " fill="none" id="pages-to-components" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="325.3815,762.2643,321.5652,753.1849,321.739,758.8391,316.0848,759.0129,325.3815,762.2643" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="158" x="259.5" y="676.9515">...Uses pure Components</text></g><!--MD5=[955ef3a93cb73b10966664c5a13c2165]
link pages to action_ch--><g id="link_pages_action_ch"><path d="M242.8711,525.5028 C242.9066,525.3215 242.9426,525.1402 242.9789,524.959 C243.0517,524.5965 243.1261,524.2342 243.2023,523.8722 C243.8116,520.9763 244.5316,518.0968 245.3772,515.2595 C248.7594,503.9106 254.15,493.2381 262.5,484.8931 C273.03,474.3731 285.74,464.9431 298.55,456.8331 " fill="none" id="pages-to-action_ch" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="302.64,453.6731,292.8859,455.0363,298.396,456.3167,297.1157,461.8268,302.64,453.6731" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="138" x="263.5" y="498.4615">Send the User Actions</text></g><!--MD5=[8887ca0d02b78ef7035d744f723418c1]
link user to um_p--><g id="link_user_um_p"><path d="M21.5,263.1431 C21.5,277.1906 21.5,293.9694 21.5,311.2844 C21.5,319.9419 21.5,328.7334 21.5,337.3847 C21.5,339.5475 21.5,341.7015 21.5,343.8425 C21.5,344.913 21.5,345.9803 21.5,347.0437 C21.5,347.5754 21.5,348.1062 21.5,348.6359 " fill="none" id="user-to-um_p" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="21.5,348.6359,25.5,339.6359,21.5,343.6359,17.5,339.6359,21.5,348.6359" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="70" x="27" y="306.4915">Interact via</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="79" x="22.5" y="321.802">the Terminal</text></g><!--MD5=[e8e2ebb4a47722e0de0fd63c1f4efedb]
link state_store to action_ch--><g id="link_state_store_action_ch"><path d="M645.24,440.4231 C639.54,441.6431 633.81,442.6731 628.25,443.4131 C586.83,448.8931 481.69,448.7231 440.25,443.4131 C436.49,442.9231 432.65,442.3131 428.79,441.6131 " fill="none" id="state_store-to-action_ch" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="424.13,440.5131,432.1993,446.1599,429.0378,441.469,433.7287,438.3075,424.13,440.5131" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="186" x="441.25" y="439.9815">Subscribe to the User Actions</text></g><!--MD5=[3744f10a82e6a17f41cbdc57763e7283]
link state_store to state--><g id="link_state_store_state"><path d="M759.99,423.4131 C802.94,423.4131 860.73,423.4131 899.68,423.4131 " fill="none" id="state_store-to-state" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="904.28,423.4131,895.28,419.4131,899.28,423.4131,895.28,427.4131,904.28,423.4131" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="103" x="781" y="386.9815">Update the State</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="101" x="782" y="402.292">per user actions</text><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="110" x="777.5" y="417.6026">and server events</text></g><!--MD5=[e38679cfd82626d6158d42023952b30a]
link state_store to state_ch--><g id="link_state_store_state_ch"><path d="M725.16,455.3831 C747.99,486.5731 782.86,534.2431 804.64,564.0031 " fill="none" id="state_store-to-state_ch" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="808.02,567.6131,805.9352,557.9875,805.0681,563.5775,799.4781,562.7105,808.02,567.6131" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="121" x="756.5" y="498.4615">Send Updated State</text></g><!--MD5=[bd45f77d613d53e1e48f38ce00d4e712]
reverse link state_ch to user_management--><g id="link_state_ch_user_management"><path d="M750.85,610.5931 C747.11,611.1931 743.4,611.7131 739.75,612.1431 C701.56,616.5831 605,615.9531 566.75,612.1431 C561.24,611.5931 555.58,610.8731 549.9,610.0431 " fill="none" id="state_ch-backto-user_management" style="stroke:#181818;stroke-width:1.0;"/><polygon fill="#181818" points="755.75,609.5931,746.2045,607.1675,750.8215,610.436,747.5531,615.053,755.75,609.5931" style="stroke:#181818;stroke-width:1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacing" textLength="171" x="567.75" y="608.7115">Subscribe to State Changes</text></g><!--MD5=[0698e981389c406250e0bca74577839d]
link ss_p to um_p--><!--MD5=[fbbbcc11bbecb2b6a5785ba2c45e05e5]
@startuml High Level Architecture - Diagram

skinparam linetype orthogonally

entity "Chat Server" as chat_server <<Chat Server>> 

package "State Store" as ss_p {
    component "Server Handle" as server_handle
    component "State Store\nMain Loop" as state_store
    component "State" as state
    component "State Channel" as state_ch

    state_store -[hidden]u-> server_handle
    state -[hidden]d-> state_ch
}

chat_server <-d-> server_handle: TCP Communication\nvia the Comms Library

package "UI Management" as um_p {
    component "User Management\nMain Loop" as user_management
    component "User Action\nChannel" as action_ch

    package "Pages" as pages {
        component "Chat Page" as chat_page
        component "Connect Page" as connect_page

        chat_page -[hidden]d-> connect_page
    }

    package "Components" as components {
        component "Input Box" as input_box
    }

    action_ch -[hidden]d-> user_management
    user_management -[hidden]l-> pages
    components -[hidden]d-> pages
    user_management -d-> pages: Render Pages\nAccording to the\nState Changes
    pages -d-> components: ...Uses pure Components
    pages -> action_ch: Send the User Actions
}

actor User as user
user -d-> um_p: Interact via\nthe Terminal

state_store <-u-> server_handle: Subscribe to the Server Events\nand Send Commands
state_store -> action_ch: Subscribe to the User Actions
state_store -> state: Update the State\nper user actions\nand server events
state_store -> state_ch: Send Updated State

state_ch <- user_management: Subscribe to State Changes

ss_p -[hidden]d-> um_p

@enduml

PlantUML version 1.2022.7(Mon Aug 22 20:01:30 TRT 2022)
(GPL source distribution)
Java Runtime: OpenJDK Runtime Environment
JVM: OpenJDK 64-Bit Server VM
Default Encoding: UTF-8
Language: en
Country: TR
--></g></svg>