16 Commits

Author SHA1 Message Date
coolcoala
fbd1c55f44 v0.2.3 2025-07-22 02:11:13 +03:00
coolcoala
9668a04a1a updated UPDATELOG.md 2025-07-21 03:41:07 +03:00
coolcoala
24af375a8e started work on translating console logs from Chinese to English 2025-07-21 03:40:47 +03:00
coolcoala
a32c973ab8 fixed problem with profile inactivation after adding via deeplink on windows 2025-07-21 03:06:37 +03:00
coolcoala
50beb913de fixed command mapping for macos installation 2025-07-21 03:06:22 +03:00
coolcoala
05f1ec7b34 added that it is not possible to enable proxy if no profile is available 2025-07-21 01:57:37 +03:00
coolcoala
9271b107b6 fixed a layout issue in the proxy menu, now all cards are the same size 2025-07-21 01:56:24 +03:00
coolcoala
e7208dd7d2 fixed problem with menu reopening when opening a page in a compressed window 2025-07-21 01:55:33 +03:00
coolcoala
e5dfb34082 v0.2.2 2025-07-19 03:57:29 +03:00
coolcoala
2ba5c4e706 new menu added, layout corrected in some places 2025-07-19 03:57:07 +03:00
coolcoala
27bcc5f4f8 v0.2.1 2025-07-18 04:51:35 +03:00
coolcoala
d884bd539b fixed release body and configs for webview 2025-07-18 04:30:43 +03:00
coolcoala
580a56727c new localization lines added 2025-07-18 04:18:19 +03:00
coolcoala
ac3163d061 added button to turn off hwid sending 2025-07-18 04:17:58 +03:00
coolcoala
8bc7a6c3e1 added saving the location on the main page when adding a profile via deeplink, profile update button on the main page, corrected url for telegram icon for support, and announcement-url header support. 2025-07-18 04:17:18 +03:00
coolcoala
31d368979e added update profiles at startup, “announce-url” header, and also when adding check if the profile already exists and if it does, just update it 2025-07-18 04:12:55 +03:00
36 changed files with 1362 additions and 497 deletions

View File

