Skip to content

fixing update password #275

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
CropWatchDevelopment merged 1 commit into from
Jul 3, 2025
Merged

fixing update password #275

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/lib/components/UI/dashboard/DataRowItem.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@

<Collapse
classes={{
root: 'mb-1 bg-gray-200 dark:bg-gray-800/30 w-full ',
root: 'mb-1 bg-gray-200 dark:bg-gray-800/30 w-full shadow-sm dark:shadow-gray-600/50',
icon: 'text-gray-400 dark:text-gray-500 data-[open=true]:rotate-90'
}}
open={defaultCollapse}
Expand Down
11 changes: 6 additions & 5 deletions src/lib/components/UI/dashboard/components/Button.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,11 +18,12 @@
<button
type="button"
onclick={handleClick}
class="flex w-full items-center justify-center gap-2 rounded-md border border-transparent
bg-transparent px-3 py-1.5 text-sm font-medium text-blue-600
transition-colors duration-200 hover:bg-blue-50 hover:text-zinc-300
focus:outline-none focus-visible:ring-1 focus-visible:ring-blue-400 focus-visible:ring-offset-1
dark:bg-white/8 dark:text-zinc-300 dark:hover:bg-slate-700 dark:focus-visible:ring-blue-500"
class="
flex w-full items-center justify-center gap-2 rounded-md border border-transparent
bg-blue-300 px-3 py-1.5 text-sm
font-medium text-blue-600 transition-colors duration-200 hover:bg-blue-400 hover:text-zinc-300
focus:outline-none focus-visible:ring-1 focus-visible:ring-blue-400 focus-visible:ring-offset-1
dark:bg-white/8 dark:text-zinc-300 dark:hover:bg-slate-700 dark:focus-visible:ring-blue-500"
aria-label="View details"
>
{text}
Expand Down
11 changes: 11 additions & 0 deletions src/lib/components/charts/Vpd.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -221,3 +221,14 @@
</script>

<div bind:this={container}></div>

