Improve server picker layout and profile activation flow
This commit is contained in:
@@ -408,6 +408,12 @@ function ProfileGroup({
|
||||
|| feature.operations.profileRefresh?.target === profile.id;
|
||||
const controlsBlocked = operationBlocked(feature.operations, 'profileSelect');
|
||||
const selectedServer = profileServer(profile, profile.desiredServerId);
|
||||
const canActivate = !applied && feature.selection.desiredProfileId !== profile.id;
|
||||
const localStatus = profileError?.message || (profile.subscription.status === 'stale'
|
||||
? `Последнее обновление не удалось. Данные от ${profile.subscription.fetchedAt
|
||||
? new Date(profile.subscription.fetchedAt).toLocaleString('ru-RU', { dateStyle: 'short', timeStyle: 'short' })
|
||||
: 'предыдущей загрузки'}.`
|
||||
: '');
|
||||
return <section className={`client-profile-group${expanded ? ' is-expanded' : ''}${applied ? ' is-active' : ''}`}>
|
||||
<div className="client-profile-header">
|
||||
<button
|
||||
@@ -426,7 +432,12 @@ function ProfileGroup({
|
||||
<small>{subscriptionDomain(profile.subscription.host)}</small>
|
||||
</span>
|
||||
</button>
|
||||
<ProfileUsage profile={profile} />
|
||||
{canActivate ? <button
|
||||
className="client-profile-activate"
|
||||
type="button"
|
||||
disabled={feature.activateBlocked || !selectedServer}
|
||||
onClick={() => feature.onActivate(profile.id)}
|
||||
>Сделать активной</button> : <ProfileUsage profile={profile} />}
|
||||
<button
|
||||
className={`client-profile-refresh${refreshing ? ' is-refreshing' : ''}`}
|
||||
type="button"
|
||||
@@ -472,13 +483,7 @@ function ProfileGroup({
|
||||
<span role="status">{feature.renameDuplicate ? 'Такое имя уже используется.' : ''}</span>
|
||||
</form>}
|
||||
|
||||
<div className="client-profile-local-status" role="status">
|
||||
{profileError?.message || (profile.subscription.status === 'stale'
|
||||
? `Последнее обновление не удалось. Данные от ${profile.subscription.fetchedAt
|
||||
? new Date(profile.subscription.fetchedAt).toLocaleString('ru-RU', { dateStyle: 'short', timeStyle: 'short' })
|
||||
: 'предыдущей загрузки'}.`
|
||||
: '\u00a0')}
|
||||
</div>
|
||||
{localStatus && <div className="client-profile-local-status" role="status">{localStatus}</div>}
|
||||
|
||||
{visited && <div
|
||||
id={`client-profile-${profile.id}`}
|
||||
@@ -486,12 +491,6 @@ function ProfileGroup({
|
||||
aria-hidden={!expanded}
|
||||
inert={!expanded ? true : undefined}
|
||||
>
|
||||
{!applied && feature.selection.desiredProfileId !== profile.id && <button
|
||||
className="client-profile-activate"
|
||||
type="button"
|
||||
disabled={feature.activateBlocked || !selectedServer}
|
||||
onClick={() => feature.onActivate(profile.id)}
|
||||
>Сделать активной</button>}
|
||||
{!profile.desiredServerId && <p className="client-profile-server-hint">Выберите сервер этой подписки</p>}
|
||||
{renderServerPicker(profile, {
|
||||
disabled: controlsBlocked,
|
||||
|
||||
Reference in New Issue
Block a user