@@ -106,7 +106,6 @@ jobs:
with: with:
tagName: v__VERSION__ tagName: v__VERSION__
releaseName: "Clash Verge Rev Lite v__VERSION__" releaseName: "Clash Verge Rev Lite v__VERSION__"
releaseBody: "More new features are now supported."
tauriScript: pnpm tauriScript: pnpm
args: --target ${{ matrix.target }} args: --target ${{ matrix.target }}
@@ -219,14 +218,13 @@ jobs:
sudo apt-get update sudo apt-get update
sudo apt-get install jq sudo apt-get install jq
echo "VERSION=$(cat package.json | jq '.version' | tr -d '"')" >> $GITHUB_ENV echo "VERSION=$(cat package.json | jq '.version' | tr -d '"')" >> $GITHUB_ENV
echo "BUILDTIME=$(TZ=Asia/Shanghai date)" >> $GITHUB_ENV echo "BUILDTIME=$(TZ=Europe/Moscow date)" >> $GITHUB_ENV
- name: Upload Release - name: Upload Release
uses: softprops/action-gh-release@v2 uses: softprops/action-gh-release@v2
with: with:
tag_name: v${{env.VERSION}} tag_name: v${{env.VERSION}}
name: "Clash Verge Rev Lite v${{env.VERSION}}" name: "Clash Verge Rev Lite v${{env.VERSION}}"
body: "More new features are now supported."
token: ${{ secrets.GITHUB_TOKEN }} token: ${{ secrets.GITHUB_TOKEN }}
files: | files: |
src-tauri/target/${{ matrix.target }}/release/bundle/deb/*.deb src-tauri/target/${{ matrix.target }}/release/bundle/deb/*.deb
@@ -275,8 +273,8 @@ jobs:
- name: Download WebView2 Runtime - name: Download WebView2 Runtime
run: | run: |
invoke-webrequest -uri https://github.com/westinyang/WebView2RuntimeArchive/releases/download/109.0.1518.78/Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.${{ matrix.arch }}.cab -outfile Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.${{ matrix.arch }}.cab invoke-webrequest -uri https://github.com/westinyang/WebView2RuntimeArchive/releases/download/133.0.3065.92/Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.${{ matrix.arch }}.cab -outfile Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.${{ matrix.arch }}.cab
Expand .\Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.${{ matrix.arch }}.cab -F:* ./src-tauri Expand .\Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.${{ matrix.arch }}.cab -F:* ./src-tauri
Remove-Item .\src-tauri\tauri.windows.conf.json Remove-Item .\src-tauri\tauri.windows.conf.json
Rename-Item .\src-tauri\webview2.${{ matrix.arch }}.json tauri.windows.conf.json Rename-Item .\src-tauri\webview2.${{ matrix.arch }}.json tauri.windows.conf.json
@@ -317,7 +315,6 @@ jobs:
with: with:
tag_name: v${{steps.build.outputs.appVersion}} tag_name: v${{steps.build.outputs.appVersion}}
name: "Clash Verge Rev Lite v${{steps.build.outputs.appVersion}}" name: "Clash Verge Rev Lite v${{steps.build.outputs.appVersion}}"
body: "More new features are now supported."
token: ${{ secrets.GITHUB_TOKEN }} token: ${{ secrets.GITHUB_TOKEN }}
files: src-tauri/target/${{ matrix.target }}/release/bundle/nsis/*setup* files: src-tauri/target/${{ matrix.target }}/release/bundle/nsis/*setup*
@@ -376,3 +373,85 @@ jobs:
run: pnpm updater-fixed-webview2 run: pnpm updater-fixed-webview2
env: env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
create_release_notes:
name: Create Release Notes
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v4
- name: Fetch UPDATE logs
id: fetch_update_logs
run: |
if [ -f "UPDATELOG.md" ]; then
UPDATE_LOGS=$(awk '/^## v/{if(flag) exit; flag=1} flag' UPDATELOG.md)
if [ -n "$UPDATE_LOGS" ]; then
echo "Found update logs"
echo "UPDATE_LOGS<<EOF" >> $GITHUB_ENV
echo "$UPDATE_LOGS" >> $GITHUB_ENV
echo "EOF" >> $GITHUB_ENV
else
echo "No update sections found in UPDATELOG.md"
fi
else
echo "UPDATELOG.md file not found"
fi
shell: bash
- name: Get Version
run: |
sudo apt-get update
sudo apt-get install jq
echo "VERSION=$(cat package.json | jq '.version' | tr -d '"')" >> $GITHUB_ENV
echo "BUILDTIME=$(TZ=Europe/Moscow date)" >> $GITHUB_ENV
- run: |
if [ -z "$UPDATE_LOGS" ]; then
echo "No update logs found, using default message"
UPDATE_LOGS="More new features are now supported. Check for detailed changelog soon."
else
echo "Using found update logs"
fi
cat > release.txt << EOF
$UPDATE_LOGS
## Which version should I download?
### macOS
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_aarch64.dmg"><img src="https://img.shields.io/badge/DMG-default?style=flat&logo=apple&label=Apple%20Silicon"></a><br>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_x64.dmg"><img src="https://img.shields.io/badge/DMG-default?style=flat&logo=apple&label=Intel"></a><br>
> :warning: **Warning**
If you get a notification that the application is corrupted when you run it on macOS, run this command:<br>
<code>sudo xattr -r -c /Applications/Clash\ Verge\ Rev\ Lite.app</code>
### Linux
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_amd64.deb"><img src="https://img.shields.io/badge/x64-default?style=flat&logo=debian&label=DEB"> </a><br>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite-${{ env.VERSION }}-1.x86_64.rpm"><img src="https://img.shields.io/badge/x64-default?style=flat&logo=fedora&label=RPM"> </a>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_arm64.deb"><img src="https://img.shields.io/badge/arm64-default?style=flat&logo=debian&label=DEB"> </a><br>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite-${{ env.VERSION }}-1.aarch64.rpm"><img src="https://img.shields.io/badge/aarch64-default?style=flat&logo=fedora&label=RPM"> </a>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_armhf.deb"><img src="https://img.shields.io/badge/armhf-default?style=flat&logo=debian&label=DEB"> </a><br>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite-${{ env.VERSION }}-1.armhfp.rpm"><img src="https://img.shields.io/badge/armhfp-default?style=flat&logo=fedora&label=RPM"> </a>
### Windows (Win7 is no longer supported)
#### Normal version (recommended)
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_x64-setup.exe"><img src="https://badgen.net/badge/icon/x64?icon=windows&label=exe"></a><br>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_arm64-setup.exe"><img src="https://badgen.net/badge/icon/arm64?icon=windows&label=exe"></a>
#### Portable version is no longer available with many problems
#### Built-in Webview version 2 (large size, only used in enterprise version of the system or can not install webview2)
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_x64_fixed_webview2-setup.exe"><img src="https://badgen.net/badge/icon/x64?icon=windows&label=exe"></a><br>
<a href="https://github.com/coolcoala/clash-verge-rev-lite/releases/download/v${{ env.VERSION }}/Clash.Verge.Rev.Lite_${{ env.VERSION }}_arm64_fixed_webview2-setup.exe"><img src="https://badgen.net/badge/icon/arm64?icon=windows&label=exe"></a>
Created at ${{ env.BUILDTIME }}.
EOF
- name: Upload Release
uses: softprops/action-gh-release@v2
with:
tag_name: v${{env.VERSION}}
name: "Clash Verge Rev Lite v${{env.VERSION}}"
body_path: release.txt
token: ${{ secrets.GITHUB_TOKEN }}

View File

@@ -1,3 +1,19 @@
## v0.2.3
- fixed problem with profile inactivation after adding via deeplink on windows
- corrected layout on the proxy page, now all cards are the same size
- corrected announe transposition by \n
- corrected side menu in compressed window
- added check at the main toggle switch, now it cannot be enabled if there are no profiles.
## v0.2.1
- added headers "announce-url", "update-always"
- added a check for the presence of a profile, if it already exists, an update will be performed
- fixed processing of links for displaying telegram icon on the main page
- added profile update button on the main page
## v0.2 ## v0.2
- added handlers for "Announe", "Support-Url", "New-Sub-Domain", "Profile-Title" headers: - added handlers for "Announe", "Support-Url", "New-Sub-Domain", "Profile-Title" headers:

19
hooks/use-mobile.ts Normal file
View File

@@ -0,0 +1,19 @@
import * as React from "react"
const MOBILE_BREAKPOINT = 768
export function useIsMobile() {
const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined)
React.useEffect(() => {
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
const onChange = () => {
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
}
mql.addEventListener("change", onChange)
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
return () => mql.removeEventListener("change", onChange)
}, [])
return !!isMobile
}

View File

@@ -1,6 +1,6 @@
{ {
"name": "clash-verge", "name": "clash-verge",
"version": "0.2.0", "version": "0.2.3",
"license": "GPL-3.0-only", "license": "GPL-3.0-only",
"scripts": { "scripts": {
"dev": "cross-env RUST_BACKTRACE=1 tauri dev -f verge-dev", "dev": "cross-env RUST_BACKTRACE=1 tauri dev -f verge-dev",

View File

@@ -49,9 +49,9 @@ async function resolvePortable() {
zip.addLocalFolder( zip.addLocalFolder(
path.join( path.join(
releaseDir, releaseDir,
`Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.${arch}`, `Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.${arch}`,
), ),
`Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.${arch}`, `Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.${arch}`,
); );
zip.addLocalFolder(configDir, ".config"); zip.addLocalFolder(configDir, ".config");

2
src-tauri/Cargo.lock generated
View File

@@ -1061,7 +1061,7 @@ dependencies = [
[[package]] [[package]]
name = "clash-verge" name = "clash-verge"
version = "0.2.0" version = "0.2.3"
dependencies = [ dependencies = [
"ab_glyph", "ab_glyph",
"aes-gcm", "aes-gcm",

View File

@@ -1,6 +1,6 @@
[package] [package]
name = "clash-verge" name = "clash-verge"
version = "0.2.0" version = "0.2.3"
description = "clash verge" description = "clash verge"
authors = ["zzzgydi", "wonfen", "MystiPanda", "coolcoala"] authors = ["zzzgydi", "wonfen", "MystiPanda", "coolcoala"]
license = "GPL-3.0-only" license = "GPL-3.0-only"

View File

@@ -129,8 +129,24 @@ pub async fn enhance_profiles() -> CmdResult {
/// 导入配置文件 /// 导入配置文件
#[tauri::command] #[tauri::command]
pub async fn import_profile(url: String, option: Option<PrfOption>) -> CmdResult { pub async fn import_profile(url: String, option: Option<PrfOption>) -> CmdResult {
let item = wrap_err!(PrfItem::from_url(&url, None, None, option).await)?; let existing_uid = {
wrap_err!(Config::profiles().data().append_item(item)) let profiles = Config::profiles();
let profiles = profiles.latest();
profiles.items.as_ref()
.and_then(|items| items.iter().find(|item| item.url.as_deref() == Some(&url)))
.and_then(|item| item.uid.clone())
};
if let Some(uid) = existing_uid {
logging!(info, Type::Cmd, true, "The profile with URL {} already exists (UID: {}). Running the update...", url, uid);
update_profile(uid, option).await
} else {
logging!(info, Type::Cmd, true, "Profile with URL {} not found. Create a new one...", url);
let item = wrap_err!(PrfItem::from_url(&url, None, None, option).await)?;
wrap_err!(Config::profiles().data().append_item(item))
}
} }
/// 重新排序配置文件 /// 重新排序配置文件
@@ -647,3 +663,48 @@ pub fn get_next_update_time(uid: String) -> CmdResult<Option<i64>> {
let next_time = timer.get_next_update_time(&uid); let next_time = timer.get_next_update_time(&uid);
Ok(next_time) Ok(next_time)
} }
#[tauri::command]
pub async fn update_profiles_on_startup() -> CmdResult {
logging!(info, Type::Cmd, true, "Checking profiles for updates at startup...");
let profiles_to_update = {
let profiles = Config::profiles();
let profiles = profiles.latest();
profiles.items.as_ref()
.map_or_else(
Vec::new,
|items| items.iter()
.filter(|item| item.option.as_ref().is_some_and(|opt| opt.update_always == Some(true)))
.filter_map(|item| item.uid.clone())
.collect()
)
};
if profiles_to_update.is_empty() {
logging!(info, Type::Cmd, true, "No profiles to update immediately.");
return Ok(());
}
logging!(info, Type::Cmd, true, "Found profiles to update: {:?}", profiles_to_update);
let mut update_futures = Vec::new();
for uid in profiles_to_update {
update_futures.push(update_profile(uid, None));
}
let results = futures::future::join_all(update_futures).await;
if results.iter().any(|res| res.is_ok()) {
logging!(info, Type::Cmd, true, "The startup update is complete, restart the kernel...");
CoreManager::global().update_config().await.map_err(|e| e.to_string())?;
handle::Handle::refresh_clash();
} else {
logging!(warn, Type::Cmd, true, "All updates completed with errors on startup.");
}
Ok(())
}

View File

@@ -63,6 +63,10 @@ pub struct PrfItem {
#[serde(skip_serializing_if = "Option::is_none")] #[serde(skip_serializing_if = "Option::is_none")]
pub announce: Option<String>, pub announce: Option<String>,
/// profile announce url
#[serde(skip_serializing_if = "Option::is_none")]
pub announce_url: Option<String>,
/// the file data /// the file data
#[serde(skip)] #[serde(skip)]
pub file_data: Option<String>, pub file_data: Option<String>,
@@ -126,6 +130,9 @@ pub struct PrfOption {
#[serde(skip_serializing_if = "Option::is_none")] #[serde(skip_serializing_if = "Option::is_none")]
pub use_hwid: Option<bool>, pub use_hwid: Option<bool>,
#[serde(skip_serializing_if = "Option::is_none")]
pub update_always: Option<bool>,
} }
impl PrfOption { impl PrfOption {
@@ -146,6 +153,7 @@ impl PrfOption {
a.groups = b.groups.or(a.groups); a.groups = b.groups.or(a.groups);
a.timeout_seconds = b.timeout_seconds.or(a.timeout_seconds); a.timeout_seconds = b.timeout_seconds.or(a.timeout_seconds);
a.use_hwid = b.use_hwid.or(a.use_hwid); a.use_hwid = b.use_hwid.or(a.use_hwid);
a.update_always = b.update_always.or(a.update_always);
Some(a) Some(a)
} }
t => t.0.or(t.1), t => t.0.or(t.1),
@@ -246,6 +254,7 @@ impl PrfItem {
home: None, home: None,
support_url: None, support_url: None,
announce: None, announce: None,
announce_url: None,
updated: Some(chrono::Local::now().timestamp() as usize), updated: Some(chrono::Local::now().timestamp() as usize),
file_data: Some(file_data.unwrap_or(tmpl::ITEM_LOCAL.into())), file_data: Some(file_data.unwrap_or(tmpl::ITEM_LOCAL.into())),
}) })
@@ -267,7 +276,7 @@ impl PrfItem {
let user_agent = opt_ref.and_then(|o| o.user_agent.clone()); let user_agent = opt_ref.and_then(|o| o.user_agent.clone());
let update_interval = opt_ref.and_then(|o| o.update_interval); let update_interval = opt_ref.and_then(|o| o.update_interval);
let timeout = opt_ref.and_then(|o| o.timeout_seconds).unwrap_or(20); let timeout = opt_ref.and_then(|o| o.timeout_seconds).unwrap_or(20);
let use_hwid = opt_ref.is_some_and(|o| o.use_hwid.unwrap_or(true)); let use_hwid = Config::verge().latest().enable_send_hwid.unwrap_or(true);
let mut merge = opt_ref.and_then(|o| o.merge.clone()); let mut merge = opt_ref.and_then(|o| o.merge.clone());
let mut script = opt_ref.and_then(|o| o.script.clone()); let mut script = opt_ref.and_then(|o| o.script.clone());
let mut rules = opt_ref.and_then(|o| o.rules.clone()); let mut rules = opt_ref.and_then(|o| o.rules.clone());
@@ -373,6 +382,11 @@ impl PrfItem {
}, },
}; };
let update_always = match header.get("update-always") {
Some(value) => value.to_str().unwrap_or("false").parse::<bool>().ok(),
None => None,
};
let home = match header.get("profile-web-page-url") { let home = match header.get("profile-web-page-url") {
Some(value) => { Some(value) => {
let str_value = value.to_str().unwrap_or(""); let str_value = value.to_str().unwrap_or("");
@@ -403,6 +417,14 @@ impl PrfItem {
None => None, None => None,
}; };
let announce_url = match header.get("announce-url") {
Some(value) => {
let str_value = value.to_str().unwrap_or("");
Some(str_value.to_string())
}
None => None,
};
let profile_title = match header.get("profile-title") { let profile_title = match header.get("profile-title") {
Some(value) => { Some(value) => {
let str_value = value.to_str().unwrap_or(""); let str_value = value.to_str().unwrap_or("");
@@ -472,6 +494,7 @@ impl PrfItem {
extra, extra,
option: Some(PrfOption { option: Some(PrfOption {
update_interval, update_interval,
update_always,
merge, merge,
script, script,
rules, rules,
@@ -482,6 +505,7 @@ impl PrfItem {
home, home,
support_url, support_url,
announce, announce,
announce_url,
updated: Some(chrono::Local::now().timestamp() as usize), updated: Some(chrono::Local::now().timestamp() as usize),
file_data: Some(data.into()), file_data: Some(data.into()),
}) })
@@ -511,6 +535,7 @@ impl PrfItem {
home: None, home: None,
support_url: None, support_url: None,
announce: None, announce: None,
announce_url: None,
updated: Some(chrono::Local::now().timestamp() as usize), updated: Some(chrono::Local::now().timestamp() as usize),
file_data: Some(template), file_data: Some(template),
}) })
@@ -535,6 +560,7 @@ impl PrfItem {
home: None, home: None,
support_url: None, support_url: None,
announce: None, announce: None,
announce_url: None,
selected: None, selected: None,
extra: None, extra: None,
option: None, option: None,
@@ -558,6 +584,7 @@ impl PrfItem {
home: None, home: None,
support_url: None, support_url: None,
announce: None, announce: None,
announce_url: None,
selected: None, selected: None,
extra: None, extra: None,
option: None, option: None,
@@ -581,6 +608,7 @@ impl PrfItem {
home: None, home: None,
support_url: None, support_url: None,
announce: None, announce: None,
announce_url: None,
selected: None, selected: None,
extra: None, extra: None,
option: None, option: None,
@@ -604,6 +632,7 @@ impl PrfItem {
home: None, home: None,
support_url: None, support_url: None,
announce: None, announce: None,
announce_url: None,
selected: None, selected: None,
extra: None, extra: None,
option: None, option: None,

View File

@@ -221,6 +221,7 @@ impl IProfiles {
each.updated = item.updated; each.updated = item.updated;
each.home = item.home; each.home = item.home;
each.announce = item.announce; each.announce = item.announce;
each.announce_url = item.announce_url;
each.support_url = item.support_url; each.support_url = item.support_url;
each.name = item.name; each.name = item.name;
each.url = item.url; each.url = item.url;

View File

@@ -74,6 +74,8 @@ pub struct IVerge {
/// enable dns settings - this controls whether dns_config.yaml is applied /// enable dns settings - this controls whether dns_config.yaml is applied
pub enable_dns_settings: Option<bool>, pub enable_dns_settings: Option<bool>,
pub enable_send_hwid: Option<bool>,
pub primary_action: Option<String>, pub primary_action: Option<String>,
/// always use default bypass /// always use default bypass
@@ -403,6 +405,7 @@ impl IVerge {
enable_auto_light_weight_mode: Some(false), enable_auto_light_weight_mode: Some(false),
auto_light_weight_minutes: Some(10), auto_light_weight_minutes: Some(10),
enable_dns_settings: Some(false), enable_dns_settings: Some(false),
enable_send_hwid: Some(true),
primary_action: Some("tun-mode".into()), primary_action: Some("tun-mode".into()),
home_cards: None, home_cards: None,
service_state: None, service_state: None,
@@ -492,6 +495,7 @@ impl IVerge {
patch!(enable_auto_light_weight_mode); patch!(enable_auto_light_weight_mode);
patch!(auto_light_weight_minutes); patch!(auto_light_weight_minutes);
patch!(enable_dns_settings); patch!(enable_dns_settings);
patch!(enable_send_hwid);
patch!(primary_action); patch!(primary_action);
patch!(home_cards); patch!(home_cards);
patch!(service_state); patch!(service_state);
@@ -588,6 +592,7 @@ pub struct IVergeResponse {
pub enable_auto_light_weight_mode: Option<bool>, pub enable_auto_light_weight_mode: Option<bool>,
pub auto_light_weight_minutes: Option<u64>, pub auto_light_weight_minutes: Option<u64>,
pub enable_dns_settings: Option<bool>, pub enable_dns_settings: Option<bool>,
pub enable_send_hwid: Option<bool>,
pub primary_action: Option<String>, pub primary_action: Option<String>,
pub home_cards: Option<serde_json::Value>, pub home_cards: Option<serde_json::Value>,
pub enable_hover_jump_navigator: Option<bool>, pub enable_hover_jump_navigator: Option<bool>,
@@ -661,6 +666,7 @@ impl From<IVerge> for IVergeResponse {
enable_auto_light_weight_mode: verge.enable_auto_light_weight_mode, enable_auto_light_weight_mode: verge.enable_auto_light_weight_mode,
auto_light_weight_minutes: verge.auto_light_weight_minutes, auto_light_weight_minutes: verge.auto_light_weight_minutes,
enable_dns_settings: verge.enable_dns_settings, enable_dns_settings: verge.enable_dns_settings,
enable_send_hwid: verge.enable_send_hwid,
primary_action: verge.primary_action, primary_action: verge.primary_action,
home_cards: verge.home_cards, home_cards: verge.home_cards,
enable_hover_jump_navigator: verge.enable_hover_jump_navigator, enable_hover_jump_navigator: verge.enable_hover_jump_navigator,

View File

@@ -216,6 +216,14 @@ pub fn run() {
app.manage(Mutex::new(state::proxy::CmdProxyState::default())); app.manage(Mutex::new(state::proxy::CmdProxyState::default()));
app.manage(Mutex::new(state::lightweight::LightWeightState::default())); app.manage(Mutex::new(state::lightweight::LightWeightState::default()));
tauri::async_runtime::spawn(async {
tokio::time::sleep(Duration::from_secs(5)).await;
logging!(info, Type::Cmd, true, "Running profile updates at startup...");
if let Err(e) = crate::cmd::update_profiles_on_startup().await {
log::error!("Failed to update profiles on startup: {}", e);
}
});
logging!(info, Type::Setup, true, "初始化完成,继续执行"); logging!(info, Type::Setup, true, "初始化完成,继续执行");
Ok(()) Ok(())
}) })
@@ -295,6 +303,7 @@ pub fn run() {
cmd::read_profile_file, cmd::read_profile_file,
cmd::save_profile_file, cmd::save_profile_file,
cmd::get_next_update_time, cmd::get_next_update_time,
cmd::update_profiles_on_startup,
// script validation // script validation
cmd::script_validate_notice, cmd::script_validate_notice,
cmd::validate_script_file, cmd::validate_script_file,

View File

@@ -552,33 +552,21 @@ pub async fn resolve_scheme(param: String) -> Result<()> {
if link_parsed.scheme() == "clash" || link_parsed.scheme() == "clash-verge" { if link_parsed.scheme() == "clash" || link_parsed.scheme() == "clash-verge" {
let mut name: Option<String> = None; let mut name: Option<String> = None;
let mut url_param: Option<String> = None; let mut url_param: Option<String> = None;
let mut use_hwid = true;
for (key, value) in link_parsed.query_pairs() { for (key, value) in link_parsed.query_pairs() {
match key.as_ref() { match key.as_ref() {
"name" => name = Some(value.into_owned()), "name" => name = Some(value.into_owned()),
"url" => url_param = Some(percent_decode_str(&value).decode_utf8_lossy().to_string()), "url" => url_param = Some(percent_decode_str(&value).decode_utf8_lossy().to_string()),
"hwid" => use_hwid = value == "1" || value == "true",
_ => {} _ => {}
} }
} }
let option = if use_hwid {
log::info!(target:"app", "HWID usage requested via deep link");
Some(PrfOption {
use_hwid: Some(true),
..Default::default()
})
} else {
None
};
match url_param { match url_param {
Some(url) => { Some(url) => {
log::info!(target:"app", "decoded subscription url: {url}"); log::info!(target:"app", "decoded subscription url: {url}");
create_window(false); create_window(true);
match PrfItem::from_url(url.as_ref(), name, None, option).await { match PrfItem::from_url(url.as_ref(), name, None, None).await {
Ok(item) => { Ok(item) => {
let uid = item.uid.clone().unwrap(); let uid = item.uid.clone().unwrap();
let _ = wrap_err!(Config::profiles().data().append_item(item)); let _ = wrap_err!(Config::profiles().data().append_item(item));

View File

@@ -1,5 +1,5 @@
{ {
"version": "0.2.0", "version": "0.2.3",
"$schema": "../node_modules/@tauri-apps/cli/config.schema.json", "$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
"bundle": { "bundle": {
"active": true, "active": true,

View File

@@ -9,7 +9,7 @@
"timestampUrl": "", "timestampUrl": "",
"webviewInstallMode": { "webviewInstallMode": {
"type": "fixedRuntime", "type": "fixedRuntime",
"path": "./Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.arm64/" "path": "./Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.arm64/"
}, },
"nsis": { "nsis": {
"displayLanguageSelector": true, "displayLanguageSelector": true,

View File

@@ -9,7 +9,7 @@
"timestampUrl": "", "timestampUrl": "",
"webviewInstallMode": { "webviewInstallMode": {
"type": "fixedRuntime", "type": "fixedRuntime",
"path": "./Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.x64/" "path": "./Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.x64/"
}, },
"nsis": { "nsis": {
"displayLanguageSelector": true, "displayLanguageSelector": true,

View File

@@ -9,7 +9,7 @@
"timestampUrl": "", "timestampUrl": "",
"webviewInstallMode": { "webviewInstallMode": {
"type": "fixedRuntime", "type": "fixedRuntime",
"path": "./Microsoft.WebView2.FixedVersionRuntime.109.0.1518.78.x86/" "path": "./Microsoft.WebView2.FixedVersionRuntime.133.0.3065.92.x86/"
}, },
"nsis": { "nsis": {
"displayLanguageSelector": true, "displayLanguageSelector": true,

View File

@@ -0,0 +1,97 @@
import { Link } from 'react-router-dom';
import {
Sidebar,
SidebarContent, SidebarFooter,
SidebarGroup,
SidebarGroupContent,
SidebarHeader,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem, useSidebar,
} from "@/components/ui/sidebar"
import { t } from 'i18next';
import { cn } from '@root/lib/utils';
import {
Home,
Users,
Server,
Cable,
ListChecks,
FileText,
Settings, EarthLock,
} from 'lucide-react';
import { UpdateButton } from "@/components/layout/update-button";
import React from "react";
import { SheetClose } from '@/components/ui/sheet';
const menuItems = [
{ title: 'Home', url: '/home', icon: Home },
{ title: 'Profiles', url: '/profile', icon: Users },
{ title: 'Proxies', url: '/proxies', icon: Server },
{ title: 'Connections', url: '/connections', icon: Cable },
{ title: 'Rules', url: '/rules', icon: ListChecks },
{ title: 'Logs', url: '/logs', icon: FileText },
{ title: 'Settings', url: '/settings', icon: Settings },
];
export function AppSidebar() {
const { isMobile } = useSidebar();
return (
<Sidebar variant="floating" collapsible="icon">
<SidebarHeader>
<SidebarMenuButton>
<EarthLock/>
<span className="font-semibold group-data-[state=collapsed]:hidden">
Clash Koala
</span>
</SidebarMenuButton>
</SidebarHeader>
<SidebarContent>
<SidebarGroup>
<SidebarGroupContent>
<SidebarMenu className="gap-3">
{menuItems.map((item) => {
const isActive = location.pathname === item.url;
const linkElement = (
<Link
key={item.title}
to={item.url}
className={cn(
'flex items-center gap-3 rounded-lg px-3 py-2 text-muted-foreground transition-all hover:text-primary',
'data-[active=true]:font-semibold data-[active=true]:border'
)}
>
<item.icon className="h-4 w-4 drop-shadow-md" />
{t(item.title)}
</Link>
)
return (
<SidebarMenuItem key={item.title} className="my-1">
<SidebarMenuButton
asChild
isActive={isActive}
tooltip={t(item.title)}>
{isMobile ? (
<SheetClose asChild>
{linkElement}
</SheetClose>
) : (
linkElement
)}
</SidebarMenuButton>
</SidebarMenuItem>
)
})}
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
<SidebarFooter>
<div className="w-full flex justify-center">
<UpdateButton className="bg-green-700 hover:bg-green-500 hover:text-white text-white text-shadow-md" />
</div>
</SidebarFooter>
</Sidebar>
)
}

View File

@@ -5,6 +5,9 @@ import { UpdateViewer } from "../setting/mods/update-viewer";
import { DialogRef } from "../base"; import { DialogRef } from "../base";
import { useVerge } from "@/hooks/use-verge"; import { useVerge } from "@/hooks/use-verge";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { t } from "i18next";
import {Download, RefreshCw} from "lucide-react";
import { useSidebar } from "../ui/sidebar";
interface Props { interface Props {
className?: string; className?: string;
@@ -14,6 +17,7 @@ export const UpdateButton = (props: Props) => {
const { className } = props; const { className } = props;
const { verge } = useVerge(); const { verge } = useVerge();
const { auto_check_update } = verge || {}; const { auto_check_update } = verge || {};
const { state: sidebarState } = useSidebar();
const viewerRef = useRef<DialogRef>(null); const viewerRef = useRef<DialogRef>(null);
@@ -32,15 +36,26 @@ export const UpdateButton = (props: Props) => {
return ( return (
<> <>
<UpdateViewer ref={viewerRef} /> <UpdateViewer ref={viewerRef} />
{sidebarState === 'collapsed' ? (
<Button <Button
variant="destructive" variant="outline"
size="sm" size="icon"
className={className} className={className}
onClick={() => viewerRef.current?.open()} onClick={() => viewerRef.current?.open()}
> >
New <Download />
</Button> </Button>
) : (
<Button
variant="outline"
size="lg"
className={className}
onClick={() => viewerRef.current?.open()}
>
<Download />
{t("New update")}
</Button>
)}
</> </>
); );
}; };

View File

@@ -447,6 +447,21 @@ export const ProfileViewer = forwardRef<ProfileViewerRef, Props>(
</FormItem> </FormItem>
)} )}
/> />
<FormField
control={control}
name="option.update_always"
render={({ field }) => (
<FormItem className="flex flex-row items-center justify-between">
<FormLabel>{t("Update on Startup")}</FormLabel>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
<FormField <FormField
control={control} control={control}
name="option.with_proxy" name="option.with_proxy"

View File

@@ -66,7 +66,7 @@ export const ProxyItemMini = (props: Props) => {
title={`${proxy.name}\n${proxy.now ?? ""}`} title={`${proxy.name}\n${proxy.now ?? ""}`}
className="group relative flex h-16 cursor-pointer items-center justify-between rounded-lg border bg-card p-3 shadow-sm transition-colors duration-200 hover:bg-accent data-[selected=true]:ring-2 data-[selected=true]:ring-primary" className="group relative flex h-16 cursor-pointer items-center justify-between rounded-lg border bg-card p-3 shadow-sm transition-colors duration-200 hover:bg-accent data-[selected=true]:ring-2 data-[selected=true]:ring-primary"
> >
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0 w-0">
<p className="truncate text-sm font-medium">{proxy.name}</p> <p className="truncate text-sm font-medium">{proxy.name}</p>
{showType && ( {showType && (

View File

@@ -118,7 +118,7 @@ export const UpdateViewer = forwardRef<DialogRef>((props, ref) => {
<Dialog open={open} onOpenChange={setOpen}> <Dialog open={open} onOpenChange={setOpen}>
<DialogContent className="sm:max-w-2xl"> <DialogContent className="sm:max-w-2xl">
<DialogHeader> <DialogHeader>
<div className="flex justify-between items-center"> <div className="flex justify-between items-center pr-5">
<DialogTitle> <DialogTitle>
{t("New Version")} v{updateInfo?.version} {t("New Version")} v{updateInfo?.version}
</DialogTitle> </DialogTitle>

View File

@@ -43,6 +43,7 @@ import {
Power, Power,
BellOff, BellOff,
Repeat, Repeat,
Fingerprint
} from "lucide-react"; } from "lucide-react";
// Модальные окна // Модальные окна
@@ -390,6 +391,22 @@ const SettingSystem = ({ onError }: Props) => {
</Select> </Select>
</GuardState> </GuardState>
</SettingRow> </SettingRow>
<SettingRow
label={<LabelWithIcon icon={Fingerprint} text={t("Send HWID")} />}
>
<GuardState
value={verge?.enable_send_hwid ?? true} // По умолчанию включено
valueProps="checked"
onChangeProps="onCheckedChange"
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ enable_send_hwid: e })}
onGuard={(e) => patchVerge({ enable_send_hwid: e })}
onCatch={onError}
>
<Switch />
</GuardState>
</SettingRow>
</div> </div>
</div> </div>
); );

View File

@@ -0,0 +1,724 @@
import * as React from "react"
import { Slot } from "@radix-ui/react-slot"
import { cva, VariantProps } from "class-variance-authority"
import { PanelLeftIcon } from "lucide-react"
import { useIsMobile } from "@root/hooks/use-mobile"
import { cn } from "@root/lib/utils"
import { Button } from "@root/src/components/ui/button"
import { Input } from "@root/src/components/ui/input"
import { Separator } from "@root/src/components/ui/separator"
import {
Sheet,
SheetContent,
SheetDescription,
SheetHeader,
SheetTitle,
} from "@root/src/components/ui/sheet"
import { Skeleton } from "@root/src/components/ui/skeleton"
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@root/src/components/ui/tooltip"
const SIDEBAR_COOKIE_NAME = "sidebar_state"
const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7
const SIDEBAR_WIDTH = "16rem"
const SIDEBAR_WIDTH_MOBILE = "18rem"
const SIDEBAR_WIDTH_ICON = "3rem"
const SIDEBAR_KEYBOARD_SHORTCUT = "b"
type SidebarContextProps = {
state: "expanded" | "collapsed"
open: boolean
setOpen: (open: boolean) => void
openMobile: boolean
setOpenMobile: (open: boolean) => void
isMobile: boolean
toggleSidebar: () => void
}
const SidebarContext = React.createContext<SidebarContextProps | null>(null)
function useSidebar() {
const context = React.useContext(SidebarContext)
if (!context) {
throw new Error("useSidebar must be used within a SidebarProvider.")
}
return context
}
function SidebarProvider({
defaultOpen = true,
open: openProp,
onOpenChange: setOpenProp,
className,
style,
children,
...props
}: React.ComponentProps<"div"> & {
defaultOpen?: boolean
open?: boolean
onOpenChange?: (open: boolean) => void
}) {
const isMobile = useIsMobile()
const [openMobile, setOpenMobile] = React.useState(false)
// This is the internal state of the sidebar.
// We use openProp and setOpenProp for control from outside the component.
const [_open, _setOpen] = React.useState(defaultOpen)
const open = openProp ?? _open
const setOpen = React.useCallback(
(value: boolean | ((value: boolean) => boolean)) => {
const openState = typeof value === "function" ? value(open) : value
if (setOpenProp) {
setOpenProp(openState)
} else {
_setOpen(openState)
}
// This sets the cookie to keep the sidebar state.
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`
},
[setOpenProp, open]
)
// Helper to toggle the sidebar.
const toggleSidebar = React.useCallback(() => {
return isMobile ? setOpenMobile((open) => !open) : setOpen((open) => !open)
}, [isMobile, setOpen, setOpenMobile])
// Adds a keyboard shortcut to toggle the sidebar.
React.useEffect(() => {
const handleKeyDown = (event: KeyboardEvent) => {
if (
event.key === SIDEBAR_KEYBOARD_SHORTCUT &&
(event.metaKey || event.ctrlKey)
) {
event.preventDefault()
toggleSidebar()
}
}
window.addEventListener("keydown", handleKeyDown)
return () => window.removeEventListener("keydown", handleKeyDown)
}, [toggleSidebar])
// We add a state so that we can do data-state="expanded" or "collapsed".
// This makes it easier to style the sidebar with Tailwind classes.
const state = open ? "expanded" : "collapsed"
const contextValue = React.useMemo<SidebarContextProps>(
() => ({
state,
open,
setOpen,
isMobile,
openMobile,
setOpenMobile,
toggleSidebar,
}),
[state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
)
return (
<SidebarContext.Provider value={contextValue}>
<TooltipProvider delayDuration={0}>
<div
data-slot="sidebar-wrapper"
style={
{
"--sidebar-width": SIDEBAR_WIDTH,
"--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
...style,
} as React.CSSProperties
}
className={cn(
"group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full",
className
)}
{...props}
>
{children}
</div>
</TooltipProvider>
</SidebarContext.Provider>
)
}
function Sidebar({
side = "left",
variant = "sidebar",
collapsible = "offcanvas",
className,
children,
...props
}: React.ComponentProps<"div"> & {
side?: "left" | "right"
variant?: "sidebar" | "floating" | "inset"
collapsible?: "offcanvas" | "icon" | "none"
}) {
const { isMobile, state, openMobile, setOpenMobile } = useSidebar()
if (collapsible === "none") {
return (
<div
data-slot="sidebar"
className={cn(
"bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col",
className
)}
{...props}
>
{children}
</div>
)
}
if (isMobile) {
return (
<Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>
<SheetContent
data-sidebar="sidebar"
data-slot="sidebar"
data-mobile="true"
className="bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden"
style={
{
"--sidebar-width": SIDEBAR_WIDTH_MOBILE,
} as React.CSSProperties
}
side={side}
>
<SheetHeader className="sr-only">
<SheetTitle>Sidebar</SheetTitle>
<SheetDescription>Displays the mobile sidebar.</SheetDescription>
</SheetHeader>
<div className="flex h-full w-full flex-col">{children}</div>
</SheetContent>
</Sheet>
)
}
return (
<div
className="group peer text-sidebar-foreground hidden md:block"
data-state={state}
data-collapsible={state === "collapsed" ? collapsible : ""}
data-variant={variant}
data-side={side}
data-slot="sidebar"
>
{/* This is what handles the sidebar gap on desktop */}
<div
data-slot="sidebar-gap"
className={cn(
"relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
"group-data-[collapsible=offcanvas]:w-0",
"group-data-[side=right]:rotate-180",
variant === "floating" || variant === "inset"
? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]"
: "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
)}
/>
<div
data-slot="sidebar-container"
className={cn(
"fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
side === "left"
? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]"
: "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
// Adjust the padding for floating and inset variants.
variant === "floating" || variant === "inset"
? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"
: "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
className
)}
{...props}
>
<div
data-sidebar="sidebar"
data-slot="sidebar-inner"
className="bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm"
>
{children}
</div>
</div>
</div>
)
}
function SidebarTrigger({
className,
onClick,
...props
}: React.ComponentProps<typeof Button>) {
const { toggleSidebar } = useSidebar()
return (
<Button
data-sidebar="trigger"
data-slot="sidebar-trigger"
variant="ghost"
size="icon"
className={cn("size-7", className)}
onClick={(event) => {
onClick?.(event)
toggleSidebar()
}}
{...props}
>
<PanelLeftIcon />
<span className="sr-only">Toggle Sidebar</span>
</Button>
)
}
function SidebarRail({ className, ...props }: React.ComponentProps<"button">) {
const { toggleSidebar } = useSidebar()
return (
<button
data-sidebar="rail"
data-slot="sidebar-rail"
aria-label="Toggle Sidebar"
tabIndex={-1}
onClick={toggleSidebar}
title="Toggle Sidebar"
className={cn(
"hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex",
"in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
"[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
"hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full",
"[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
"[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
className
)}
{...props}
/>
)
}
function SidebarInset({ className, ...props }: React.ComponentProps<"main">) {
return (
<main
data-slot="sidebar-inset"
className={cn(
"bg-background relative flex w-full flex-1 flex-col",
"md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
className
)}
{...props}
/>
)
}
function SidebarInput({
className,
...props
}: React.ComponentProps<typeof Input>) {
return (
<Input
data-slot="sidebar-input"
data-sidebar="input"
className={cn("bg-background h-8 w-full shadow-none", className)}
{...props}
/>
)
}
function SidebarHeader({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="sidebar-header"
data-sidebar="header"
className={cn("flex flex-col gap-2 p-2", className)}
{...props}
/>
)
}
function SidebarFooter({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="sidebar-footer"
data-sidebar="footer"
className={cn("flex flex-col gap-2 p-2", className)}
{...props}
/>
)
}
function SidebarSeparator({
className,
...props
}: React.ComponentProps<typeof Separator>) {
return (
<Separator
data-slot="sidebar-separator"
data-sidebar="separator"
className={cn("bg-sidebar-border mx-2 w-auto", className)}
{...props}
/>
)
}
function SidebarContent({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="sidebar-content"
data-sidebar="content"
className={cn(
"flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
className
)}
{...props}
/>
)
}
function SidebarGroup({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="sidebar-group"
data-sidebar="group"
className={cn("relative flex w-full min-w-0 flex-col p-2", className)}
{...props}
/>
)
}
function SidebarGroupLabel({
className,
asChild = false,
...props
}: React.ComponentProps<"div"> & { asChild?: boolean }) {
const Comp = asChild ? Slot : "div"
return (
<Comp
data-slot="sidebar-group-label"
data-sidebar="group-label"
className={cn(
"text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
"group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
className
)}
{...props}
/>
)
}
function SidebarGroupAction({
className,
asChild = false,
...props
}: React.ComponentProps<"button"> & { asChild?: boolean }) {
const Comp = asChild ? Slot : "button"
return (
<Comp
data-slot="sidebar-group-action"
data-sidebar="group-action"
className={cn(
"text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
// Increases the hit area of the button on mobile.
"after:absolute after:-inset-2 md:after:hidden",
"group-data-[collapsible=icon]:hidden",
className
)}
{...props}
/>
)
}
function SidebarGroupContent({
className,
...props
}: React.ComponentProps<"div">) {
return (
<div
data-slot="sidebar-group-content"
data-sidebar="group-content"
className={cn("w-full text-sm", className)}
{...props}
/>
)
}
function SidebarMenu({ className, ...props }: React.ComponentProps<"ul">) {
return (
<ul
data-slot="sidebar-menu"
data-sidebar="menu"
className={cn("flex w-full min-w-0 flex-col gap-1", className)}
{...props}
/>
)
}
function SidebarMenuItem({ className, ...props }: React.ComponentProps<"li">) {
return (
<li
data-slot="sidebar-menu-item"
data-sidebar="menu-item"
className={cn("group/menu-item relative", className)}
{...props}
/>
)
}
const sidebarMenuButtonVariants = cva(
"peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
{
variants: {
variant: {
default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
outline:
"bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]",
},
size: {
default: "h-8 text-sm",
sm: "h-7 text-xs",
lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!",
},
},
defaultVariants: {
variant: "default",
size: "default",
},
}
)
function SidebarMenuButton({
asChild = false,
isActive = false,
variant = "default",
size = "default",
tooltip,
className,
...props
}: React.ComponentProps<"button"> & {
asChild?: boolean
isActive?: boolean
tooltip?: string | React.ComponentProps<typeof TooltipContent>
} & VariantProps<typeof sidebarMenuButtonVariants>) {
const Comp = asChild ? Slot : "button"
const { isMobile, state } = useSidebar()
const button = (
<Comp
data-slot="sidebar-menu-button"
data-sidebar="menu-button"
data-size={size}
data-active={isActive}
className={cn(sidebarMenuButtonVariants({ variant, size }), className)}
{...props}
/>
)
if (!tooltip) {
return button
}
if (typeof tooltip === "string") {
tooltip = {
children: tooltip,
}
}
return (
<Tooltip>
<TooltipTrigger asChild>{button}</TooltipTrigger>
<TooltipContent
side="right"
align="center"
hidden={state !== "collapsed" || isMobile}
{...tooltip}
/>
</Tooltip>
)
}
function SidebarMenuAction({
className,
asChild = false,
showOnHover = false,
...props
}: React.ComponentProps<"button"> & {
asChild?: boolean
showOnHover?: boolean
}) {
const Comp = asChild ? Slot : "button"
return (
<Comp
data-slot="sidebar-menu-action"
data-sidebar="menu-action"
className={cn(
"text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
// Increases the hit area of the button on mobile.
"after:absolute after:-inset-2 md:after:hidden",
"peer-data-[size=sm]/menu-button:top-1",
"peer-data-[size=default]/menu-button:top-1.5",
"peer-data-[size=lg]/menu-button:top-2.5",
"group-data-[collapsible=icon]:hidden",
showOnHover &&
"peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0",
className
)}
{...props}
/>
)
}
function SidebarMenuBadge({
className,
...props
}: React.ComponentProps<"div">) {
return (
<div
data-slot="sidebar-menu-badge"
data-sidebar="menu-badge"
className={cn(
"text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none",
"peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
"peer-data-[size=sm]/menu-button:top-1",
"peer-data-[size=default]/menu-button:top-1.5",
"peer-data-[size=lg]/menu-button:top-2.5",
"group-data-[collapsible=icon]:hidden",
className
)}
{...props}
/>
)
}
function SidebarMenuSkeleton({
className,
showIcon = false,
...props
}: React.ComponentProps<"div"> & {
showIcon?: boolean
}) {
// Random width between 50 to 90%.
const width = React.useMemo(() => {
return `${Math.floor(Math.random() * 40) + 50}%`
}, [])
return (
<div
data-slot="sidebar-menu-skeleton"
data-sidebar="menu-skeleton"
className={cn("flex h-8 items-center gap-2 rounded-md px-2", className)}
{...props}
>
{showIcon && (
<Skeleton
className="size-4 rounded-md"
data-sidebar="menu-skeleton-icon"
/>
)}
<Skeleton
className="h-4 max-w-(--skeleton-width) flex-1"
data-sidebar="menu-skeleton-text"
style={
{
"--skeleton-width": width,
} as React.CSSProperties
}
/>
</div>
)
}
function SidebarMenuSub({ className, ...props }: React.ComponentProps<"ul">) {
return (
<ul
data-slot="sidebar-menu-sub"
data-sidebar="menu-sub"
className={cn(
"border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5",
"group-data-[collapsible=icon]:hidden",
className
)}
{...props}
/>
)
}
function SidebarMenuSubItem({
className,
...props
}: React.ComponentProps<"li">) {
return (
<li
data-slot="sidebar-menu-sub-item"
data-sidebar="menu-sub-item"
className={cn("group/menu-sub-item relative", className)}
{...props}
/>
)
}
function SidebarMenuSubButton({
asChild = false,
size = "md",
isActive = false,
className,
...props
}: React.ComponentProps<"a"> & {
asChild?: boolean
size?: "sm" | "md"
isActive?: boolean
}) {
const Comp = asChild ? Slot : "a"
return (
<Comp
data-slot="sidebar-menu-sub-button"
data-sidebar="menu-sub-button"
data-size={size}
data-active={isActive}
className={cn(
"text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
"data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
size === "sm" && "text-xs",
size === "md" && "text-sm",
"group-data-[collapsible=icon]:hidden",
className
)}
{...props}
/>
)
}
export {
Sidebar,
SidebarContent,
SidebarFooter,
SidebarGroup,
SidebarGroupAction,
SidebarGroupContent,
SidebarGroupLabel,
SidebarHeader,
SidebarInput,
SidebarInset,
SidebarMenu,
SidebarMenuAction,
SidebarMenuBadge,
SidebarMenuButton,
SidebarMenuItem,
SidebarMenuSkeleton,
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
SidebarProvider,
SidebarRail,
SidebarSeparator,
SidebarTrigger,
useSidebar,
}