<!-- <section>
<Vpd
lineData={[
{ date: '2023-01-01', temp: 20, humidity: 60 },
{ date: '2023-01-02', temp: 22, humidity: 65 },
{ date: '2023-01-03', temp: 18, humidity: 55 },
{ date: '2023-01-04', temp: 25, humidity: 70 }
]}
/>
</section> -->
26 changes: 26 additions & 0 deletions src/lib/stores/toast.svelte.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,3 +63,29 @@ export function info(message: string, options = {}) {
export function neutral(message: string, options = {}) {
return add({ type: 'neutral', message, ...options });
}

// USEAGE:
// Toast demo functions
// function showSuccessToast() {
// success('Success! Operation completed successfully.');
// }

// function showErrorToast() {
// error('Error! Something went wrong.');
// }

// function showWarningToast() {
// warning('Warning! Please be careful with this action.');
// }

// function showInfoToast() {
// info('Info: This is an informational message.');
// }

// function showNeutralToast() {
// neutral('This is a neutral notification.');
// }

// function showCustomToast() {
// success('Custom toast with longer timeout!', { timeout: 10000 });
// }
283 changes: 0 additions & 283 deletions src/routes/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,135 +7,6 @@
import { success, error, warning, info, neutral } from '$lib/stores/toast.svelte';
import { onMount } from 'svelte';

// Dynamic import for RevoGrid to avoid SSR issues
let RevoGrid: any = $state(null);
let ColumnRegular: any = $state(null);

let { data } = $props();

let grid_component_instance: any = $state(); // To bind the component instance if needed
const columns: any[] = $state([
{
name: '🎰 Ticker',
prop: 'symbol',
sortable: true,
pin: 'colPinStart',
cellTemplate: (h, { model, prop }) => h('strong', null, model[prop])
},
{
name: '🔠 Company Name',
prop: 'company_name',
size: 300
},
{
name: '',
prop: '📉 graph',
readonly: true,
// Custom cell render
cellTemplate(h) {
const barWidth = 5;
const barSpacing = 5;
const maxHeight = 30;
const bars = [];

// Draw 5 vertical bars with random heights
for (let i = 0; i < 5; i++) {
const barHeight = Math.random() * maxHeight;
const x = i * (barWidth + barSpacing);
const y = maxHeight - barHeight + 5;

// Create the rectangle element for the bar
const rect = h('rect', {
key: i,
x,
y,
width: barWidth,
height: barHeight,
fill: 'blue',
stroke: 'black'
});

// Append the rectangle to the group
bars.push(rect);
}
return h(
'svg',
{
width: '100%',
height: maxHeight + 10
},
h('g', {}, bars)
);
}
},
{
name: '💰 Price',
prop: 'price',
columnType: 'numeric',
sortable: true
},
{
name: '⬆️ Change',
prop: 'change',
columnType: 'numeric',
sortable: true
},
{
name: '% Change',
prop: 'percent_change'
}
]);

const source = $state([
{
symbol: 'AAPL',
company_name: 'Apple Inc.',
price: 150.25,
change: 1.5,
percent_change: '1.01%'
},
{
symbol: 'MSFT',
company_name: 'Microsoft Corp.',
price: 280.75,
change: -0.5,
percent_change: '-0.18%'
},
{
symbol: 'GOOGL',
company_name: 'Alphabet Inc.',
price: 2700.5,
change: 10.2,
percent_change: '0.38%'
}
]);

onMount(() => {
// Dynamically import RevoGrid only on the client side
if (browser) {
import('@revolist/svelte-datagrid').then((module) => {
RevoGrid = module.RevoGrid;
ColumnRegular = module.ColumnRegular;
});
}

const interval = setInterval(() => {
source.forEach((item) => {
item.price = parseFloat((Math.random() * 3000).toFixed(2));
item.change = parseFloat((Math.random() * 20 - 10).toFixed(2)); // Random change between -10 and 10
const priceForCalc = item.price === 0 ? 1 : item.price; // Avoid division by zero
item.percent_change = `${((item.change / priceForCalc) * 100).toFixed(2)}%`;
});
// With Svelte 5 runes, direct modification of $state array items should be reactive.
// If the grid doesn't update, uncommenting the next line might be necessary if RevoGrid needs an explicit push.
// source = [...source];
}, 2000); // Update every 2 seconds

return () => {
clearInterval(interval); // Clear interval on component destroy
};
});

// Define the AlertPoint type locally to match the one in NumberLine.svelte
type AlertPoint = {
id: number;
Expand All @@ -149,47 +20,6 @@

let showDataPicker = $state(false);

// Toast demo functions
function showSuccessToast() {
success('Success! Operation completed successfully.');
}

function showErrorToast() {
error('Error! Something went wrong.');
}

function showWarningToast() {
warning('Warning! Please be careful with this action.');
}

function showInfoToast() {
info('Info: This is an informational message.');
}

function showNeutralToast() {
neutral('This is a neutral notification.');
}

function showCustomToast() {
success('Custom toast with longer timeout!', { timeout: 10000 });
}

// Code examples as strings to avoid syntax issues
const importExample =
"import { success, error, warning, info, neutral } from '$lib/stores/toast';";
const usageExample = `// Basic usage
success('Success message');
error('Error message');
warning('Warning message');
info('Info message');
neutral('Neutral message');

// With custom options
success('Custom message', {
timeout: 8000, // Duration in ms (default: 5000)
dismissible: true // Allow manual dismissal (default: true)
});`;

let points: AlertPoint[] = $state([
// // Way 1: operator >
// { id: 1, name: 'Warning High', operator: '>', value: 30, color: '#FFA500' },
Expand All @@ -203,62 +33,13 @@ success('Custom message', {
</script>

<div class="container mx-auto p-8">
<h1 class="mb-6 text-3xl font-bold">Toast Notification Demo</h1>
<button
onclick={() => goto('/app/dashboard')}
class="bg-info rounded-md px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Goto Dashboard
</button>

<div class="bg-card-light dark:bg-card-dark rounded-lg p-6 shadow-md">
<p class="mb-4">Click the buttons below to see different types of toast notifications:</p>

<div class="flex flex-wrap gap-3">
<button
onclick={showSuccessToast}
class="bg-success rounded-md px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Success Toast
</button>

<button
onclick={showErrorToast}
class="bg-error rounded-md px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Error Toast
</button>

<button
onclick={showWarningToast}
class="rounded-md bg-amber-500 px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Warning Toast
</button>

<button
onclick={showInfoToast}
class="rounded-md bg-blue-500 px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Info Toast
</button>

<button
onclick={showNeutralToast}
class="rounded-md bg-gray-500 px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Neutral Toast
</button>

<button
onclick={showCustomToast}
class="rounded-md bg-purple-500 px-4 py-2 text-white transition-opacity hover:opacity-90"
>
Custom Toast (10s)
</button>
</div>
</div>

<div class="mt-8">
<h2 class="mb-4 text-xl font-bold">How to Use Toast Notifications</h2>
<div class="bg-card-light dark:bg-card-dark rounded-lg p-6 shadow-md">
Expand Down Expand Up @@ -308,67 +89,3 @@ success('Custom message', {
</div>
</div>
</div>

<div class="bg-foreground-light dark:bg-foreground-dark p-4 dark:text-white">
{#if browser && RevoGrid}
<RevoGrid
bind:this={grid_component_instance}
{columns}
{source}
filter={true}
canFocus={true}
sorters={true}
columnTypes={{
numeric: {
name: 'Numeric',
autoSize: true,
// Numeric columns will have this default sorting
sortable: true
}
}}
/>
{:else}
<p>Loading data grid...</p>
{/if}
</div>

<section>
<Vpd
lineData={[
{ date: '2023-01-01', temp: 20, humidity: 60 },
{ date: '2023-01-02', temp: 22, humidity: 65 },
{ date: '2023-01-03', temp: 18, humidity: 55 },
{ date: '2023-01-04', temp: 25, humidity: 70 }
]}
/>
</section>

<style>
pre {
font-family: monospace;
font-size: 0.9rem;
line-height: 1.5;
}

/* RevoGrid dark/light mode styles */
:global(.dark) .bg-foreground-light.dark\:bg-foreground-dark :global(revogr-data) {
--rgb-text: 255, 255, 255; /* White text for dark mode */
--color-text: rgb(var(--rgb-text));
}

:global(:not(.dark)) .bg-foreground-light.dark\:bg-foreground-dark :global(revogr-data) {
--rgb-text: 0, 0, 0; /* Black text for light mode */
--color-text: rgb(var(--rgb-text));
}

/* Optional: Ensure header text has good contrast in both modes */
:global(.dark) .bg-foreground-light.dark\:bg-foreground-dark :global(revogr-header) {
--rgb-header-text: 255, 255, 255;
--header-text-color: rgb(var(--rgb-header-text));
}

:global(:not(.dark)) .bg-foreground-light.dark\:bg-foreground-dark :global(revogr-header) {
--rgb-header-text: 0, 0, 0;
--header-text-color: rgb(var(--rgb-header-text));
}
</style>
Loading