| 1 |
import { useMemo } from '@wordpress/element'; |
| 2 |
import { __ } from '@wordpress/i18n'; |
| 3 |
import { applyFilters } from '@wordpress/hooks'; |
| 4 |
import WelcomeStatCard from '../components/WelcomeStatCard'; |
| 5 |
import { isWidgetEffectivelyOn } from '../utils'; |
| 6 |
import { |
| 7 |
btnEp, |
| 8 |
btnPg, |
| 9 |
btnPrimary, |
| 10 |
btnPs, |
| 11 |
btnSecondary, |
| 12 |
btnSm, |
| 13 |
btnUpk, |
| 14 |
btnZb, |
| 15 |
} from '../tw'; |
| 16 |
|
| 17 |
const linkInline = 'font-semibold text-uks-brand hover:underline'; |
| 18 |
|
| 19 |
const Welcome = ({ widgets, settings, isPro = false }) => { |
| 20 |
const stats = useMemo(() => { |
| 21 |
const wcWidgets = widgets.ultimate_store_kit_active_modules || []; |
| 22 |
const eddWidgets = widgets.ultimate_store_kit_edd_modules || []; |
| 23 |
const otherWidgets = widgets.ultimate_store_kit_general_modules || []; |
| 24 |
|
| 25 |
const wcSettings = settings.ultimate_store_kit_active_modules || {}; |
| 26 |
const eddSettings = settings.ultimate_store_kit_edd_modules || {}; |
| 27 |
const otherSettings = settings.ultimate_store_kit_general_modules || {}; |
| 28 |
|
| 29 |
const countActive = (widgetList, savedSettings) => { |
| 30 |
let active = 0; |
| 31 |
let inactive = 0; |
| 32 |
widgetList.forEach((w) => { |
| 33 |
if (w.type !== 'checkbox') return; |
| 34 |
if (!isPro && w.widget_type === 'pro') { |
| 35 |
inactive++; |
| 36 |
return; |
| 37 |
} |
| 38 |
const val = savedSettings[w.name]; |
| 39 |
if (isWidgetEffectivelyOn(w, val, isPro)) { |
| 40 |
active++; |
| 41 |
} else { |
| 42 |
inactive++; |
| 43 |
} |
| 44 |
}); |
| 45 |
return { active, inactive, total: active + inactive }; |
| 46 |
}; |
| 47 |
|
| 48 |
const wc = countActive(wcWidgets, wcSettings); |
| 49 |
const edd = countActive(eddWidgets, eddSettings); |
| 50 |
const other = countActive(otherWidgets, otherSettings); |
| 51 |
|
| 52 |
const all = { |
| 53 |
active: wc.active + edd.active + other.active, |
| 54 |
inactive: wc.inactive + edd.inactive + other.inactive, |
| 55 |
total: wc.total + edd.total + other.total, |
| 56 |
}; |
| 57 |
|
| 58 |
return { all, wc, edd, other }; |
| 59 |
}, [widgets, settings, isPro]); |
| 60 |
|
| 61 |
return ( |
| 62 |
<div> |
| 63 |
<div className="mb-4 grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-4"> |
| 64 |
<WelcomeStatCard |
| 65 |
title={__('All Widgets', 'ultimate-store-kit')} |
| 66 |
data={stats.all} |
| 67 |
color="#f59e0b" |
| 68 |
/> |
| 69 |
<WelcomeStatCard |
| 70 |
title={__('WooCommerce', 'ultimate-store-kit')} |
| 71 |
data={stats.wc} |
| 72 |
color="#ef4444" |
| 73 |
/> |
| 74 |
<WelcomeStatCard |
| 75 |
title={__('EDD', 'ultimate-store-kit')} |
| 76 |
data={stats.edd} |
| 77 |
color="#10b981" |
| 78 |
/> |
| 79 |
<WelcomeStatCard |
| 80 |
title={__('Other', 'ultimate-store-kit')} |
| 81 |
data={stats.other} |
| 82 |
color="#3b82f6" |
| 83 |
/> |
| 84 |
</div> |
| 85 |
|
| 86 |
{(() => { |
| 87 |
const WelcomeExtra = applyFilters('usk.admin.welcomeExtra', null); |
| 88 |
return WelcomeExtra ? <WelcomeExtra /> : null; |
| 89 |
})()} |
| 90 |
|
| 91 |
<div className="mb-4 grid grid-cols-1 gap-4 sm:grid-cols-2"> |
| 92 |
<div className="rounded-lg border border-solid border-gray-100 bg-white p-5"> |
| 93 |
<h3 className="m-0 mb-2 text-base font-bold text-slate-800"> |
| 94 |
{__('Support And Feedback', 'ultimate-store-kit')} |
| 95 |
</h3> |
| 96 |
<p className="my-2 text-[13px] leading-relaxed text-slate-500"> |
| 97 |
{__( |
| 98 |
'Feeling like to consult with an expert? Take live Chat support immediately from', |
| 99 |
'ultimate-store-kit' |
| 100 |
)}{' '} |
| 101 |
<a |
| 102 |
href="https://storekit.pro/" |
| 103 |
target="_blank" |
| 104 |
rel="noopener noreferrer" |
| 105 |
className={linkInline} |
| 106 |
> |
| 107 |
UltimateStoreKit |
| 108 |
</a> |
| 109 |
.{' '} |
| 110 |
{__( |
| 111 |
'We are always ready to help you 24/7.', |
| 112 |
'ultimate-store-kit' |
| 113 |
)} |
| 114 |
</p> |
| 115 |
<p className="my-2 text-[13px] leading-relaxed text-slate-500"> |
| 116 |
<strong> |
| 117 |
{__( |
| 118 |
"Or if you're facing technical issues with our plugin, then please create a support ticket", |
| 119 |
'ultimate-store-kit' |
| 120 |
)} |
| 121 |
</strong> |
| 122 |
</p> |
| 123 |
<div className="mt-3 flex flex-wrap gap-2"> |
| 124 |
<a |
| 125 |
className={btnPrimary} |
| 126 |
target="_blank" |
| 127 |
rel="noopener noreferrer" |
| 128 |
href="https://bdthemes.com/knowledge-base/ultimate-store-kit/" |
| 129 |
> |
| 130 |
{__('Knowledge Base', 'ultimate-store-kit')} |
| 131 |
</a> |
| 132 |
<a |
| 133 |
className={btnSecondary} |
| 134 |
target="_blank" |
| 135 |
rel="noopener noreferrer" |
| 136 |
href="https://bdthemes.com/support/" |
| 137 |
> |
| 138 |
{__('Get Support', 'ultimate-store-kit')} |
| 139 |
</a> |
| 140 |
</div> |
| 141 |
</div> |
| 142 |
|
| 143 |
<div className="rounded-lg border border-solid border-gray-100 bg-white p-5"> |
| 144 |
<h3 className="m-0 mb-2 text-base font-bold text-slate-800"> |
| 145 |
{__('System Requirement', 'ultimate-store-kit')} |
| 146 |
</h3> |
| 147 |
<p className="mb-3 text-[13px] leading-relaxed text-slate-500"> |
| 148 |
{__( |
| 149 |
'Make sure your server meets the minimum requirements for optimal performance.', |
| 150 |
'ultimate-store-kit' |
| 151 |
)} |
| 152 |
</p> |
| 153 |
<div> |
| 154 |
<div className="flex items-center justify-between border-b border-slate-100 py-2 text-[13px] text-slate-700 last:border-b-0"> |
| 155 |
<span>{__('PHP Version', 'ultimate-store-kit')}</span> |
| 156 |
<span className="rounded-lg bg-emerald-100 px-2.5 py-0.5 text-[11px] font-semibold text-emerald-800"> |
| 157 |
{__('OK', 'ultimate-store-kit')} |
| 158 |
</span> |
| 159 |
</div> |
| 160 |
<div className="flex items-center justify-between border-b border-slate-100 py-2 text-[13px] text-slate-700 last:border-b-0"> |
| 161 |
<span>{__('Memory Limit', 'ultimate-store-kit')}</span> |
| 162 |
<span className="rounded-lg bg-emerald-100 px-2.5 py-0.5 text-[11px] font-semibold text-emerald-800"> |
| 163 |
{__('OK', 'ultimate-store-kit')} |
| 164 |
</span> |
| 165 |
</div> |
| 166 |
<div className="flex items-center justify-between border-b border-slate-100 py-2 text-[13px] text-slate-700 last:border-b-0"> |
| 167 |
<span>{__('Max Execution Time', 'ultimate-store-kit')}</span> |
| 168 |
<span className="rounded-lg bg-emerald-100 px-2.5 py-0.5 text-[11px] font-semibold text-emerald-800"> |
| 169 |
{__('OK', 'ultimate-store-kit')} |
| 170 |
</span> |
| 171 |
</div> |
| 172 |
</div> |
| 173 |
</div> |
| 174 |
</div> |
| 175 |
|
| 176 |
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2"> |
| 177 |
<div className="rounded-lg border border-solid border-gray-100 bg-white p-5"> |
| 178 |
<h3 className="m-0 mb-2 text-base font-bold text-slate-800"> |
| 179 |
{__('Feedback', 'ultimate-store-kit')} |
| 180 |
</h3> |
| 181 |
<p className="my-2 text-[13px] leading-relaxed text-slate-500"> |
| 182 |
{__( |
| 183 |
'We are always looking for feedback from our users. If you have any suggestions or feedback, please let us know.', |
| 184 |
'ultimate-store-kit' |
| 185 |
)} |
| 186 |
</p> |
| 187 |
<div className="mt-3 flex flex-wrap gap-2"> |
| 188 |
<a |
| 189 |
className={btnSecondary} |
| 190 |
target="_blank" |
| 191 |
rel="noopener noreferrer" |
| 192 |
href="https://feedback.bdthemes.com/b/6vr2250l/feature-requests/" |
| 193 |
> |
| 194 |
{__('Request Feature', 'ultimate-store-kit')} |
| 195 |
</a> |
| 196 |
</div> |
| 197 |
</div> |
| 198 |
|
| 199 |
<div className="rounded-lg border border-solid border-gray-100 bg-white p-5"> |
| 200 |
<h3 className="m-0 mb-2 text-base font-bold text-slate-800"> |
| 201 |
{__('Try Our Other Plugins', 'ultimate-store-kit')} |
| 202 |
</h3> |
| 203 |
<p className="my-2 text-[13px] leading-relaxed text-slate-500"> |
| 204 |
{__( |
| 205 |
'Element Pack, Prime Slider, Ultimate Post Kit, Pixel Gallery & Live Copy Paste addons for Elementor.', |
| 206 |
'ultimate-store-kit' |
| 207 |
)} |
| 208 |
</p> |
| 209 |
<div className="mt-3 flex flex-wrap gap-2"> |
| 210 |
<a |
| 211 |
className={`${btnSm} ${btnEp}`} |
| 212 |
target="_blank" |
| 213 |
rel="noopener noreferrer" |
| 214 |
href="https://wordpress.org/plugins/bdthemes-element-pack-lite/" |
| 215 |
> |
| 216 |
{__('Element Pack', 'ultimate-store-kit')} |
| 217 |
</a> |
| 218 |
<a |
| 219 |
className={`${btnSm} ${btnPs}`} |
| 220 |
target="_blank" |
| 221 |
rel="noopener noreferrer" |
| 222 |
href="https://wordpress.org/plugins/bdthemes-prime-slider-lite/" |
| 223 |
> |
| 224 |
{__('Prime Slider', 'ultimate-store-kit')} |
| 225 |
</a> |
| 226 |
<a |
| 227 |
className={`${btnSm} ${btnUpk}`} |
| 228 |
target="_blank" |
| 229 |
rel="noopener noreferrer" |
| 230 |
href="https://wordpress.org/plugins/ultimate-post-kit/" |
| 231 |
> |
| 232 |
{__('Ultimate Post Kit', 'ultimate-store-kit')} |
| 233 |
</a> |
| 234 |
<a |
| 235 |
className={`${btnSm} ${btnPg}`} |
| 236 |
target="_blank" |
| 237 |
rel="noopener noreferrer" |
| 238 |
href="https://wordpress.org/plugins/pixel-gallery/" |
| 239 |
> |
| 240 |
{__('Pixel Gallery', 'ultimate-store-kit')} |
| 241 |
</a> |
| 242 |
<a |
| 243 |
className={`${btnSm} ${btnZb}`} |
| 244 |
target="_blank" |
| 245 |
rel="noopener noreferrer" |
| 246 |
href="https://wordpress.org/plugins/zoloblocks/" |
| 247 |
> |
| 248 |
{__('ZoloBlocks', 'ultimate-store-kit')} |
| 249 |
</a> |
| 250 |
</div> |
| 251 |
</div> |
| 252 |
</div> |
| 253 |
</div> |
| 254 |
); |
| 255 |
}; |
| 256 |
|
| 257 |
export default Welcome; |
| 258 |
|