View File

@@ -0,0 +1,13 @@
import { cn } from "@root/lib/utils"
function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="skeleton"
className={cn("bg-accent animate-pulse rounded-md", className)}
{...props}
/>
)
}
export { Skeleton }

View File

@@ -660,5 +660,10 @@
"Show Advanced Settings": "Show Advanced Settings", "Show Advanced Settings": "Show Advanced Settings",
"Hide Advanced Settings": "Hide Advanced Settings", "Hide Advanced Settings": "Hide Advanced Settings",
"Main Toggle Action": "Main Toggle Action", "Main Toggle Action": "Main Toggle Action",
"Support": "Support" "Support": "Support",
"Update on Startup": "Update on Startup",
"Send HWID": "Send HWID",
"New Version is available": "New Version is available",
"New Version": "New Version",
"New update": "New update"
} }

View File

@@ -612,5 +612,10 @@
"Show Advanced Settings": "Показать дополнительные настройки", "Show Advanced Settings": "Показать дополнительные настройки",
"Hide Advanced Settings": "Скрыть дополнительные настройки", "Hide Advanced Settings": "Скрыть дополнительные настройки",
"Main Toggle Action": "Действие главного переключателя", "Main Toggle Action": "Действие главного переключателя",
"Support": "Поддержка" "Support": "Поддержка",
"Update on Startup": "Обновлять при запуске",
"Send HWID": "Отправлять HWID",
"New Version is available": "Доступна новая версия",
"New Version": "Новая версия",
"New update": "Доступно обновление"
} }

