66 lines
1.8 KiB
TypeScript
66 lines
1.8 KiB
TypeScript
import axios from 'axios';
|
|
import type { NextPage } from 'next';
|
|
import { ChangeEvent, FormEvent, useState } from 'react';
|
|
|
|
const Apps: NextPage = () => {
|
|
const [formData, setFormData] = useState({
|
|
name: null,
|
|
acs_url: null,
|
|
entity_id: null,
|
|
});
|
|
|
|
const [metadata, setMetadata] = useState({
|
|
sso_url: null,
|
|
entity_id: null,
|
|
certificate: null,
|
|
});
|
|
|
|
const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
|
|
setFormData({
|
|
...formData,
|
|
[e.target.name]: e.target.value.trim()
|
|
});
|
|
}
|
|
|
|
const createApp = async (e: FormEvent) => {
|
|
e.preventDefault();
|
|
|
|
const {data} = await axios.post('/api/apps', {
|
|
...formData
|
|
});
|
|
|
|
setMetadata(data);
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<form onSubmit={createApp} className="px-8 pt-6 pb-8 mb-4 bg-white rounded shadow-md">
|
|
<div className="mb-4">
|
|
<label className="block mb-2 text-sm">
|
|
App Name
|
|
<input type="text" name="name" onChange={handleInputChange} required className="w-full px-3 py-2 border rounded" placeholder="App Name" />
|
|
</label>
|
|
</div>
|
|
|
|
<div className="mb-4">
|
|
<label className="block mb-2 text-sm">
|
|
ACS URL
|
|
<input type="text" name="acs_url" onChange={handleInputChange} required className="w-full px-3 py-2 border rounded" placeholder="ACS URL" />
|
|
</label>
|
|
</div>
|
|
|
|
<div className="mb-4">
|
|
<label className="block mb-2 text-sm">
|
|
Entity ID
|
|
<input type="text" name="entity_id" onChange={handleInputChange} required className="w-full px-3 py-2 border rounded" placeholder="Entity ID" />
|
|
</label>
|
|
</div>
|
|
|
|
<button type="submit" className="px-4 py-2 text-white bg-blue-500 rounded">Create App</button>
|
|
</form>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Apps;
|