View File

@@ -5,23 +5,15 @@ import { SWRConfig, mutate } from "swr";
import { useEffect, useCallback, useState, useRef } from "react"; import { useEffect, useCallback, useState, useRef } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useLocation, useRoutes, useNavigate } from "react-router-dom"; import { useLocation, useRoutes, useNavigate } from "react-router-dom";
import { List, Paper, ThemeProvider, SvgIcon } from "@mui/material";
import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow"; import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
import { routers } from "./_routers"; import { routers } from "./_routers";
import { getAxios } from "@/services/api"; import { getAxios } from "@/services/api";
import { useVerge } from "@/hooks/use-verge"; import { useVerge } from "@/hooks/use-verge";
import LogoSvg from "@/assets/image/logo.svg?react";
import iconLight from "@/assets/image/icon_light.svg?react";
import iconDark from "@/assets/image/icon_dark.svg?react";
import { useThemeMode, useEnableLog } from "@/services/states"; import { useThemeMode, useEnableLog } from "@/services/states";
import { LayoutItem } from "@/components/layout/layout-item";
import { LayoutTraffic } from "@/components/layout/layout-traffic";
import { UpdateButton } from "@/components/layout/update-button";
import { useCustomTheme } from "@/components/layout/use-custom-theme"; import { useCustomTheme } from "@/components/layout/use-custom-theme";
import getSystem from "@/utils/get-system"; import getSystem from "@/utils/get-system";
import "dayjs/locale/ru"; import "dayjs/locale/ru";
import "dayjs/locale/zh-cn"; import "dayjs/locale/zh-cn";
import { getPortableFlag } from "@/services/cmds";
import React from "react"; import React from "react";
import { useListen } from "@/hooks/use-listen"; import { useListen } from "@/hooks/use-listen";
import { listen } from "@tauri-apps/api/event"; import { listen } from "@tauri-apps/api/event";
@@ -30,6 +22,8 @@ import { initGlobalLogService } from "@/services/global-log-service";
import { invoke } from "@tauri-apps/api/core"; import { invoke } from "@tauri-apps/api/core";
import { showNotice } from "@/services/noticeService"; import { showNotice } from "@/services/noticeService";
import { NoticeManager } from "@/components/base/NoticeManager"; import { NoticeManager } from "@/components/base/NoticeManager";
import { SidebarProvider, useSidebar } from "@/components/ui/sidebar";
import { AppSidebar } from "@/components/layout/sidebar";
const appWindow = getCurrentWebviewWindow(); const appWindow = getCurrentWebviewWindow();
export let portableFlag = false; export let portableFlag = false;
@@ -38,23 +32,23 @@ dayjs.extend(relativeTime);
const OS = getSystem(); const OS = getSystem();
// 通知处理函数 // Notification Handler
const handleNoticeMessage = ( const handleNoticeMessage = (
status: string, status: string,
msg: string, msg: string,
t: (key: string) => string, t: (key: string) => string,
navigate: (path: string, options?: any) => void, navigate: (path: string, options?: any) => void,
) => { ) => {
console.log("[通知监听 V2] 收到消息:", status, msg); console.log("[Notification Listener V2] Receiving a message:", status, msg);
switch (status) { switch (status) {
case "import_sub_url::ok": case "import_sub_url::ok":
mutate("getProfiles"); mutate("getProfiles");
navigate("/profile", { state: { current: msg } }); navigate("/");
showNotice("success", t("Import Subscription Successful")); showNotice("success", t("Import Subscription Successful"));
sessionStorage.setItem('activateProfile', msg);
break; break;
case "import_sub_url::error": case "import_sub_url::error":
navigate("/profile");
showNotice("error", msg); showNotice("error", msg);
break; break;
case "set_config::error": case "set_config::error":
@@ -142,7 +136,7 @@ const handleNoticeMessage = (
showNotice("error", `${t("Failed to Change Core")}: ${msg}`); showNotice("error", `${t("Failed to Change Core")}: ${msg}`);
break; break;
default: // Optional: Log unhandled statuses default: // Optional: Log unhandled statuses
console.warn(`[通知监听 V2] 未处理的状态: ${status}`); console.warn(`[Notification Listener V2] Unprocessed state: ${status}`);
break; break;
} }
}; };
@@ -169,14 +163,14 @@ const Layout = () => {
try { try {
handleNoticeMessage(status, msg, t, navigate); handleNoticeMessage(status, msg, t, navigate);
} catch (error) { } catch (error) {
console.error("[Layout] 处理通知消息失败:", error); console.error("[Layout] Failure to process a notification message:", error);
} }
}, 0); }, 0);
}, },
[t, navigate], [t, navigate],
); );
// 初始化全局日志服务 // Initialize the global logging service
useEffect(() => { useEffect(() => {
if (clashInfo) { if (clashInfo) {
const { server = "", secret = "" } = clashInfo; const { server = "", secret = "" } = clashInfo;
@@ -184,7 +178,7 @@ const Layout = () => {
} }
}, [clashInfo, enableLog]); }, [clashInfo, enableLog]);
// 设置监听器 // Setting up a listener
useEffect(() => { useEffect(() => {
const listeners = [ const listeners = [
addListener("verge://refresh-clash-config", async () => { addListener("verge://refresh-clash-config", async () => {
@@ -230,11 +224,11 @@ const Layout = () => {
try { try {
unlisten(); unlisten();
} catch (error) { } catch (error) {
console.error("[Layout] 清理事件监听器失败:", error); console.error("[Layout] Failed to clear event listener:", error);
} }
}) })
.catch((error) => { .catch((error) => {
console.error("[Layout] 获取unlisten函数失败:", error); console.error("[Layout] Failed to get unlisten function:", error);
}); });
} }
}); });
@@ -244,11 +238,11 @@ const Layout = () => {
try { try {
cleanup(); cleanup();
} catch (error) { } catch (error) {
console.error("[Layout] 清理窗口监听器失败:", error); console.error("[Layout] Failed to clear window listener:", error);
} }
}) })
.catch((error) => { .catch((error) => {
console.error("[Layout] 获取cleanup函数失败:", error); console.error("[Layout] Failed to get cleanup function:", error);
}); });
}, 0); }, 0);
}; };
@@ -256,10 +250,10 @@ const Layout = () => {
useEffect(() => { useEffect(() => {
if (initRef.current) { if (initRef.current) {
console.log("[Layout] 初始化代码已执行过,跳过"); console.log("[Layout] Initialization code has already been executed, skip");
return; return;
} }
console.log("[Layout] 开始执行初始化代码"); console.log("[Layout] Begin executing initialization code");
initRef.current = true; initRef.current = true;
let isInitialized = false; let isInitialized = false;
@@ -269,27 +263,27 @@ const Layout = () => {
const notifyBackend = async (action: string, stage?: string) => { const notifyBackend = async (action: string, stage?: string) => {
try { try {
if (stage) { if (stage) {
console.log(`[Layout] 通知后端 ${action}: ${stage}`); console.log(`[Layout] Notification Backend ${action}: ${stage}`);
await invoke("update_ui_stage", { stage }); await invoke("update_ui_stage", { stage });
} else { } else {
console.log(`[Layout] 通知后端 ${action}`); console.log(`[Layout] Notification Backend ${action}`);
await invoke("notify_ui_ready"); await invoke("notify_ui_ready");
} }
} catch (err) { } catch (err) {
console.error(`[Layout] 通知失败 ${action}:`, err); console.error(`[Layout] Notification failure ${action}:`, err);
} }
}; };
const removeLoadingOverlay = () => { const removeLoadingOverlay = () => {
const initialOverlay = document.getElementById("initial-loading-overlay"); const initialOverlay = document.getElementById("initial-loading-overlay");
if (initialOverlay) { if (initialOverlay) {
console.log("[Layout] 移除加载指示器"); console.log("[Layout] Remove loading indicator");
initialOverlay.style.opacity = "0"; initialOverlay.style.opacity = "0";
setTimeout(() => { setTimeout(() => {
try { try {
initialOverlay.remove(); initialOverlay.remove();
} catch (e) { } catch (e) {
console.log("[Layout] 加载指示器已被移除"); console.log("[Layout] Load indicator has been removed");
} }
}, 300); }, 300);
} }
@@ -297,23 +291,23 @@ const Layout = () => {
const performInitialization = async () => { const performInitialization = async () => {
if (isInitialized) { if (isInitialized) {
console.log("[Layout] 已经初始化过,跳过"); console.log("[Layout] Already initialized, skip");
return; return;
} }
initializationAttempts++; initializationAttempts++;
console.log(`[Layout] 开始第 ${initializationAttempts} 次初始化尝试`); console.log(`[Layout] Start ${initializationAttempts} for the first time`);
try { try {
removeLoadingOverlay(); removeLoadingOverlay();
await notifyBackend("加载阶段", "Loading"); await notifyBackend("Loading phase", "Loading");
await new Promise<void>((resolve) => { await new Promise<void>((resolve) => {
const checkReactMount = () => { const checkReactMount = () => {
const rootElement = document.getElementById("root"); const rootElement = document.getElementById("root");
if (rootElement && rootElement.children.length > 0) { if (rootElement && rootElement.children.length > 0) {
console.log("[Layout] React组件已挂载"); console.log("[Layout] React components are mounted");
resolve(); resolve();
} else { } else {
setTimeout(checkReactMount, 50); setTimeout(checkReactMount, 50);
@@ -323,43 +317,43 @@ const Layout = () => {
checkReactMount(); checkReactMount();
setTimeout(() => { setTimeout(() => {
console.log("[Layout] React组件挂载检查超时,继续执行"); console.log("[Layout] React components mount check timeout, continue execution");
resolve(); resolve();
}, 2000); }, 2000);
}); });
await notifyBackend("DOM就绪", "DomReady"); await notifyBackend("DOM ready", "DomReady");
await new Promise<void>((resolve) => { await new Promise<void>((resolve) => {
requestAnimationFrame(() => resolve()); requestAnimationFrame(() => resolve());
}); });
await notifyBackend("资源加载完成", "ResourcesLoaded"); await notifyBackend("Resource loading completed", "ResourcesLoaded");
await notifyBackend("UI就绪"); await notifyBackend("UI ready");
isInitialized = true; isInitialized = true;
console.log(`[Layout] ${initializationAttempts} 次初始化完成`); console.log(`[Layout] The ${initializationAttempts} initialization is complete`);
} catch (error) { } catch (error) {
console.error( console.error(
`[Layout] ${initializationAttempts} 次初始化失败:`, `[Layout] Initialization failure at ${initializationAttempts}:`,
error, error,
); );
if (initializationAttempts < maxAttempts) { if (initializationAttempts < maxAttempts) {
console.log( console.log(
`[Layout] 将在500ms后进行第 ${initializationAttempts + 1} 次重试`, `[Layout] The first ${initializationAttempts + 1} retry will be made after 500ms`,
); );
setTimeout(performInitialization, 500); setTimeout(performInitialization, 500);
} else { } else {
console.error("[Layout] 所有初始化尝试都失败,执行紧急初始化"); console.error("[Layout] All initialization attempts fail, perform emergency initialization");
removeLoadingOverlay(); removeLoadingOverlay();
try { try {
await notifyBackend("UI就绪"); await notifyBackend("UI ready");
isInitialized = true; isInitialized = true;
} catch (e) { } catch (e) {
console.error("[Layout] 紧急初始化也失败:", e); console.error("[Layout] Emergency initialization also failed:", e);
} }
} }
} }
@@ -369,39 +363,39 @@ const Layout = () => {
const setupEventListener = async () => { const setupEventListener = async () => {
try { try {
console.log("[Layout] 开始监听启动完成事件"); console.log("[Layout] Start listening for startup completion events");
const unlisten = await listen("verge://startup-completed", () => { const unlisten = await listen("verge://startup-completed", () => {
if (!hasEventTriggered) { if (!hasEventTriggered) {
console.log("[Layout] 收到启动完成事件,开始初始化"); console.log("[Layout] Receive startup completion event, start initialization");
hasEventTriggered = true; hasEventTriggered = true;
performInitialization(); performInitialization();
} }
}); });
return unlisten; return unlisten;
} catch (err) { } catch (err) {
console.error("[Layout] 监听启动完成事件失败:", err); console.error("[Layout] Failed to listen for startup completion event:", err);
return () => {}; return () => {};
} }
}; };
const checkImmediateInitialization = async () => { const checkImmediateInitialization = async () => {
try { try {
console.log("[Layout] 检查后端是否已就绪"); console.log("[Layout] Check if the backend is ready");
await invoke("update_ui_stage", { stage: "Loading" }); await invoke("update_ui_stage", { stage: "Loading" });
if (!hasEventTriggered && !isInitialized) { if (!hasEventTriggered && !isInitialized) {
console.log("[Layout] 后端已就绪,立即开始初始化"); console.log("[Layout] Backend is ready, start initialization immediately");
hasEventTriggered = true; hasEventTriggered = true;
performInitialization(); performInitialization();
} }
} catch (err) { } catch (err) {
console.log("[Layout] 后端尚未就绪,等待启动完成事件"); console.log("[Layout] Backend not yet ready, waiting for startup completion event");
} }
}; };
const backupInitialization = setTimeout(() => { const backupInitialization = setTimeout(() => {
if (!hasEventTriggered && !isInitialized) { if (!hasEventTriggered && !isInitialized) {
console.warn("[Layout] 备用初始化触发1.5秒内未开始初始化"); console.warn("[Layout] Standby initialization trigger: initialization not started within 1.5 seconds");
hasEventTriggered = true; hasEventTriggered = true;
performInitialization(); performInitialization();
} }
@@ -409,9 +403,9 @@ const Layout = () => {
const emergencyInitialization = setTimeout(() => { const emergencyInitialization = setTimeout(() => {
if (!isInitialized) { if (!isInitialized) {
console.error("[Layout] 紧急初始化触发5秒内未完成初始化"); console.error("[Layout] Emergency initialization trigger: initialization not completed within 5 seconds");
removeLoadingOverlay(); removeLoadingOverlay();
notifyBackend("UI就绪").catch(() => {}); notifyBackend("UI ready").catch(() => {});
isInitialized = true; isInitialized = true;
} }
}, 5000); }, 5000);
@@ -427,10 +421,10 @@ const Layout = () => {
}; };
}, []); }, []);
// 语言和起始页设置 // Language and start page settings
useEffect(() => { useEffect(() => {
if (language) { if (language) {
dayjs.locale(language === "zh" ? "zh-cn" : language); dayjs.locale(language === "ru" ? "ru-ru" : language);
i18next.changeLanguage(language); i18next.changeLanguage(language);
} }
}, [language]); }, [language]);
@@ -442,17 +436,36 @@ const Layout = () => {
}, [start_page]); }, [start_page]);
if (!routersEles) { if (!routersEles) {
return <div className="h-screen w-screen bg-background" />; return <div className="h-screen w-screen bg-background" />;
} }
const AppLayout = () => {
const { state, isMobile } = useSidebar();
const location = useLocation();
const routersEles = useRoutes(routers);
return (
<>
<AppSidebar />
<main
className="h-screen w-full overflow-y-auto transition-[margin] duration-200 ease-linear"
>
<div className="h-full w-full relative">
{routersEles && React.cloneElement(routersEles, { key: location.pathname })}
</div>
</main>
</>
);
};
return ( return (
<SWRConfig value={{ errorRetryCount: 3 }}> <SWRConfig value={{ errorRetryCount: 3 }}>
<NoticeManager /> <NoticeManager />
<div className="h-screen w-screen bg-background text-foreground overflow-hidden"> <SidebarProvider defaultOpen={false}>
<div className="h-full w-full relative"> <AppLayout />
{React.cloneElement(routersEles, { key: location.pathname })} </SidebarProvider>
</div>
</div>
</SWRConfig> </SWRConfig>
); );
}; };

View File

@@ -8,7 +8,6 @@ import React, {
import { useLockFn } from "ahooks"; import { useLockFn } from "ahooks";
import { Virtuoso } from "react-virtuoso"; import { Virtuoso } from "react-virtuoso";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
import { useConnectionSetting } from "@/services/states"; import { useConnectionSetting } from "@/services/states";
import { useVisibility } from "@/hooks/use-visibility"; import { useVisibility } from "@/hooks/use-visibility";
import { useAppData } from "@/providers/app-data-provider"; import { useAppData } from "@/providers/app-data-provider";
@@ -16,7 +15,6 @@ import { closeAllConnections } from "@/services/api";
import parseTraffic from "@/utils/parse-traffic"; import parseTraffic from "@/utils/parse-traffic";
import { cn } from "@root/lib/utils"; import { cn } from "@root/lib/utils";
// Компоненты
import { BaseEmpty } from "@/components/base"; import { BaseEmpty } from "@/components/base";
import { ConnectionItem } from "@/components/connection/connection-item"; import { ConnectionItem } from "@/components/connection/connection-item";
import { ConnectionTable } from "@/components/connection/connection-table"; import { ConnectionTable } from "@/components/connection/connection-table";
@@ -26,7 +24,6 @@ import {
} from "@/components/connection/connection-detail"; } from "@/components/connection/connection-detail";
import { import {
BaseSearchBox, BaseSearchBox,
type SearchState,
} from "@/components/base/base-search-box"; } from "@/components/base/base-search-box";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { import {
@@ -36,14 +33,7 @@ import {
SelectTrigger, SelectTrigger,
SelectValue, SelectValue,
} from "@/components/ui/select"; } from "@/components/ui/select";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
import { import {
Tooltip, Tooltip,
@@ -52,7 +42,6 @@ import {
TooltipTrigger, TooltipTrigger,
} from "@/components/ui/tooltip"; } from "@/components/ui/tooltip";
// Иконки
import { import {
List, List,
Table2, Table2,
@@ -62,6 +51,7 @@ import {
ArrowUp, ArrowUp,
Menu, Menu,
} from "lucide-react"; } from "lucide-react";
import {SidebarTrigger} from "@/components/ui/sidebar";
const initConn: IConnections = { const initConn: IConnections = {
uploadTotal: 0, uploadTotal: 0,
@@ -73,7 +63,6 @@ type OrderFunc = (list: IConnectionsItem[]) => IConnectionsItem[];
const ConnectionsPage = () => { const ConnectionsPage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate();
const pageVisible = useVisibility(); const pageVisible = useVisibility();
const [match, setMatch] = useState(() => (_: string) => true); const [match, setMatch] = useState(() => (_: string) => true);
const [curOrderOpt, setOrderOpt] = useState("Default"); const [curOrderOpt, setOrderOpt] = useState("Default");
@@ -166,15 +155,6 @@ const ConnectionsPage = () => {
}); });
}, [connections]); }, [connections]);
const menuItems = [
{ label: t("Home"), path: "/home" },
{ label: t("Profiles"), path: "/profile" },
{ label: t("Settings"), path: "/settings" },
{ label: t("Logs"), path: "/logs" },
{ label: t("Proxies"), path: "/proxies" },
{ label: t("Rules"), path: "/rules" },
];
return ( return (
<div className="h-full w-full relative"> <div className="h-full w-full relative">
<div <div
@@ -184,6 +164,9 @@ const ConnectionsPage = () => {
)} )}
> >
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<div className="w-10">
<SidebarTrigger />
</div>
<h2 className="text-2xl font-semibold tracking-tight"> <h2 className="text-2xl font-semibold tracking-tight">
{t("Connections")} {t("Connections")}
</h2> </h2>
@@ -245,26 +228,6 @@ const ConnectionsPage = () => {
<Button size="sm" variant="destructive" onClick={onCloseAll}> <Button size="sm" variant="destructive" onClick={onCloseAll}>
{t("Close All")} {t("Close All")}
</Button> </Button>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" title={t("Menu")}>
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{menuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
disabled={location.pathname === item.path}
>
{item.label}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</TooltipProvider> </TooltipProvider>
</div> </div>

View File

@@ -1,5 +1,4 @@
import React, { useRef, useMemo, useCallback, useState } from "react"; import React, {useRef, useMemo, useCallback, useState, useEffect} from "react";
import { useNavigate } from "react-router-dom";
import { useLockFn } from "ahooks"; import { useLockFn } from "ahooks";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { toast } from "sonner"; import { toast } from "sonner";
@@ -22,12 +21,11 @@ import {
ChevronsUpDown, ChevronsUpDown,
Check, Check,
PlusCircle, PlusCircle,
Menu,
Wrench, Wrench,
AlertTriangle, AlertTriangle,
Loader2, Loader2,
Globe, Globe,
Send, Send, ExternalLink, RefreshCw,
} from "lucide-react"; } from "lucide-react";
import { useVerge } from "@/hooks/use-verge"; import { useVerge } from "@/hooks/use-verge";
import { useSystemState } from "@/hooks/use-system-state"; import { useSystemState } from "@/hooks/use-system-state";
@@ -37,14 +35,17 @@ import { ProxySelectors } from "@/components/home/proxy-selectors";
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"; import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
import { closeAllConnections } from "@/services/api"; import { closeAllConnections } from "@/services/api";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { updateProfile } from "@/services/cmds";
import { SidebarTrigger } from "@/components/ui/sidebar";
const MinimalHomePage: React.FC = () => { const MinimalHomePage: React.FC = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate();
const [isToggling, setIsToggling] = useState(false); const [isToggling, setIsToggling] = useState(false);
const [isUpdating, setIsUpdating] = useState(false);
const { profiles, patchProfiles, activateSelected, mutateProfiles } = const { profiles, patchProfiles, activateSelected, mutateProfiles } =
useProfiles(); useProfiles();
const viewerRef = useRef<ProfileViewerRef>(null); const viewerRef = useRef<ProfileViewerRef>(null);
const [uidToActivate, setUidToActivate] = useState<string | null>(null);
const profileItems = useMemo(() => { const profileItems = useMemo(() => {
const items = const items =
@@ -56,7 +57,7 @@ const MinimalHomePage: React.FC = () => {
const currentProfile = useMemo(() => { const currentProfile = useMemo(() => {
return profileItems.find(p => p.uid === profiles?.current); return profileItems.find(p => p.uid === profiles?.current);
}, [profileItems, profiles?.current]); }, [profileItems, profiles?.current]);
console.log(currentProfile); console.log("Current profile", currentProfile);
const currentProfileName = currentProfile?.name || profiles?.current; const currentProfileName = currentProfile?.name || profiles?.current;
const activateProfile = useCallback( const activateProfile = useCallback(
@@ -76,6 +77,15 @@ const MinimalHomePage: React.FC = () => {
[patchProfiles, activateSelected, mutateProfiles, t], [patchProfiles, activateSelected, mutateProfiles, t],
); );
useEffect(() => {
const uidToActivate = sessionStorage.getItem('activateProfile');
if (uidToActivate && profileItems.some(p => p.uid === uidToActivate)) {
activateProfile(uidToActivate, false);
sessionStorage.removeItem('activateProfile');
}
}, [profileItems, activateProfile]);
const handleProfileChange = useLockFn(async (uid: string) => { const handleProfileChange = useLockFn(async (uid: string) => {
if (profiles?.current === uid) return; if (profiles?.current === uid) return;
await activateProfile(uid, true); await activateProfile(uid, true);
@@ -128,85 +138,107 @@ const MinimalHomePage: React.FC = () => {
} }
}); });
const navMenuItems = [ const handleUpdateProfile = useLockFn(async () => {
{ label: "Profiles", path: "/profile" }, if (!currentProfile?.uid || currentProfile.type !== 'remote') return;
{ label: "Settings", path: "/settings" }, setIsUpdating(true);
{ label: "Logs", path: "/logs" }, try {
{ label: "Proxies", path: "/proxies" }, await updateProfile(currentProfile.uid);
{ label: "Connections", path: "/connections" }, toast.success(t("Profile Updated Successfully"));
{ label: "Rules", path: "/rules" }, mutateProfiles(); // Обновляем данные в UI
]; } catch (err: any) {
toast.error(t("Failed to update profile"), { description: err.message });
} finally {
setIsUpdating(false);
}
});
return ( return (
<div className="flex flex-col h-screen p-5"> <div className="h-full w-full flex flex-col">
<header className="absolute top-0 left-0 right-0 p-5 flex items-center justify-between z-20"> <header className="flex-shrink-0 p-5 grid grid-cols-3 items-center z-10">
<div className="w-10"></div> <div className="flex justify-start">
<SidebarTrigger />
{profileItems.length > 0 && ( </div>
<div className="flex-shrink-0"> <div className="justify-self-center flex flex-col items-center gap-2">
<DropdownMenu> <div className="relative">
<DropdownMenuTrigger asChild> {profileItems.length > 0 && (
<Button <div className="flex-shrink-0">
variant="outline" <DropdownMenu>
className="w-full max-w-[250px] sm:max-w-xs" <DropdownMenuTrigger asChild>
> <Button variant="outline" className="w-full max-w-[250px] sm:max-w-xs">
<span className="truncate">{currentProfileName}</span> <span className="truncate">{currentProfileName}</span>
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" /> <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button> </Button>
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent className="w-[--radix-dropdown-menu-trigger-width]"> <DropdownMenuContent className="w-[--radix-dropdown-menu-trigger-width]">
<DropdownMenuLabel>{t("Profiles")}</DropdownMenuLabel> <DropdownMenuLabel>{t("Profiles")}</DropdownMenuLabel>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
{profileItems.map((p) => ( {profileItems.map((p) => (
<DropdownMenuItem <DropdownMenuItem
key={p.uid} key={p.uid}
onSelect={() => handleProfileChange(p.uid)} onSelect={() => handleProfileChange(p.uid)}
> >
<span className="flex-1 truncate">{p.name}</span> <span className="flex-1 truncate">{p.name}</span>
{profiles?.current === p.uid && ( {profiles?.current === p.uid && (
<Check className="ml-4 h-4 w-4" /> <Check className="ml-4 h-4 w-4" />
)} )}
</DropdownMenuItem> </DropdownMenuItem>
))} ))}
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuItem onSelect={() => viewerRef.current?.create()}> <DropdownMenuItem onSelect={() => viewerRef.current?.create()}>
<PlusCircle className="mr-2 h-4 w-4" /> <PlusCircle className="mr-2 h-4 w-4" />
<span>{t("Add Profile")}</span> <span>{t("Add Profile")}</span>
</DropdownMenuItem> </DropdownMenuItem>
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>
</div>
)}
{currentProfile?.type === 'remote' && (
<div className="absolute top-1/2 -translate-y-1/2 left-full ml-2">
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
variant="ghost"
size="icon"
onClick={handleUpdateProfile}
disabled={isUpdating}
className="flex-shrink-0"
>
{isUpdating ? <Loader2 className="h-5 w-5 animate-spin" /> : <RefreshCw className="h-5 w-5" />}
</Button>
</TooltipTrigger>
<TooltipContent><p>{t("Update Profile")}</p></TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
)}
</div> </div>
)} </div>
<div className="flex justify-end">
<div className="w-10">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="icon">
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{navMenuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
>
{t(item.label)}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</header> </header>
<div className="flex items-center justify-center flex-grow w-full"> <main className="flex-1 overflow-y-auto flex items-center justify-center">
<div className="flex flex-col items-center gap-8 pt-10"> <div className="relative flex flex-col items-center gap-8 py-10 w-full max-w-4xl px-4">
{currentProfile?.announce && ( {currentProfile?.announce && (
<p className="relative -translate-y-15 text-xl font-semibold text-foreground max-w-lg text-center"> <div className="absolute -top-15 w-full flex justify-center text-center max-w-lg">
{currentProfile.announce} {currentProfile.announce_url ? (
</p> <a
href={currentProfile.announce_url}
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center gap-2 text-base font-semibold text-foreground hover:underline hover:opacity-80 transition-all whitespace-pre-wrap"
title={currentProfile.announce_url.replace(/\\n/g, '\n')}
>
<span>{currentProfile.announce.replace(/\\n/g, '\n')}</span>
<ExternalLink className="h-4 w-4 flex-shrink-0" />
</a>
) : (
<p className="text-base font-semibold text-foreground whitespace-pre-wrap">
{currentProfile.announce}
</p>
)}
</div>
)} )}
<div className="text-center"> <div className="text-center">
<h1 <h1
@@ -223,7 +255,7 @@ const MinimalHomePage: React.FC = () => {
<div className="scale-[7] my-16"> <div className="scale-[7] my-16">
<Switch <Switch
disabled={showTunAlert || isToggling} disabled={showTunAlert || isToggling || profileItems.length === 0}
checked={!!isProxyEnabled} checked={!!isProxyEnabled}
onCheckedChange={handleToggleProxy} onCheckedChange={handleToggleProxy}
aria-label={t("Toggle Proxy")} aria-label={t("Toggle Proxy")}
@@ -276,8 +308,8 @@ const MinimalHomePage: React.FC = () => {
</Alert> </Alert>
)} )}
</div> </div>
</div>
</div> </div>
</main>
<footer className="flex justify-center p-4 flex-shrink-0"> <footer className="flex justify-center p-4 flex-shrink-0">
{currentProfile?.support_url && ( {currentProfile?.support_url && (
<div className="flex items-center gap-2 text-sm text-muted-foreground"> <div className="flex items-center gap-2 text-sm text-muted-foreground">
@@ -286,7 +318,7 @@ const MinimalHomePage: React.FC = () => {
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<a href={currentProfile.support_url} target="_blank" rel="noopener noreferrer" className="transition-colors hover:text-primary"> <a href={currentProfile.support_url} target="_blank" rel="noopener noreferrer" className="transition-colors hover:text-primary">
{(currentProfile.support_url.includes('t.me') || currentProfile.support_url.includes('telegram')) ? ( {(currentProfile.support_url.includes('t.me') || currentProfile.support_url.includes('telegram') || currentProfile.support_url.startsWith('tg://')) ? (
<Send className="h-5 w-5" /> <Send className="h-5 w-5" />
) : ( ) : (
<Globe className="h-5 w-5" /> <Globe className="h-5 w-5" />

View File

@@ -1,5 +1,3 @@
// LogPage.tsx
import React, { import React, {
useMemo, useMemo,
useState, useState,
@@ -10,8 +8,7 @@ import React, {
import { Virtuoso } from "react-virtuoso"; import { Virtuoso } from "react-virtuoso";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useLocalStorage } from "foxact/use-local-storage"; import { useLocalStorage } from "foxact/use-local-storage";
import { useNavigate } from "react-router-dom"; import { Play, Pause, Trash2 } from "lucide-react";
import { Play, Pause, Trash2, Menu } from "lucide-react";
import { LogLevel } from "@/hooks/use-log-data"; import { LogLevel } from "@/hooks/use-log-data";
import { useClashInfo } from "@/hooks/use-clash"; import { useClashInfo } from "@/hooks/use-clash";
import { useEnableLog } from "@/services/states"; import { useEnableLog } from "@/services/states";
@@ -34,18 +31,10 @@ import {
SelectTrigger, SelectTrigger,
SelectValue, SelectValue,
} from "@/components/ui/select"; } from "@/components/ui/select";
import { import {SidebarTrigger} from "@/components/ui/sidebar";
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
const LogPage = () => { const LogPage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate();
const [enableLog, setEnableLog] = useEnableLog(); const [enableLog, setEnableLog] = useEnableLog();
const { clashInfo } = useClashInfo(); const { clashInfo } = useClashInfo();
const [logLevel, setLogLevel] = useLocalStorage<LogLevel>( const [logLevel, setLogLevel] = useLocalStorage<LogLevel>(
@@ -104,28 +93,16 @@ const LogPage = () => {
[], [],
); );
const menuItems = [
{ label: t("Home"), path: "/home" },
{ label: t("Profiles"), path: "/profile" },
{ label: t("Settings"), path: "/settings" },
{ label: t("Proxies"), path: "/proxies" },
{ label: t("Connections"), path: "/connections" },
{ label: t("Rules"), path: "/rules" },
];
return ( return (
<div className="h-full w-full relative"> <div className="h-full w-full relative">
{/* "Липкая" шапка */}
<div <div
className={cn( className={cn(
"absolute top-0 left-0 right-0 z-10 p-4 transition-all duration-200", "absolute top-0 left-0 right-0 z-10 p-4 transition-all duration-200",
// --- НАЧАЛО ИЗМЕНЕНИЙ ---
// Вместо блюра делаем солидный фон с тенью при прокрутке
{ "bg-background shadow-md": isScrolled }, { "bg-background shadow-md": isScrolled },
// --- КОНЕЦ ИЗМЕНЕНИЙ ---
)} )}
> >
<div className="flex justify-between items-center mb-4"> <div className="flex justify-between items-center mb-4">
<SidebarTrigger />
<h2 className="text-2xl font-semibold tracking-tight">{t("Logs")}</h2> <h2 className="text-2xl font-semibold tracking-tight">{t("Logs")}</h2>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Button <Button
@@ -146,26 +123,6 @@ const LogPage = () => {
{t("Clear")} {t("Clear")}
</Button> </Button>
)} )}
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" title={t("Menu")}>
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{menuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
disabled={location.pathname === item.path}
>
{item.label}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</div> </div>
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
@@ -187,7 +144,6 @@ const LogPage = () => {
</div> </div>
</div> </div>
{/* Возвращаем Virtuoso на место */}
<div <div
ref={scrollContainerRef} ref={scrollContainerRef}
className="absolute top-0 left-0 right-0 bottom-0 pt-32 overflow-y-auto" className="absolute top-0 left-0 right-0 bottom-0 pt-32 overflow-y-auto"

View File

@@ -41,14 +41,12 @@ import { ConfigViewer } from "@/components/setting/mods/config-viewer";
import { throttle } from "lodash-es"; import { throttle } from "lodash-es";
import { readTextFile } from "@tauri-apps/plugin-fs"; import { readTextFile } from "@tauri-apps/plugin-fs";
import { readText } from "@tauri-apps/plugin-clipboard-manager"; import { readText } from "@tauri-apps/plugin-clipboard-manager";
import { useLocation, useNavigate } from "react-router-dom"; import { useLocation } from "react-router-dom";
import { useListen } from "@/hooks/use-listen"; import { useListen } from "@/hooks/use-listen";
import { listen, TauriEvent } from "@tauri-apps/api/event"; import { listen, TauriEvent } from "@tauri-apps/api/event";
import { showNotice } from "@/services/noticeService"; import { showNotice } from "@/services/noticeService";
import { cn } from "@root/lib/utils"; import { cn } from "@root/lib/utils";
// Компоненты shadcn/ui
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { import {
Tooltip, Tooltip,
@@ -56,31 +54,19 @@ import {
TooltipProvider, TooltipProvider,
TooltipTrigger, TooltipTrigger,
} from "@/components/ui/tooltip"; } from "@/components/ui/tooltip";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
// Иконки
import { import {
ClipboardPaste,
X,
PlusCircle, PlusCircle,
RefreshCw, RefreshCw,
Zap, Zap,
FileText, FileText,
Loader2, Loader2,
Menu,
} from "lucide-react"; } from "lucide-react";
import { SidebarTrigger } from "@/components/ui/sidebar";
const ProfilePage = () => { const ProfilePage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const location = useLocation(); const location = useLocation();
const navigate = useNavigate();
const { addListener } = useListen(); const { addListener } = useListen();
const [url, setUrl] = useState(""); const [url, setUrl] = useState("");
const [disabled, setDisabled] = useState(false); const [disabled, setDisabled] = useState(false);
@@ -89,7 +75,6 @@ const ProfilePage = () => {
const [updateAllLoading, setUpdateAllLoading] = useState(false); const [updateAllLoading, setUpdateAllLoading] = useState(false);
const [enhanceLoading, setEnhanceLoading] = useState(false); const [enhanceLoading, setEnhanceLoading] = useState(false);
// Логика для "липкой" шапки
const scrollerRef = useRef<HTMLDivElement>(null); const scrollerRef = useRef<HTMLDivElement>(null);
const [isScrolled, setIsScrolled] = useState(false); const [isScrolled, setIsScrolled] = useState(false);
@@ -335,15 +320,6 @@ const ProfilePage = () => {
}; };
}, [mutateProfiles]); }, [mutateProfiles]);
const menuItems = [
{ label: t("Home"), path: "/home" },
{ label: t("Settings"), path: "/settings" },
{ label: t("Logs"), path: "/logs" },
{ label: t("Proxies"), path: "/proxies" },
{ label: t("Connections"), path: "/connections" },
{ label: t("Rules"), path: "/rules" },
];
return ( return (
<div className="h-full w-full relative"> <div className="h-full w-full relative">
<div <div
@@ -353,6 +329,9 @@ const ProfilePage = () => {
)} )}
> >
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<div className="w-10">
<SidebarTrigger />
</div>
<h2 className="text-2xl font-semibold tracking-tight"> <h2 className="text-2xl font-semibold tracking-tight">
{t("Profiles")} {t("Profiles")}
</h2> </h2>
@@ -424,74 +403,14 @@ const ProfilePage = () => {
<p>{t("View Runtime Config")}</p> <p>{t("View Runtime Config")}</p>
</TooltipContent> </TooltipContent>
</Tooltip> </Tooltip>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" title={t("Menu")}>
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{menuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
disabled={location.pathname === item.path}
>
{item.label}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</TooltipProvider> </TooltipProvider>
</div> </div>
<div className="flex flex-wrap items-center gap-2">
<div className="flex items-center gap-1 flex-grow sm:flex-grow-0">
<Input
type="text"
placeholder={t("Profile URL")}
value={url}
onChange={(e) => setUrl(e.target.value)}
className="h-9 min-w-[200px] flex-grow sm:w-80"
/>
{url ? (
<Button
variant="ghost"
size="icon"
title={t("Clear")}
onClick={() => setUrl("")}
className="h-9 w-9 flex-shrink-0"
>
<X className="h-4 w-4" />
</Button>
) : (
<Button
variant="ghost"
size="icon"
title={t("Paste")}
onClick={onCopyLink}
className="h-9 w-9 flex-shrink-0"
>
<ClipboardPaste className="h-4 w-4" />
</Button>
)}
</div>
<Button
onClick={onImport}
disabled={!url || disabled || importLoading}
className="h-9"
>
{importLoading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
{t("Import")}
</Button>
</div>
</div> </div>
<div <div
ref={scrollerRef} ref={scrollerRef}
className="absolute top-0 left-0 right-0 bottom-0 pt-40 overflow-y-auto" className="absolute top-0 left-0 right-0 bottom-0 pt-25 overflow-y-auto"
> >
<DndContext <DndContext
sensors={sensors} sensors={sensors}

View File

@@ -1,27 +1,17 @@
import useSWR from "swr"; import useSWR from "swr";
import { useEffect } from "react"; import React, { useEffect } from "react";
import { useLockFn } from "ahooks"; import { useLockFn } from "ahooks";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { closeAllConnections, getClashConfig } from "@/services/api"; import { closeAllConnections, getClashConfig } from "@/services/api";
import { patchClashMode } from "@/services/cmds"; import { patchClashMode } from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge"; import { useVerge } from "@/hooks/use-verge";
import { ProxyGroups } from "@/components/proxy/proxy-groups"; import { ProxyGroups } from "@/components/proxy/proxy-groups";
import { ProviderButton } from "@/components/proxy/provider-button"; import { ProviderButton } from "@/components/proxy/provider-button";
import { import { SidebarTrigger } from "@/components/ui/sidebar";
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Menu } from "lucide-react";
const ProxyPage = () => { const ProxyPage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate();
const { data: clashConfig, mutate: mutateClash } = useSWR( const { data: clashConfig, mutate: mutateClash } = useSWR(
"getClashConfig", "getClashConfig",
@@ -50,18 +40,12 @@ const ProxyPage = () => {
} }
}, [curMode]); }, [curMode]);
const menuItems = [
{ label: t("Home"), path: "/home" },
{ label: t("Profiles"), path: "/profile" },
{ label: t("Settings"), path: "/settings" },
{ label: t("Logs"), path: "/logs" },
{ label: t("Connections"), path: "/connections" },
{ label: t("Rules"), path: "/rules" },
];
return ( return (
<div className="h-full flex flex-col"> <div className="h-full flex flex-col">
<div className="p-4 pb-2 flex justify-between items-center"> <div className="p-4 pb-2 flex justify-between items-center">
<div className="w-10">
<SidebarTrigger />
</div>
<h2 className="text-2xl font-semibold tracking-tight"> <h2 className="text-2xl font-semibold tracking-tight">
{t("Proxies")} {t("Proxies")}
</h2> </h2>
@@ -80,26 +64,6 @@ const ProxyPage = () => {
</Button> </Button>
))} ))}
</div> </div>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" title={t("Menu")}>
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{menuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
disabled={location.pathname === item.path}
>
{item.label}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</div> </div>

View File

@@ -1,33 +1,20 @@
import { useState, useMemo, useRef, useEffect, useCallback } from "react"; import React, { useState, useMemo, useRef, useEffect, useCallback } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
import { Virtuoso, VirtuosoHandle } from "react-virtuoso"; import { Virtuoso, VirtuosoHandle } from "react-virtuoso";
import { useAppData } from "@/providers/app-data-provider"; import { useAppData } from "@/providers/app-data-provider";
import { useVisibility } from "@/hooks/use-visibility"; import { useVisibility } from "@/hooks/use-visibility";
import { cn } from "@root/lib/utils"; import { cn } from "@root/lib/utils";
// Компоненты
import { BaseEmpty } from "@/components/base"; import { BaseEmpty } from "@/components/base";
import RuleItem from "@/components/rule/rule-item"; import RuleItem from "@/components/rule/rule-item";
import { ProviderButton } from "@/components/rule/provider-button"; import { ProviderButton } from "@/components/rule/provider-button";
import { BaseSearchBox, SearchState } from "@/components/base/base-search-box"; import { BaseSearchBox } from "@/components/base/base-search-box";
import { ScrollTopButton } from "@/components/layout/scroll-top-button"; import { ScrollTopButton } from "@/components/layout/scroll-top-button";
import { Button } from "@/components/ui/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
// Иконки import { SidebarTrigger } from "@/components/ui/sidebar";
import { Menu } from "lucide-react";
const RulesPage = () => { const RulesPage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate();
const { rules = [], refreshRules, refreshRuleProviders } = useAppData(); const { rules = [], refreshRules, refreshRuleProviders } = useAppData();
const [match, setMatch] = useState(() => (_: string) => true); const [match, setMatch] = useState(() => (_: string) => true);
const virtuosoRef = useRef<VirtuosoHandle>(null); const virtuosoRef = useRef<VirtuosoHandle>(null);
@@ -36,24 +23,17 @@ const RulesPage = () => {
const [isScrolled, setIsScrolled] = useState(false); const [isScrolled, setIsScrolled] = useState(false);
const pageVisible = useVisibility(); const pageVisible = useVisibility();
// --- НАЧАЛО ИЗМЕНЕНИЙ 1 ---
// Разделяем логику на два безопасных useEffect
useEffect(() => { useEffect(() => {
// Этот эффект сработает только один раз при монтировании компонента
refreshRules(); refreshRules();
refreshRuleProviders(); refreshRuleProviders();
// eslint-disable-next-line react-hooks/exhaustive-deps }, []);
}, []); // Пустой массив зависимостей = запуск только один раз
useEffect(() => { useEffect(() => {
// Этот эффект будет срабатывать только при изменении видимости страницы
if (pageVisible) { if (pageVisible) {
refreshRules(); refreshRules();
refreshRuleProviders(); refreshRuleProviders();
} }
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [pageVisible]); }, [pageVisible]);
// --- КОНЕЦ ИЗМЕНЕНИЙ 1 ---
const filteredRules = useMemo(() => { const filteredRules = useMemo(() => {
return rules.filter((item) => match(item.payload)); return rules.filter((item) => match(item.payload));
@@ -75,21 +55,9 @@ const RulesPage = () => {
virtuosoRef.current?.scrollTo({ top: 0, behavior: "smooth" }); virtuosoRef.current?.scrollTo({ top: 0, behavior: "smooth" });
}, []); }, []);
// --- НАЧАЛО ИЗМЕНЕНИЙ 2 ---
// Оборачиваем обработчик поиска в useCallback для стабильности
const handleSearch = useCallback((matcher: (content: string) => boolean) => { const handleSearch = useCallback((matcher: (content: string) => boolean) => {
setMatch(() => matcher); setMatch(() => matcher);
}, []); }, []);
// --- КОНЕЦ ИЗМЕНЕНИЙ 2 ---
const menuItems = [
{ label: t("Home"), path: "/home" },
{ label: t("Profiles"), path: "/profile" },
{ label: t("Settings"), path: "/settings" },
{ label: t("Logs"), path: "/logs" },
{ label: t("Proxies"), path: "/proxies" },
{ label: t("Connections"), path: "/connections" },
];
return ( return (
<div className="h-full w-full relative"> <div className="h-full w-full relative">
@@ -100,35 +68,17 @@ const RulesPage = () => {
)} )}
> >
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<div className="w-10">
<SidebarTrigger />
</div>
<h2 className="text-2xl font-semibold tracking-tight"> <h2 className="text-2xl font-semibold tracking-tight">
{t("Rules")} {t("Rules")}
</h2> </h2>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="w-70"> <div className="w-70">
{/* Передаем стабильную функцию handleSearch в пропс */}
<BaseSearchBox onSearch={handleSearch} /> <BaseSearchBox onSearch={handleSearch} />
</div> </div>
<ProviderButton /> <ProviderButton />
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" title={t("Menu")}>
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{menuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
disabled={location.pathname === item.path}
>
{item.label}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</div> </div>
</div> </div>
@@ -150,7 +100,6 @@ const RulesPage = () => {
<BaseEmpty /> <BaseEmpty />
)} )}
</div> </div>
<ScrollTopButton onClick={scrollToTop} show={showScrollTop} /> <ScrollTopButton onClick={scrollToTop} show={showScrollTop} />
</div> </div>
); );

View File

@@ -7,23 +7,14 @@ import SettingVergeAdvanced from "@/components/setting/setting-verge-advanced";
import SettingClash from "@/components/setting/setting-clash"; import SettingClash from "@/components/setting/setting-clash";
import SettingSystem from "@/components/setting/setting-system"; import SettingSystem from "@/components/setting/setting-system";
import { showNotice } from "@/services/noticeService"; import { showNotice } from "@/services/noticeService";
import { useNavigate } from "react-router-dom";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card"; import { Card, CardContent } from "@/components/ui/card";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Menu, Github, HelpCircle, Send } from "lucide-react"; import { Menu, Github, HelpCircle, Send } from "lucide-react";
import { cn } from "@root/lib/utils"; import { cn } from "@root/lib/utils";
import { SidebarTrigger } from "@/components/ui/sidebar";
const SettingPage = () => { const SettingPage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate();
const scrollContainerRef = useRef<HTMLDivElement>(null); const scrollContainerRef = useRef<HTMLDivElement>(null);
const [isScrolled, setIsScrolled] = useState(false); const [isScrolled, setIsScrolled] = useState(false);
@@ -46,14 +37,6 @@ const SettingPage = () => {
const toGithubRepo = useLockFn(() => const toGithubRepo = useLockFn(() =>
openWebUrl("https://github.com/coolcoala/clash-verge-rev-lite"), openWebUrl("https://github.com/coolcoala/clash-verge-rev-lite"),
); );
const menuItems = [
{ label: t("Home"), path: "/home" },
{ label: t("Profiles"), path: "/profile" },
{ label: t("Logs"), path: "/logs" },
{ label: t("Proxies"), path: "/proxies" },
{ label: t("Connections"), path: "/connections" },
{ label: t("Rules"), path: "/rules" },
];
return ( return (
<div className="h-full w-full relative"> <div className="h-full w-full relative">
@@ -63,9 +46,13 @@ const SettingPage = () => {
{ "bg-background/80 backdrop-blur-sm": isScrolled }, { "bg-background/80 backdrop-blur-sm": isScrolled },
)} )}
> >
<div className="w-10">
<SidebarTrigger />
</div>
<h2 className="text-2xl font-semibold tracking-tight"> <h2 className="text-2xl font-semibold tracking-tight">
{t("Settings")} {t("Settings")}
</h2> </h2>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Button <Button
variant="ghost" variant="ghost"
@@ -75,26 +62,6 @@ const SettingPage = () => {
> >
<Github className="h-5 w-5" /> <Github className="h-5 w-5" />
</Button> </Button>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" title={t("Menu")}>
<Menu className="h-5 w-5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuLabel>{t("Menu")}</DropdownMenuLabel>
<DropdownMenuSeparator />
{menuItems.map((item) => (
<DropdownMenuItem
key={item.path}
onSelect={() => navigate(item.path)}
disabled={location.pathname === item.path}
>
{item.label}
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</div> </div>

View File

@@ -203,6 +203,7 @@ interface IProfileItem {
home?: string; home?: string;
support_url?: string; support_url?: string;
announce?: string; announce?: string;
announce_url?: string;
} }
interface IProfileOption { interface IProfileOption {
@@ -210,6 +211,7 @@ interface IProfileOption {
with_proxy?: boolean; with_proxy?: boolean;
self_proxy?: boolean; self_proxy?: boolean;
update_interval?: number; update_interval?: number;
update_always?: boolean;
timeout_seconds?: number; timeout_seconds?: number;
danger_accept_invalid_certs?: boolean; danger_accept_invalid_certs?: boolean;
merge?: string; merge?: string;
@@ -752,6 +754,7 @@ interface IVergeConfig {
enable_global_hotkey?: boolean; enable_global_hotkey?: boolean;
enable_dns_settings?: boolean; enable_dns_settings?: boolean;
primary_action?: "tun-mode" | "system-proxy"; primary_action?: "tun-mode" | "system-proxy";
enable_send_hwid?: boolean;
proxy_auto_config?: boolean; proxy_auto_config?: boolean;
pac_file_content?: string; pac_file_content?: string;
proxy_host?: string; proxy_host?: string;